Question

我正在设置一个vuejs / DropzoneJS-基于kfei的vue-s3-dropzone应用程序的松散应用程序。它旨在使用AWS Lambda函数和AWS S3存储桶将文件（通过PUT方法）无服务器上载到AWS S3。我基本上是从源https://xxxxxxxxxxxxxxxxxxx在http://localhost:8080处获取XMLHttpRequest的。 '已被CORS政策阻止：对预检请求的响应未通过访问控制检查：当我尝试将图像上传到S3存储桶时，它没有HTTP正常状态和403错误代码。我能做些什么

这就是我所做的：

创建了一个S3存储桶
在S3存储桶设置中设置存储桶策略和CORS配置：

enter image description here enter image description here
创建了一个lambda函数，该函数应该签名一个URL，该URL允许将每个文件的PUT上传到S3，其中Role角色执行的Lambda在S3存储桶上具有PutObject和PutObjectAcl权限：

enter image description here
通过OPTIONS方法（通过预检）和具有以下CORS设置的PUT方法设置Api Gateway API：

b。 OPTIONS方法具有模拟后端集成，并且集成响应返回以下内容：

访问控制允许标题“内容类型，X-Amz日期，授权，X-Api-Key，X-Amz-安全令牌，x-要求” 访问控制允许方法'PUT，OPTIONS'
访问控制允许来源“ *”

c。 PUT方法具有：

“ Access-Control-Allow-Origin”：“ *”
在AWS Api Gateway中：设置api密钥和使用计划

lambda代码：

if (pla1.equals(pla2))

预期：文件成功上传实际：可能存在CORS问题。

Answer 1

如果您从诸如Postman或Node.js服务器之类的API客户端上载文件，

getSignedUrl 可以正常工作，但是正如您指出的那样，您看到预检检查失败了，我假设您正在使用某种HTML表单和前端js。

从AWS JavaScript SDK Docs关于getSignedUrl：

注意：使用预签名时并非支持所有操作参数网址。某些参数，例如SSECustomerKey，ACL，过期，发送内容时，必须提供ContentLength或Tagging作为标题请求。 如果您使用预先签名的URL从浏览器和需要使用这些字段，请参见createPresignedPost（）。

在调用getSignedUrl并从浏览器发送时设置“过期”参数时，您需要在Lambda代码中使用createPresignedPost而不是getSignedUrl。

然后，您需要从浏览器到S3而不是PUT进行POST。

NB ：请记住使用POST更新S3的CORS规则

上传到S3时如何解决403禁止错误

1 个答案: