难道真的https://www.googleapis.com/upload/drive/v2/fil

2019-06-26 11:23发布

更新:这是Google云端硬盘中的错误,CORS没有上传的URI启用。 @Nivco指着我周围的工作与谷歌的客户端库,使用iframe和代理(不CORS)。 我把(测试)工作代码在底部,有一个详细的解释和说明。 请参阅答案,下面的例子。

通过API插入文件到谷歌驱动器 ,并使用JavaScript谷歌驱动器的授权说,上传端点支持CORS,但我一直无法使用它们。 我可以得到授权,并插入一个空文件,使用文件:插入 ,但我不能上传内容到它-我得到一个405(不允许的方法)错误,当我使用https://www.googleapis.com/upload /驱动器/ V2 /文件 ,当我使用任何一种在插入文件堆栈溢出后例子中的两种技术。

有没有可能是CORS工作了v1和v2的为尚未启用?

编辑:顺便说一下,405错误是对Chrome是使OPTIONS请求。

编辑:这是从我的尝试之一的代码:

在我目前的代码,我想强调的是,我能够进行身份验证和列表文件。 我只是无法上传数据到一个文件中。

var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://www.googleapis.com/upload/drive/v2/files?uploadType=multipart');
xhr.setRequestHeader('Authorization', 'Bearer ' + params.access_token);
xhr.setRequestHeader("Content-Type",  'multipart/related; boundary="END_OF_PART"');
xhr.onreadystatechange = function(data) {
  if (xhr.readyState == DONE) {
    document.getElementById("files").innerHTML = "Uploaded file: " + xhr.responseText;
    };
  }
xhr.send([
  mimePart("END_OF_PART", "application/json", json),
  mimePart("END_OF_PART", "text/plain", "a\nb\n"),
  "\r\n--END_OF_PART--\r\n",
].join(''));
function mimePart(boundary, mimeType, content) {
  return [
    "\r\n--", boundary, "\r\n",
    "Content-Type: ", mimeType, "\r\n",
    "Content-Length: ", content.length, "\r\n",
    "\r\n",
    content,
  ].join('');
}

这里是要求:

Request URL:https://www.googleapis.com/upload/drive/v2/files?uploadType=multipart
Request Method:OPTIONS

这里是回应:

Status Code:405 Method Not Allowed
cache-control:no-cache, no-store, must-revalidate
content-length:0
content-type:text/html; charset=UTF-8
date:Mon, 23 Jul 2012 22:41:29 GMT
expires:Fri, 01 Jan 1990 00:00:00 GMT
pragma:no-cache
server:HTTP Upload Server Built on Jul 17 2012 16:15:04 (1342566904)
status:405 Method Not Allowed
version:HTTP/1.1

没有任何反应,因为Chrome浏览405错误对于OPTIONS请求。 没有发布,因为浏览器无法继续,因为它的OPTIONS请求有405失败了,所以它打印此错误在控制台:

XMLHttpRequest cannot load https://www.googleapis.com/upload/drive/v2/files?uploadType=multipart. Origin https://leisurestorage.appspot.com is not allowed by Access-Control-Allow-Origin.

Answer 1:

看来你是对的,上传API端点似乎不支持CORS请求,而其他终端做支持(对于没有彻底测试抱歉)。 这是一个错误,我们必须让我们的工程团队了解的问题。

在平均时间似乎唯一的解决方法是使用JavaScript客户端库,并采取在描述它会使用iframe代理的优势, 使用JavaScript谷歌驱动器的授权

谢谢你提出这个问题!



Answer 2:

CORS现已全面启用。 见https://github.com/googledrive/cors-upload-sample对于如何做到断点续传与香草JS的例子。



Answer 3:

这个答案(实际上这个问题本身)现在冗余给予了充分的支持CORS由史蒂夫Bazyl证实

工作代码,使用@ Nivco的帮助下,有详细的解释和说明:

下面是该技术的全面测试工作代码。 要使用此功能,你需要做两页。 第一页验证并启动第二页,这是您的实际应用。 为了能够访问谷歌的云端硬盘API上传文件,你需要注册一个应用程序,这是描述在这里 。

您的第一个页面将使用OAuth,这是在描述这个答案#1 。 它调用看起来像这样一个片段您的应用程序:

#access_token=ya29.AHES6ZSb4M4ju8U_X_zgFrz_MD2RsjrQu5V05HjsBtrCl0nh2SrnaA&token_type=Bearer&expires_in=3600

在JavaScript中,您可以访问片段用location.hash 。 保存值后,它的设置是一个好主意location.hash为空字符串向右走,所以它不会在浏览器的地址栏中显示出来。 您的应用需要在其CORS请求,并在代理(非CORS)请求上传API使用的的access_token值从片段。 下面是一个例子启动页,这实在是刚刚从OAuth的例子代码的版本:

<html>
  <body>
    <a href="javascript:poptastic('https://accounts.google.com/o/oauth2/auth?scope=https://www.googleapis.com/auth/drive https://www.googleapis.com/auth/drive.file&client_id=270759921607.apps.googleusercontent.com&redirect_uri=https://leisurestorage.appspot.com&response_type=token');">Authorize Leisure Storage</a><br>
    <script>
      function poptastic(url) {
        var newWindow = window.open(url, 'name', 'height=600,width=450');
        if (window.focus) {
          newWindow.focus();
        }
      }
    </script>
  </body>
</html>

下面是上传一个示例应用程序a\na\b\n到一个名为leisureUpload在你的Google云端硬盘,使用谷歌的客户端JavaScript库。 有没有必要使用任何的gapi.auth方法,因为它使用了原始gapi.client.request()与Authorization头直接在电话呼叫,就像它会使用XMLHttpRequest的CORS():

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Leisure</title>
    <script type="text/javascript">
    var hash = location.hash.substring(1).split('&');
    location.hash = '';
    var params = {};

    for (var i = 0; i < hash.length; i++) {
        var p = hash[i].split('=');

        params[p[0]] = p[1];
    }
    function gapiClientLoaded() {/* do nothing */}
    function uploadTestFile() {
        var json = JSON.stringify({
            mimeType: 'text/plain',
            title: 'leisureUpload',
        });
        var xhr = new XMLHttpRequest();

        gapi.client.request({
            'path': '/upload/drive/v1/files',
            'method': 'POST',
            'params': {'uploadType': 'multipart'},
            'headers': {
                'Content-Type': 'multipart/mixed; boundary="END_OF_PART"',
                'Authorization': 'Bearer ' + params.access_token,
            },
            'body': [
                mimePart("END_OF_PART", "application/json", json),
                mimePart("END_OF_PART", "text/plain", "a\nb\n"),
                "\r\n--END_OF_PART--\r\n",
            ].join('')
        }).execute(function(file) {
            document.getElementById("result").innerHTML = "Uploaded file: " + file;
        });
    }
    function mimePart(boundary, mimeType, content) {
        return [
            "\r\n--", boundary, "\r\n",
            "Content-Type: ", mimeType, "\r\n",
            "Content-Length: ", content.length, "\r\n",
            "\r\n",
            content,
        ].join('');
    }
    </script>
    <script src="https://apis.google.com/js/client.js?onload=gapiClientLoaded"></script>
  </head>
  <body>
    <h1>Welcome to Leisure!</h1>
    <button onclick="uploadTestFile()">Upload Test File</button><br>
    <pre id="result"></pre>
  </body>
</html>


文章来源: Does https://www.googleapis.com/upload/drive/v2/files really support CORS?