javascript – 在网页上显示来自Google云端硬盘的文档

是否可以在网页上显示我的驱动器中的文档？我希望用户能够直接从我的驱动器单击文档并下载它.我该怎么做呢？谢谢你的建议.

解决方法:

对于HTML / JavaScript解决方案,请查看以下链接：

https://developers.google.com/drive/quickstart-js
https://www.youtube.com/watch?v=09geUJg11iA
https://developers.google.com/drive/web/auth/web-client

这是使用JavaScript的最简单方法,大部分复杂性都在于
您的WebApp授权.下面的示例读取您指定的文件夹中的文件ID,名称和描述.
– 转到：https://cloud.google.com/console/project
   并创建一个新项目“xyz”
– 选择“API& auth”,禁用您不需要的,启用“Drive API”
– 选择“凭据”,
按“创建新客户端ID”按钮
      x Web应用程序
      授权Javascript起源：“https://googledrive.com/”
      授权重定向URI：“https://googledrive.com/oauth2callback”
    它会导致：
      客户ID：xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com
      电子邮件地址：xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx@developer.gserviceaccount.com
      客户机密：xxxxxxxxxxxxxxxxxxxx
      重定向URI：https://googledrive.com/oauth2callback
      Javascript起源：https://googledrive.com/
– 在下面的代码中,替换
    CLIENT_ID with xxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com
    FOLDER_ID与您在文件夹地址行中看到的ID,
    https://drive.google.com/?tab=mo&authuser=0#folders/xxxxxxxxxxxxxxxxxxx
– 运行它,授权

我不知道你是否读过JS,代码可以自下而上,我做的就是尽可能简单.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
  var FOLDER_ID = '.xxxxxxxxxxxxxxxxxx';    // the folder files reside in
  var CLIENT_ID = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com';
  var SCOPE =    //'https://www.googleapis.com/auth/drive'; 
  [
    'https://www.googleapis.com/auth/drive',
    'https://www.googleapis.com/auth/drive.file',     // for description, 
  ];

  function rsvpCB(resp) {
    var picAlbumLst = '<ul>\n';
    for (i=0; i<resp.items.length; i++) 
      picAlbumLst += (
      '  <li>'+resp.items[i].id+',&nbsp;'+resp.items[i].title+',&nbsp;'+resp.items[i].description+'</li>\n');
    picAlbumLst += "</ul>\n";
    $('#container').append(picAlbumLst);
  }
  function rqstCB() {   //test @ https://developers.google.com/drive/v2/reference/files/list
    var rv = gapi.client.drive.files.list({
      'q': '"'+FOLDER_ID+'" in parents and trashed = false',
      'fields' : 'items(id,title,description)'   //'items(id,title,description,indexableText)'   
    }).execute(rsvpCB);
  }
  // authorization server reply
  function onAuthResult(authResult) {
    var authButton = document.getElementById('authorizeButton');
    authButton.style.display = 'none';
    if (authResult && !authResult.error) {  // access token successfully retrieved
      gapi.client.load('drive', 'v2', rqstCB);   
    } else {  // no access token retrieved, force the authorization flow.
      authButton.style.display = 'block';
      authButton.onclick = function() {
        checkAuth(false);
      }
    }
  }
  // check if the current user has authorized the application.
  function checkAuth(bNow) {
    gapi.auth.authorize({'client_id':CLIENT_ID, 'scope':SCOPE, 'immediate':bNow}, onAuthResult);
  }
  // called when the client library is loaded, look below
  function onl oadCB() { 
    checkAuth(true); 
  }
</script>
<script src="https://apis.google.com/js/client.js?onload=onLoadCB"></script>
<body style="background-color: transparent;">
  <input type="button" id="authorizeButton" style="display: none" value="Authorize" />
  <div id="container">
  </div>
</body>

javascript – 在网页上显示来自Google云端硬盘的文档

相关文章