为什么向Google Storage发送的此Preflight PUT请求返回403？

Question

我正在尝试建立一个直接上传到Google存储空间而不是让内容通过我们的服务器的用户上传系统。为此，我们让前端首先与服务器联系以获取签名的URL，然后在收到该URL后发送文件。一切似乎都在起作用。取回网址后，前端会将PUT请求发送到Google Storage。

由于CORS，初始选项有效负载被发送并获得200响应。但是，以下（示例）上传的内容为403，并显示以下消息，我对此感到困惑：

  

在以下位置访问XMLHttpRequest   'https://storage.googleapis.com/spaceofmotion/2019-06-23/finish-getup-agile.mp4?Expires=1561322797&GoogleAccessId=admin-275%40spaceofmotion.iam.gserviceaccount.com&Signature=BikemcQ%252BNe6L8mqLeSplKSz9L6baZhf9Mntc%252BR%2FQVGtAiY0XTlGTSb9wSaVuDd9zfoW%252BdrN4Za8O%252BTvbSm4cx%2FrH4Ub%2FFa2BnqNB74HlpNoFSLjXRe1bqatjCThsWTuR%252B5ADHHfQeen5eGyPPHFwNar5fSgCbd6Cf3kwIkvPSRgltHUymGtlDLHwhguopi83%2FY7t8jKocEc%252ByEx1eSW6PPlPY3qvDINbaV5NZ2aZ45LZiI7c5yckmoNCvy2kcz2qUvS1bPA%2FUJCD25mda%2FTW1DFGp3T5RWncUVHsxMTt4CzZp7%252BUJNnZ44U1pKd1dU7FGl3t%2FucExuMzGN%2F%2FM4NwMw%253D%253D'   来自来源“ http://localhost:3000”的信息已被CORS政策阻止：   请求中没有'Access-Control-Allow-Origin'标头   资源。

存储桶的配置如下：

[
{"maxAgeSeconds": 30, "method": ["GET", "PUT"], "origin": ["https://www.spaceofmotion.com"], "responseHeader": ["\*"]},
{"maxAgeSeconds": 30, "method": ["GET", "PUT"], "origin": ["http://localhost:3000"], "responseHeader": ["\*"]}
]

这是[pre-]请求的初始选项：

这是第二个请求：

此设置有什么问题？

Answer 1

尝试咨询并验证docs官方中用于排除CORS问题的要点。

从屏幕快照中可以看到您的第一个请求的状态为200，因此该请求没有问题，您实际上可以验证故障排除文档的所有内容，但是对于第二个请求，缺少故障排除文档第4点提到的CORS实施所需的标头（缺少“ Access-Control-Request-Headers”，“ Access-Control-Request-Method”标头）

Answer 2

我正在使用nodejs和"@google-cloud/storage": "^3.0.2"

我尝试了一下，但是不知道为什么。就我而言，只需将客户端库的version（默认值）从v2更改为v4。

   const getSignedUrlResponse: GetSignedUrlResponse = await file.getSignedUrl({
        action: 'write',
        expires: Date.now() + 60 * 1000,
        version: 'v4' // v2 -> v4
   });

然后，403 cors错误消失了。以下是有关nodejs客户端库的文档：https://googleapis.dev/nodejs/storage/3.0.2/File.html#getSignedUrl

这里是version的描述：

  

要使用的签名版本，即“ v2”或“ v4”。默认为“ v2”。

客户端PUT请求成功：

演示网址：https://github.com/mrdulin/nodejs-gcp/tree/master/src/cloud-storage/signed-url-fullstack