使用javascript读取文件并将其发送到服务器

时间:2017-11-26 22:55:05

标签: javascript vue.js google-api google-drive-api

我正在使用google drive api,我正在尝试从url下载文件,将其设置为变量并将其发送到后端。请注意,我使用Google云端硬盘的javascript选择器。

旁注:首先,我尝试向后端发送id_tokenfileId并尝试访问该文件,但我无法通过javascript中的用户身份验证相关作用域的用户身份验证不是php。

所以我决定用axios获取文件并将其保存到变量发送文件发送到我的后端。

var downloadUrl = typeof file.exportLinks !== 'undefined' ? 
                file.exportLinks['application/pdf'] : file.webContentLink

axios.get(downloadUrl, {
          headers: {
              Authorization: 'bearer ' + gapi.client.getToken().access_token,
             'Access-Control-Allow-Origin': '*'
          }
 }).then(function (response) {
      console.log(response)
 }).catch(function (error) {
      console.log(error);
 });

我尝试过使用它,但这会抛出

  

无法加载https://drive.google.com/uc?id=aba123bab23r24-m9_Mp4aiDcnibNf&export=download:对预检请求的响应未通过访问控制检查:否' Access-Control-Allow-Origin'标头出现在请求的资源上。起源' http://deftfax.app'因此不允许访问。

使用axios,如何从url下载文件并将其设置为变量?

1 个答案:

答案 0 :(得分:1)

使用Drive API下载文件的支持操作已记录在Download Files

根据您要执行的下载类型 - 文件,Google文档或内容链接 - 您将使用以下网址之一:

  • 下载文件 - files.get with alt = media file resource
  • 下载并导出Google文档 - files.export
  • 将用户链接到文件 - 来自文件资源的webContentLink

我自己可以使用webcontentlink:

使用Picker API下载图像文件
function downloadImage(data) {
      if (data.action == google.picker.Action.PICKED) {

        var fileId = data.docs[0].id; 
        var webcontentlink = ' https://docs.google.com/uc?id='+fileId+'&export=download'

        window.open( webcontentlink,'image/png');
      }
}

希望您从实施开始。