javascript - Google ドライブ API JavaScript

Question

Google ドライブを使用してファイルを一覧表示しようとしています。

https://stackoverflow.com/a/11280257の回答を使用すると、理由を発見できないという問題が見つかりました。

var clientId = '*********.apps.googleusercontent.com';
var apiKey = '##########';
var scopes = 'https://www.googleapis.com/auth/drive';


function handleClientLoad() {
    gapi.client.setApiKey(apiKey);
    window.setTimeout(checkAuth,1);
}

function checkAuth() {
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true},handleAuthResult);
}

function handleAuthResult(authResult) {
    var authorizeButton = document.getElementById('authorize-button');

    if (authResult && !authResult.error) {
        authorizeButton.style.visibility = 'hidden';
        makeApiCall();
    }  
    else {
        authorizeButton.style.visibility = '';
        authorizeButton.onclick = handleAuthClick;
    }
}

function handleAuthClick(event) {
    gapi.auth.authorize({client_id: clientId, scope: [scopes], immediate: false}, handleAuthResult);
    return false;
}

function makeApiCall() {  
    gapi.client.load('drive', 'v2', makeRequest);   
}

function makeRequest()
{
    var request = gapi.client.drive.files.list({'maxResults': 5 });

    request.execute(function(resp) {          
        for (i=0; i<resp.items.length; i++) {
            var titulo = resp.items[i].title;
            var fechaUpd = resp.items[i].modifiedDate;
            var userUpd = resp.items[i].lastModifyingUserName;
            var userEmbed = resp.items[i].embedLink;
            var userAltLink = resp.items[i].alternateLink;

            var fileInfo = document.createElement('li');
            fileInfo.appendChild(document.createTextNode('TITLE: ' + titulo + ' - LAST MODIF: ' + fechaUpd + ' - BY: ' + userUpd ));                
            document.getElementById('content').appendChild(fileInfo);
        }
    });    
}

このエラーがあります：

Uncaught TypeError: Cannot read property 'files' of undefined 

ラインで

var request = gapi.client.drive.files.list({'maxResults': 5 });

Answer 1

使用する

var request = gapi.client.request({
        'path': '/drive/v2/files',
        'method': 'GET',
        'params': {'maxResults': '1'}
        });

それ以外の

var request = gapi.client.drive.files.list({'maxResults': 5 });

問題を解決しました！

Answer 2

コードは正常に見え、gapi.client.load が完了するまで正しく待機しています。ドライブの JS ファイルの読み込みエラーか、その他の問題 (JS ファイルがキャッシュされていない可能性があります)。完全な例については、http: //jsfiddle.net/Rbg44/4/ をご覧ください。

HTML:

<button id="authorize-button">Authorize</button>
<div id="content">Files:</div>

JS:

var CLIENT_ID = '...';
var API_KEY = '...';
var SCOPES = '...';

function handleClientLoad() {
    gapi.client.setApiKey(API_KEY);
    window.setTimeout(checkAuth,1);
}

function checkAuth() {
    var options = {
        client_id: CLIENT_ID,
        scope: SCOPES,
        immediate: true
    };
    gapi.auth.authorize(options, handleAuthResult);
}

function handleAuthResult(authResult) {
    var authorizeButton = document.getElementById('authorize-button');

    if (authResult && !authResult.error) {
        authorizeButton.style.visibility = 'hidden';
        makeApiCall();
    } else {
        authorizeButton.style.visibility = '';
        authorizeButton.onclick = handleAuthClick;
    }
}

function handleAuthClick(event) {
    var options = {
        client_id: CLIENT_ID,
        scope: SCOPES,
        immediate: false
    };
    gapi.auth.authorize(options, handleAuthResult);
    return false;
}

function makeApiCall() {  
    gapi.client.load('drive', 'v2', makeRequest);   
}

function makeRequest() {
    var request = gapi.client.drive.files.list({'maxResults': 5 });
    request.execute(function(resp) {          
        for (i=0; i<resp.items.length; i++) {
            var titulo = resp.items[i].title;
            var fechaUpd = resp.items[i].modifiedDate;
            var userUpd = resp.items[i].lastModifyingUserName;
            var userEmbed = resp.items[i].embedLink;
            var userAltLink = resp.items[i].alternateLink;

            var fileInfo = document.createElement('li');
            fileInfo.appendChild(document.createTextNode('TITLE: ' + titulo + 
                ' - LAST MODIF: ' + fechaUpd + ' - BY: ' + userUpd ));                
            document.getElementById('content').appendChild(fileInfo);
        }
    });    
}

$(document).ready(function() {
  $('#authorize-button').on('click', handleAuthClick);
  $.getScript('//apis.google.com/js/api.js', function() {
    gapi.load('auth:client', handleClientLoad);
  });
});

gapi.client.load() を呼び出したときに行われたリクエストに何らかの問題があるかどうか、ブラウザの開発ツールで確認できますか?

Answer 3

これを書く必要があります：

gapi.client.load('drive', 'v2', null);