使用带有进度监听器的XMLHttpRequest的GCS签名URL对象会导致浏览器发送选项而不是Post

Question

我使用带签名的多部分Post请求，使用XMLHttpRequest和angular $http从浏览器上传策略文档GCS POST ...etc，成功实现了对象的上传。

但是，当我在XMLHttpRequest上传时附加事件侦听器以向用户显示进度条时，浏览器发送的是Options方法而不是POST。storage.googleapis.com返回200，ok之后，我期望从浏览器发送一个带有文件的POST，但这并没有发生。没有上传侦听器，代码就可以完美地工作。我应该移动到PUT吗？任何解决方法

​

   factory.uploadFileToUrlXHR = function(file,obj){
         var deferred = $q.defer();
         var fd = new FormData();
         fd.append('key', obj.key);
         fd.append('Content-Type',obj.contenttype)
         fd.append('GoogleAccessId', obj.googleaccessId);
         fd.append('policy', obj.policy);
         fd.append('signature', obj.signature);
         fd.append('file', file);
         var XHR = new XMLHttpRequest();
         XHR.addEventListener('load', function(event) {
           //  alert('Yeah! Data sent and response loaded.');
             deferred.resolve(event);
         });

       XHR.upload.addEventListener("progress",function(evt){
              if (evt.lengthComputable) {
                 $log.info("add upload event-listener" + evt.loaded + "/" + evt.total);
               }
            }, false);

  // Define what happens in case of error
        XHR.addEventListener('error', function(event) {
          //alert('Oups! Something went wrong.');
          deferred.resolve(event);
         });

  // Set up our request
        XHR.open('POST', obj.uri);

  // Send our FormData object; HTTP headers are set automatically
        XHR.send(fd);
         return deferred.promise;
    }

​

Answer 1

我解决了这个问题，

在浏览器中使用POST将文件上传到Google Cloud存储时，将存储桶名称附加到URL。在下面的代码中，obj.uri应该是"https://storage.googleapis.com/bucketname

XHR.open('POST'，obj.uri)；并从密钥中删除存储桶名称。Key应包含对象名称。

fd.append('key'，obj.key)；

如果您不将存储桶名称作为POST URL的一部分，浏览器将向https://storage.googleapis.com/发送Options请求。GCS将无法找到正确的CORS配置。CORS配置映射到存储桶名称。

我已经应用了CORS配置示例。

[
    {
      "origin": ["http://localhost:8282"],
      "method": ["OPTIONS","PUT","POST","GET", "HEAD", "DELETE"],
      "responseHeader": ["Content-Type"],
      "maxAgeSeconds": 3600
    }
]