【问题标题】:Google Storage signed URL expiration results in 400 error with no CORS headersGoogle Storage 签名的 URL 过期导致 400 错误,没有 CORS 标头
【发布时间】:2019-07-30 06:57:37
【问题描述】:

长话短说:对已过期签名PUT URL 响应的请求不包括成功上传到未过期签名PUT URL 的CORS 标头。

我们提供允许用户上传视频的服务。我们的后端 API 会生成一个签名的 Google 存储 URL,基于浏览器的客户端应用程序可以将块上传到该 URL。

不幸的是,在较慢的连接上,这些 URL 可能会在使用之前过期。当我们使用 Azure Blob Storage 或 Amazon S3 作为存储介质时,我们的重试机制将检测到故障 (403),为该特定块请求新 URL,然后继续上传。

在 Google 存储上这不起作用,原因很简单:虽然 OPTIONS 成功返回,并且成功的 PUT 请求包含 access-control-allow-origin 标头,但上传失败(接收 400 状态代码的那些)不会,我们在控制台中记录了以下错误:

从源“https://www.example.com”访问“https://storage.googleapis.com/ourbucket/uploads%2F20190308%2F5c822a942d1bd1000183a4a6%2Flawbarnd.mp4_c6b701ce-1687-4fb5-a453-61875c1b6d9a__000007?GoogleAccessId=user@project.iam.gserviceaccount.com&Expires=1552034512&Signature=L6pvUQX5UEa7GESO%2Bj12yR8%2FXln3tz1SDUA%2Bkf1NNx9eTvmUxTdgROYo30p4s%2FGGhXYwr%2BUdgnDuZ66pjX7YS0N5PO5BIr6LULtpR6i2xNC8Y2sKmpv5QF66FHqSBWK0YoLc%2B21MnJMPRgUBSXMcoyWJCJ%2FAapVgRe9QH%2BQt86agf6h0yEmHv48qgVJpzRH%2FbiNJKD7oiOyJc%2Fcon2y2hqsCo6x8buZVuPzTZg6ddHqmqKkscjABoT7bq1%2Bz7Sqkq3Vul%2B5XQfw3CvoNjELpuqVQA%2F0v0RXE86JkOnXf2kQKKlL%2Fq9AwidsEMF05n1LlBVRKSdv8qNKTCVFwBOU%2BMg%3D%3D”处的 XMLHttpRequest 已被 CORS 策略阻止:请求的资源上不存在“Access-Control-Allow-Origin”标头。

我们的bucket CORS配置如下:

[
    {
        "maxAgeSeconds": 3600,
        "method": ["*"],
        "origin": ["https://www.example.com"],
        "responseHeader": ["*"]
    }
]

我们的客户端上传代码:

this.bytesUploaded = 0;
this.xhr = new XMLHttpRequest();
this.xhr.open(method, url, true);

let keys = _.keys(headers);
if (keys !== null && keys !== undefined && keys.length > 0) {
    for (let i = 0; i < keys.length; ++i) {
        this.xhr.setRequestHeader(keys[i], headers[keys[i]]);
    }
}

this.xhr.upload.addEventListener('progress', this.onProgress);
this.xhr.addEventListener('load', this.onLoad);
this.xhr.addEventListener('error', this.onError);
this.xhr.addEventListener('abort', this.onAbort);

this.xhr.setRequestHeader('Content-Type', ' '); // we unset this because it interferes with signed URLs. This works fine.

this.xhr.send(this.data);

来自成功请求的响应标头(通过 Fiddler):

HTTP/1.1 200 OK
X-GUploader-UploadID: AEnB2UrZdsd-DAl0VdYOtKGVD_4AJLf6qeukybq0jBSv5HI5M4fRTqFVnoxko5LJBMttKYz8ExXG1c3BeASH4IuO8iKfCBb-iw
ETag: "87a742c72cc29950f03e5dd86dc95cf4"
x-goog-generation: 1552036072503518
x-goog-metageneration: 1
x-goog-hash: crc32c=u2rTqA==
x-goog-hash: md5=h6dCxyzCmVDwPl3Ybclc9A==
x-goog-stored-content-length: 239170
x-goog-stored-content-encoding: identity
Access-Control-Allow-Origin: https://www.example.com
Access-Control-Expose-Headers: *, Content-Length, Content-Type, Date, Server, Transfer-Encoding, X-GUploader-UploadID, X-Google-Trace
Vary: Origin
Content-Length: 0
Date: Fri, 08 Mar 2019 09:07:52 GMT
Server: UploadServer
Content-Type: text/html; charset=UTF-8
Alt-Svc: quic=":443"; ma=2592000; v="46,44,43,39"

来自失败请求的响应(通过 Fiddler):

HTTP/1.1 400 Bad Request
X-GUploader-UploadID: AEnB2UpjxOthcO6AZgBgw_P8Msw1zeZFkEqMhEWF5pV9jPORajlBnizndw48WSBtW_Ft9G7NOHu_HWxjgywpG7dqhZ0QUz8znA
Content-Type: application/xml; charset=UTF-8
Content-Length: 202
Date: Fri, 08 Mar 2019 09:01:39 GMT
Server: UploadServer
Alt-Svc: quic=":443"; ma=2592000; v="46,44,43,39"

<?xml version='1.0' encoding='UTF-8'?><Error><Code>ExpiredToken</Code><Message>The provided token has expired.</Message><Details>Request signature expired at: 2019-03-08T09:01:24+00:00</Details></Error>

存储桶上是否缺少我们的配置选项?有没有办法在失败的情况下忽略 CORS 以提取失败的状态代码?目前我们只收到 -1 没有帮助。

针对 Yasser Karout 的问题进行编辑:

浏览器,为了完成 XHR PUT 请求,首先进行预飞行 OPTIONS 调用:

OPTIONS https://storage.googleapis.com/example-com-media/uploads%2F20190404%2F5ca556b3d72f640001981487%2Fu1equspb.mp4_2c69f05f-0cb7-4c08-bd20-3858b06f6d51__000005?GoogleAccessId=example-com-media@stalwart-kite-714.iam.gserviceaccount.com&Expires=1554339568&Signature=IWjzT0D3Vxzw96JSTwqclhlJWZ%2B%2FBHYviL9SPnZCT3c5P2%2FSqJaq0Grxc%2BpDNLQ2DABH7LdnINR1ZJWF5TMsHoVyWwcwF5OnOqJiKUaGldKos0XFqwXMWo4c%2F7RN1fnKqBkfeSoQXccqwIxr19fh6NYojc09wDwAggcqmBYPmLv7g%2Bui%2FtkEyRTqs4%2Fw4Csl5kmXcOJliX9EWlOmsaJKlFXOmeQEM1IePtBBf4hjJJ%2FnKeRjfdjdmz1d%2BZ1F2LP6qGHCe5ay%2FSn7%2Fw23GfAaWZHFlcevLxgNuu0dpRW4yN6dTjckpgRonXYupGizMDzkQ7K6d1rKEl5bSpXBROMp7Q%3D%3D HTTP/1.1
Host: storage.googleapis.com
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: PUT
Origin: https://www.example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36
Access-Control-Request-Headers: content-type
Accept: */*
X-Client-Data: CJW2yQEIpLbJAQjEtskBCKmdygEIqKPKAQi8pMoBCLGnygEI4qjKAQjxqcoB
Referer: https://www.example.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,ja;q=0.8

对此的响应是200 OK,并且确实包含CORS标头:

HTTP/1.1 200 OK
X-GUploader-UploadID: AEnB2UqxbjqsngYYKdvLmrHj21htyUusQkR2W3tge38fMd30TehyRy7wDDmq6U9a7oYIL1OCGJP9hw3uXNVFH8_qbIR-Skhpag
Access-Control-Allow-Origin: https://www.example.com
Access-Control-Max-Age: 3600
Access-Control-Allow-Methods: PUT
Access-Control-Allow-Headers: content-type
Vary: Origin
Date: Thu, 04 Apr 2019 01:00:39 GMT
Expires: Thu, 04 Apr 2019 01:00:39 GMT
Cache-Control: private, max-age=0
Content-Length: 0
Server: UploadServer
Content-Type: text/html; charset=UTF-8
Alt-Svc: quic=":443"; ma=2592000; v="46,44,43,39"

因为这没问题,所以浏览器会发出PUT 请求:

PUT https://storage.googleapis.com/example-com-media/uploads%2F20190404%2F5ca556b3d72f640001981487%2Fu1equspb.mp4_2c69f05f-0cb7-4c08-bd20-3858b06f6d51__000005?GoogleAccessId=example-com-media@stalwart-kite-714.iam.gserviceaccount.com&Expires=1554339568&Signature=IWjzT0D3Vxzw96JSTwqclhlJWZ%2B%2FBHYviL9SPnZCT3c5P2%2FSqJaq0Grxc%2BpDNLQ2DABH7LdnINR1ZJWF5TMsHoVyWwcwF5OnOqJiKUaGldKos0XFqwXMWo4c%2F7RN1fnKqBkfeSoQXccqwIxr19fh6NYojc09wDwAggcqmBYPmLv7g%2Bui%2FtkEyRTqs4%2Fw4Csl5kmXcOJliX9EWlOmsaJKlFXOmeQEM1IePtBBf4hjJJ%2FnKeRjfdjdmz1d%2BZ1F2LP6qGHCe5ay%2FSn7%2Fw23GfAaWZHFlcevLxgNuu0dpRW4yN6dTjckpgRonXYupGizMDzkQ7K6d1rKEl5bSpXBROMp7Q%3D%3D HTTP/1.1
Host: storage.googleapis.com
Connection: keep-alive
Content-Length: 1332887
Pragma: no-cache
Cache-Control: no-cache
Origin: https://www.example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36
Content-Type: 
Accept: */*
X-Client-Data: CJW2yQEIpLbJAQjEtskBCKmdygEIqKPKAQi8pMoBCLGnygEI4qjKAQjxqcoB
Referer: https://www.example.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-GB,en;q=0.9,ja;q=0.8

在 Telerik 的 Fiddler 中查看 HTTP 请求,我可以看到以下响应:

HTTP/1.1 400 Bad Request
X-GUploader-UploadID: AEnB2UqdCe0t1tcfu_vgw7xirkbY6ACX_rZRac4UuufCU5vLufAsFQIQ06uNuE7zzCg7u8OXZN0aEu5ygD7TAJdqv4kVkBDf0w
Content-Type: application/xml; charset=UTF-8
Content-Length: 202
Date: Thu, 04 Apr 2019 01:00:39 GMT
Server: UploadServer
Alt-Svc: quic=":443"; ma=2592000; v="46,44,43,39"

<?xml version='1.0' encoding='UTF-8'?><Error><Code>ExpiredToken</Code><Message>The provided token has expired.</Message><Details>Request signature expired at: 2019-04-04T00:59:28+00:00</Details></Error>

所以要回答 Yasser 的问题:是的,返回了 400 状态代码,但是由于不存在 CORS 标头,因此浏览器永远不会向调用 Javascript 代码提供响应,因此无法知道请求的原因失败的。可以肯定地说,请求失败了。

【问题讨论】:

  • CORS 错误是否返回 400 错误? based on this doc,过期的会话 URI 将返回 400 Bad Request 状态码。
  • @Yasser 我已添加更新以回应您的问题。简而言之:飞行前 OPTIONS 请求确实包含 CORS 标头,但对 PUT 请求的实际 400 响应不包含,因此调用代码永远不会知道请求失败的原因,甚至看不到400 响应。
  • 首先,我可以知道为什么直接从客户端连接您的存储...将任务传递给后端,保持会话,那么它不会导致您遇到任何问题。
  • @Matrix 因为我们不想通过我们的 API 将千兆字节的视频数据路由到存储服务。客户端直接上传到存储桶更有意义。这种技术与 Amazon 的 S3 和 Azure 的 StorageAccounts 完美配合。目前,我们谈论的是每天大约 250 GB。

标签: javascript google-cloud-platform cors google-cloud-storage


【解决方案1】:

感谢您的澄清。在进一步研究之后,看起来这是过期签名 URL 的当前预期行为。标头“Access-Control-Allow-Origin”标头不存在导致错误。

There is an open Feature Request for this,它也与存储团队的内部功能请求相关联。我也会在内部提供这篇 Stack 帖子作为额外的用例。

【讨论】:

  • 当您的竞争对手(使用 Azure 的 StorageAccount 服务的微软和使用 AWS 的 S3 的亚马逊)已经正确处理此用例时,这似乎是预期的行为,这似乎很奇怪。幸运的是,您提供的链接确实为我指明了解决方法。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-05-12
  • 2017-12-18
  • 1970-01-01
  • 2015-10-12
  • 2015-11-28
  • 2016-09-13
相关资源
最近更新 更多