我在 DigitalOcean Spaces UI 中添加了添加的 CORS 配置，如下所示：
我仍然没有从浏览器获得对象请求的 access-control-allow-origin 标头。
从我的后端上传对象时，“public-read”设置为 ACL。
我期待，当对象（在我的情况下为图像）请求是从浏览器中的 Web 应用发出时，它的响应标头应该有 access-control-allow-origin: http://my.machine.localhost。
这是HTML canvas toDataURL() 的硬性要求，当画布组件包含来自非原始来源的图像时。
【问题讨论】：
标签： javascript reactjs amazon-s3 canvas digital-ocean
首先是localhost问题
DO (DigitalOCean) 不允许您在 CORS 源字段中配置 localhost。为此，您可以更新您的 /etc/hosts 为您的 localhost 提供一个可接受的名称。我有
127.0.0.1 my.machine.localhost
这样很容易在 DO 空间 CORS 设置中进行配置，在浏览器中点击 my.machine.localhost 应该会打开在 localhost 上运行的应用（我在端口 80 上运行我的应用）。
二、CORS标头
在解决问题或必须多次清除缓存之前禁用 CDN。使用curl 或httpie 或类似的东西来测试，因为浏览器倾向于缓存对象。
我假设对象是使用public-read ACL 上传的。
现在使用 curl 或 httpie 检查请求和响应标头。
$ http -v https://***.***.digitaloceanspaces.com/static/images/logo.png
这是棘手的部分 - 即使您配置了 CORS，响应也不会包含 access-control-allow-origin 标头。要使其正常工作，您需要在请求中设置 Origin 标头，该标头需要与您的存储桶的 DO Spaces UI 中配置的至少一个来源相匹配。
$ http -v https://***.***.digitaloceanspaces.com/static/images/logo.png "Origin:http://my.machine.localhost"
这将根据您的配置返回 access-control-allow-origin 和 access-control-allow-methods。
DO 空间实现与 AWS S3 相同的 API。所以卡住的时候最好找找S3文档。我在 AWS S3 CORS 文档 https://docs.aws.amazon.com/AmazonS3/latest/userguide/cors-troubleshooting.html
中找到了这个如果缺少标头，Amazon S3 不会将请求视为 跨域请求，并且不会在 回应。
网上有很多教程建议使用 s3cmd 并使用通配符设置 CORS * - 这样做之前要三思而后行，因为它非常不安全。
【讨论】：