S3跨源资源共享不工作 [英] S3 Cross-Origin Resource Sharing Not working

问题描述

我尝试使用 blur.js 模糊用户上传的图片，我将图片存储在Amazon S3上。我设置了我认为是正确的CORS配置，但图像不能模糊，我在浏览器中得到这个错误：

I'm trying to use blur.js to blur user uploaded images, and I'm storing the images on Amazon S3. I've set up what I think to be the correct CORS configuration, but the images can't be blurred and I get this error in the browser:

  Unable to get image data from canvas because the canvas has been tainted by cross-origin data.

这是我的CORS配置：

Here's my CORS configuration:

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

任何想法出了什么问题？

Any idea what's wrong?

推荐答案

我怀疑您没有使用CORS支持所需的正确的S3端点地址格式。

I have a suspicion that you're not using the correct S3 endpoint address format that's required for CORS support.

ie S3存储桶支持以下两种格式：

i.e. S3 buckets support both of these formats:

1. http://bucket.s3.amazonaws.com/object


2. http://s3.amazonaws.com/bucket/object

1. http://bucket.s3.amazonaws.com/object
2. http://s3.amazonaws.com/bucket/object

但根据文档：

使用CORS，您可以请配置您的存储桶以显式启用来自website.s3-website-us-east-1.amazonaws.com的跨源请求。

with CORS, you can configure your bucket to explicitly enable cross-origin requests from website.s3-website-us-east-1.amazonaws.com.

这篇关于S3跨源资源共享不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！