云形成模板 - 具有云前端分配的 S3 存储桶网站 - 分配无法访问源

Question

我只是想在S3桶上获得一个静态站点，并且只能通过CloudFront分发访问它，但是缺少了一些东西，我无法弄清楚是什么。

当前我的堆栈有

• 一个S3桶用于站点托管
• 为站点提供服务的云前端发行版
• 一个bucket policy，只允许分发访问bucket
• 分发版
的默认缓存策略

当试图从桶网站url直接访问网站时，我得到一个403(禁止访问，拒绝访问)，这是好的。
当试图从分发域访问它时，我得到一个通用错误页面，消息Failed to contact the origin.
当试图从我注册的域访问它时，我得到一个403错误页面，消息The request could not be satisfied.随后是关于如何修复它的泛型提示(登录后，联系网站所有者，检查文档等)

因为我使用CloudFormation模板从我的cli每一个资源都在同一个区域，和其他一切看起来对我来说都是正确的，但显然有些东西是错误的。

<<h4> CloudFormation模板/h4>

Resources:
BucketPolicy:
Type: 'AWS::S3::BucketPolicy'
DependsOn:
- AppBucket
- CloudFrontDistribution
Properties:
Bucket: !Ref AppBucket
PolicyDocument:
Id: MyPolicy
Version: '2012-10-17'
Statement:
- Sid: PolicyForCloudFrontPrivateContent
Action: s3:GetObject
Effect: Allow
Principal:
Service: cloudfront.amazonaws.com
Condition:
StringLike:
aws:Referer: !Sub 'https://*.${CloudFrontDistribution}.cloudfront.net/*'
Resource: !Sub arn:aws:s3:::${AppBucket}/*
CloudFrontDistribution:
Type: AWS::CloudFront::Distribution
DependsOn:
- AppBucket
- DefaultCachePolicy
Properties:
DistributionConfig:
Enabled: true
Origins:
- Id: AppBucket
DomainName: !GetAtt AppBucket.DomainName
OriginPath: /*
S3OriginConfig: {}
DefaultCacheBehavior:
ViewerProtocolPolicy: redirect-to-https
TargetOriginId: AppBucket
CachePolicyId: !Ref DefaultCachePolicy
AppBucket:
Type: 'AWS::S3::Bucket'
Properties:
BucketName: 'test-spa-stack-bucket-app'
PublicAccessBlockConfiguration:
BlockPublicAcls : false
BlockPublicPolicy : false
IgnorePublicAcls : false
RestrictPublicBuckets : false
VersioningConfiguration:
Status: Enabled
BucketEncryption:
ServerSideEncryptionConfiguration:
- ServerSideEncryptionByDefault:
SSEAlgorithm: 'AES256'
WebsiteConfiguration:
IndexDocument: index.html

DefaultCachePolicy:
Type: AWS::CloudFront::CachePolicy
Properties: 
CachePolicyConfig: 
Name: test-cache-policy
DefaultTTL: 10
MaxTTL: 10
MinTTL: 1
ParametersInCacheKeyAndForwardedToOrigin: 
CookiesConfig: 
CookieBehavior: none
EnableAcceptEncodingBrotli: true
EnableAcceptEncodingGzip: true
HeadersConfig: 
HeaderBehavior: none
QueryStringsConfig: 
QueryStringBehavior: none

Answer 1

您的桶策略似乎有问题。

你需要允许CloudFront发行版的Origin访问控制来访问S3桶。

{
"Version": "2012-10-17",
"Statement": {
"Sid": "AllowCloudFrontServicePrincipalReadOnly",
"Effect": "Allow",
"Principal": {
"Service": "cloudfront.amazonaws.com"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::DOC-EXAMPLE-BUCKET/*",
"Condition": {
"StringEquals": {
"AWS:SourceArn": "arn:aws:cloudfront::111122223333:distribution/EDFDVBD6EXAMPLE"
}
}
}
}

您还需要在CloudFront分发定义中提供相同的原始访问控制id:

CloudFrontDistribution:
Type: AWS::CloudFront::Distribution
DependsOn:
- AppBucket
- DefaultCachePolicy
Properties:
DistributionConfig:
Enabled: true
Origins:
- Id: AppBucket
DomainName: !GetAtt AppBucket.DomainName
OriginPath: /*
OriginAccessControlId: "EDFDVBD6EXAMPLE" <- PROVIDE ID HERE
DefaultCacheBehavior:
ViewerProtocolPolicy: redirect-to-https
TargetOriginId: AppBucket
CachePolicyId: !Ref DefaultCachePolicy

请参见限制对Amazon S3源的访问