放大发布导致 AccessDenied 错误

Question

我将一个简单的 Web 应用程序部署到S3via amplify publish。托管已Cloudfront启用（我在设置托管时在放大中选择了 PROD 环境）并且我正在该eu-central-1地区工作。但是每当我尝试访问CloudfrontURL 时，都会收到AccessDenied错误消息。

我遵循了https://medium.com/quasar-framework/creating-a-quasar-framework-application-with-aws-amplify-services-part-1-4-9a795f38e16d 上的教程，唯一不同的是区域（教程使用，us-east-1而我使用eu-central-1）。

S3 和 Cloudfront 的配置是由 amplify 完成的，因此理论上应该可以工作：

云前线：

• Origin Domain Name or Path:（quasar-demo-hosting-bucket-dev.s3-eu-central-1.amazonaws.com原来是没有的eu-central-1，后来没用我手动添加的）。
• 原产地标识： hostingS3Bucket
• 产地类型： S3 Origin

S3 存储桶策略：

{
    "Version": "2012-10-17",
    "Id": "MyPolicy",
    "Statement": [
        {
            "Sid": "APIReadForGetBucketObjects",
            "Effect": "Allow",
            "Principal": {
                "AWS": "arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity ********"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::quasar-demo-hosting-bucket-dev/*"
        }
    ]
}

研究表明，Cloudfront访问S3其他地区的存储桶可能会暂时遇到问题。但是我手动将区域添加到原点，Cloudfront并且我已经等了 24 小时。我仍然收到“拒绝访问”。

我怀疑这与S3存储桶不在默认us-east-1区域中有关，并且Cloudfront在这种情况下放大设置不正确。

如何获得放大以正确设置S3存储桶，Cloudfront以便我可以通过CloudfrontURL访问我的网站？

Answer 1

For those whom the first solution does not work, also make sure that the javascript.config.DistributionDir in your project-config.json file is configured correctly. That can also cause the AccessDenied error (as I just learned the hard way).

Amplify 期望您的应用入口点 (index.html) 位于您配置的目录中的第一级。因此，如果您接受放大默认配置 ( dist) 并使用将构建文件置于层次结构中更深层次的项目（dist/<project name>在 angular 8 的情况下），那么它在发布后表现为 403 AccessDenied 错误。放大和 s3 托管选项都是如此。

文档：https : //docs.aws.amazon.com/amplify/latest/userguide/manual-deploys.html（见文末）

Answer 2

虽然 @raj-paliwal 的答案极大地帮助我解决了最初的问题，但 Amplify 此后用新选项解决了该问题。

如果您键入Amplify add hosting（或Amplify update hosting对于现有站点），Amplify 将为您提供 的选项Hosting with Amplify Console。

选择此选项还将创建一个包含 S3 和 CloudFront 的托管环境，但 Amplify 将为您管理一切。有了这个选项，我就没有任何问题了。看来第一个选项修复了我遇到的错误。

如果您想要将现有站点从手动 CloudFront 和 S3 托管升级到Hosting with Amplify Console，您必须致电amplify update hosting并选择新选项。

Answer 3

感谢您的附加信息。

您的S3存储桶策略看起来不错。

• 关于Origin Domain name or Path，它总是S3出现在下拉列表中，因此无需更新它region

• 但是，您的Cloudfront Origin.
  你需要选择Restrict Bucket access到Yes

  根据AWS documentation
  如果您希望要求用户始终使用 CloudFront URL 而不是 Amazon S3 URL 访问您的 Amazon S3 内容，请单击是。当您使用签名 URL 或签名 cookie 来限制对您的内容的访问时，这很有用。在帮助中，请参阅“通过 CloudFront 提供私有内容

• 现在创建new Identity或select Existing Identity

• 单击“创建”按钮以保存 Origin。