Cloudflare R2 处理跨域问题

最近,我一直在研究 Cloudflare R2,发现它是一个非常棒的存储解决方案,但遇到了一些跨域问题。我原本以为我可以轻松地使用任何来源进行访问,但事实证明,并非如此。

R2 的默认配置会阻止跨域请求。如果你想从不同的域名或端口访问 R2 对象,就需要进行一些额外的配置,下面我从头开始配置一次。

操作步骤

1.创建存储桶

位置选择亚太地区, 默认存储类先择标准

2.配置自定义域

这个要求有域名托管在Cloudflare上, 没有的话,可以不用配置

3.配置CORS策略

这是我们今天的重头戏, 很多人都会在这里踩坑。这里不仅要配置AllowedOrigins, 还要配置AllowedHeaders

[
  {
    "AllowedOrigins": [
      "https:*.601234.xyz"
    ],
    "AllowedMethods": [
      "GET",
      "PUT",
      "POST",
      "HEAD"
    ],
    "AllowedHeaders": [
      "*"
    ],
    "MaxAgeSeconds": 2
  }
]

4. 配置API令牌

这要主要是权限这里, 要根据自己需求选择。 像我需要在页面上上传图片就得选择读写权限

5.配置S3客户端参数

按图需要,把参数填入对应的内容


结语

总的来说,Cloudflare R2 是一个非常方便的存储解决方案,但你需要留意跨域问题并进行相应的配置。希望我的经验可以帮到大家,顺利解决跨域问题,享受 R2 带来的便利。

推荐阅读