如何通过 CloudFront 实现分段上传？答案

【问题标题】：How to Implement Multipart Upload via CloudFront?如何通过 CloudFront 实现分段上传？
【发布时间】：2019-01-01 20:22:55
【问题描述】：

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

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

现在对于分块上传（或 AWS 术语中的分段上传），我不知道如何通过 CloudFront 进行上传（只有 S3 的文档）。

所以我的问题是通过 CloudFront 实现分段上传所需的所有步骤是什么？

我的尝试： 我在 CloudFront 控制台中启用了Forward Query Strings 选项，并将参数uploads 添加到白名单。我为 S3 尝试了 guides，并测试了这段代码以启动多部分上传（注意添加的 uploads 参数）：

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

它发送了一个预检请求 (OPTIONS) 并返回 200 OK 并带有这些响应标头：

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

但真正的 POST 请求返回 403 Forbidden 并带有这些响应标头：

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

【问题讨论】：

AWS Support Response 关于这个问题的回答：stackoverflow.com/questions/41058096/…
多部分上传到 S3 的 AWS 文档（Cloudfront 没有文档）：docs.aws.amazon.com/AmazonS3/latest/dev/…

标签： javascript amazon-web-services amazon-s3 amazon-cloudfront

【解决方案1】：

很遗憾Cloudfront不支持上传，需要通过S3路径或者presign url上传文件。

【讨论】：

您的意思是 Cloudfront 通常不适合上传，还是 分段上传？因为正如您在我的问题中看到的那样，我可以通过 Cloudfront 上传。
我们现在在动态内容 API 之前使用 CloudFront，以利用它的优势，一开始，是的，CloudFront 不适合这些东西。

【解决方案2】：

最后，我必须关闭 Cloudfront 的 Restrict Viewer Access 选项。使用 Multipart Upload 似乎不能很好地发挥作用，或者查询字符串参数转发在打开时无法正常工作。

【讨论】：