S3 存储桶引用自身的 CORS 策略

Question

在我的 css 文件中，我有相对路径：

.css-emoticon.smile{
      background: url('../../images/sprites.png');
      background-position: -16px -18px ; 
 }

但是，当我从 S3 中提取 sprite.png 文件以加载到我的网站时，我收到了禁止的 403 错误。 css 文件可以很好地从 S3 加载到我的站点。

我的 S3 位于子域中：http://media.example.com and the site that loads in files from S3 is http://example.com

这是我的 CORS 文件：

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>Content-*</AllowedHeader>
        <AllowedHeader>Host</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

关于如何设置 CORS 策略以允许在我的 CSS 中使用相对 URL 的任何想法？

非常感谢

Answer 1

看来我没有设置存储桶策略以允许访问 ../../images/ 文件夹。

新存储桶策略（CORS 看起来是正确的）

{
    "Version": "2008-10-17",
    "Statement": [
        {
            "Sid": "AllowPublicRead",
            "Effect": "Allow",
            "Principal": {
                "AWS": "*"
            },
            "Action": "s3:GetObject",
            "Resource": [
                "arn:aws:s3:::media.example.com/prod",
                "arn:aws:s3:::media.example.com/images"
            ]
        }
    ]
}

S3 存储桶引用自身的 CORS 策略

CORS policy for S3 bucket referencing itself

css

amazon-s3

amazon-web-services