javascript 如何通过CloudFront实现多部分上传?

dzhpxtsq  于 2023-09-29  发布在  Java
关注(0)|答案(3)|浏览(118)

这是我目前通过CloudFront成功上传文件到S3的代码

  1. let fileObject = thisUploader.getFile(id); //returns File API
  2. let reader = new FileReader(); //using the FileReader API to read files
  3. reader.onload = function () {
  4. $.ajax({
  5. url: 'http://sampleId.cloudfront.net/video.mp4?Policy=examplePolicy&Signature=exampleSignature&Key-Pair-Id=exampleKey',
  6. type: 'PUT',
  7. contentType: fileObject.type,
  8. data: reader.result,
  9. processData: false,
  10. crossDomain: true
  11. });
  12. }
  13. reader.readAsArrayBuffer(fileObject);

现在对于分块上传(或AWS术语中的multipart),我不知道如何通过CloudFront完成(只有S3的文档)。

所以我的问题是通过CloudFront实现多部分上传所需的所有步骤是什么?
**尝试情况:**我在CloudFront控制台中开启了Forward Query Strings选项,并将参数uploads加入白名单。我尝试了S3的指南,并测试了启动多部分上传的代码(注意添加的uploads参数):

  1. $.ajax({
  2. url: 'http://sampleId.cloudfront.net/video.mp4'+'?uploads'+'&Policy=examplePolicy&Signature=exampleSignature&Key-Pair-Id=exampleKey',
  3. type: 'POST',
  4. contentType: 'application/json'
  5. });

它发送了一个preflight请求(OPTIONS),并返回200 OK,其中包含以下响应头:

  1. Access-Control-Allow-Headers: content-type
  2. Access-Control-Allow-Methods: GET, PUT, HEAD, POST
  3. Access-Control-Allow-Origin: *
  4. Access-Control-Max-Age: 3000
  5. Connection: keep-alive
  6. Content-Length: 0
  7. Date: Thu, 02 Aug 2018 07:03:01 GMT
  8. Server: AmazonS3
  9. Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
  10. Via: 1.1 7111a943ba8327e4a6723f271fc9f7c4.cloudfront.net (CloudFront)
  11. X-Amz-Cf-Id: oeE4D7FM8TyxE7NtmVidbyADGLqvwOnc49XdI1ps-tHIUKXrdm2PGg==
  12. X-Cache: Miss from cloudfront

但真实的的POST请求返回403 Forbidden,并带有以下响应头:

  1. Accept-Ranges: none
  2. Access-Control-Allow-Methods: GET, PUT, HEAD, POST
  3. Access-Control-Allow-Origin: *
  4. Access-Control-Max-Age: 3000
  5. Age: 13976
  6. Connection: keep-alive
  7. Content-Length: 445
  8. Content-Type: text/html
  9. Date: Thu, 02 Aug 2018 03:10:05 GMT
  10. ETag: "07468170dde4c34c5990eee2d1c2ae1e"
  11. Last-Modified: Wed, 01 Aug 2018 08:34:47 GMT
  12. Server: AmazonS3
  13. Via: 1.1 7111a943ba8327e4a6723f271fc9f7c4.cloudfront.net (CloudFront)
  14. X-Amz-Cf-Id: EWPPWw0l9BTmhFFe39HWdUuCp2Ab2L3yE5bj9wEqFvl3mVbNmt28Pg==
  15. x-amz-replication-status: FAILED
  16. x-amz-version-id: yLhhgPevn2eeofp7kEmcvixP3iW.vj7S
  17. X-Cache: Error from cloudfront
qkf9rpyu

qkf9rpyu1#

不幸的是,Cloudfront不支持上传,您需要通过S3路径或预签名URL上传文件。

iugsix8n

iugsix8n2#

最后,我必须关闭Cloudfront的Restrict Viewer Access选项。它似乎不能很好地与Multipart Upload一起使用,或者当它打开时查询字符串param forward不能正常工作。

oxalkeyp

oxalkeyp3#

此问题可能是由CloudFront中的WAF规则引起的。我也是这样的,下面是我的解决方案,希望能对你有所帮助。
在AWS WAF中,有一个名为AWS-AWSManagedRulesCommonRuleSet的规则集,其中包含一个名为SizeRestrictions_BODY的规则。这个规则限制了content-length的大小。如果您将此规则覆盖为“允许",则问题将得到解决。

相关问题