2013-01-09 56 views
11

我試圖使用Javascript訪問私人Google Spreadsheet。我已成功授權OAuth2.0,並可以查看我所有Google雲端硬盤文檔的列表。我似乎無法做的是進入一個特定的電子表格。代碼如下,在函數「retrieveAllFiles」中使用相關的電子表格代碼。很多這些都是從Google教程中挑選出來的。使用Javascript使用OAuth2.0的Google Spreadsheets API

var clientId = 'working'; 
var apiKey = 'working'; 
var scopes = 'https://www.googleapis.com/auth/drive.file https://www.googleapis.com/auth/drive https://spreadsheets.google.com/feeds'; 

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

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

function handleAuthResult(authResult) { 
    console.log('inside handleAuthResult function'); 
    var authButton = document.getElementById('authButton'); 
    authButton.style.display = 'none'; 
    if (authResult && !authResult.error) { 
     //Access token has been succesfully retrieved, requests can be sent to the API. 
     apiCalls(); 
    } else { 
     //No access token could be retrieved, show the button to start the authorization flow. 
     authButton.style.display = 'block'; 
     authButton.onclick = function() { 
      gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult); 
     }; 
    } 
} 

function apiCalls() { 
    console.log('inside apiCalls function'); 
    gapi.client.load('drive', 'v2', function() { 
     retrieveAllFiles(callback); 
    }); 
} 

function retrieveAllFiles(callback) { 
    $.get('http://spreadsheets.google.com/feeds/spreadsheets/private/full', function(data) { 
     console.log('get request processed'); 
     console.log(data); 
    }); 
    console.log('inside retrieveAllFiles function'); 
    var retrievePageOfFiles = function(request, result) { 
     request.execute(function(resp) { 
     result = result.concat(resp.items); 
     var nextPageToken = resp.nextPageToken; 
     if (nextPageToken) { 
      request = gapi.client.drive.files.list({ 
       'pageToken': nextPageToken 
      }); 
      retrievePageOfFiles(request, result); 
     } else { 
      callback(result); 
     } 
     }); 
    } 
    var initialRequest = gapi.client.drive.files.list(); 
    retrievePageOfFiles(initialRequest, []); 
} 

function callback(result) { 
    console.log('all should be loaded at this point'); 
    console.log(result); 
    $('#drive-list').append('<ul class="items"></ul>'); 
    $.map(result, function(v,i){ 
     $('.items').append('<li>' + v.title + ':' + v.id + '</li>'); 
    }); 
} 

所以要清楚,最終的結果是目前我所有的谷歌文檔驅動的列表,但沒有執行console.log「獲取的數據進行處理」。我在控制檯中沒有收到任何錯誤消息,所以我不知道發生了什麼。

謝謝。

+0

請問您能告訴我如何獲取SpreadSheets的clientID嗎?謝謝! – VladL

+0

轉到[Google的開發者控制檯](https://console.developers.google.com/project)。創建新項目或登錄到現有項目。在左側欄中,轉到「APIs&auth」下的標題爲'Credentials'的部分。它有一個名爲'ClientID'的部分,你應該能夠在那裏找到更多。 – Josh

回答

20

最終的解決方案從一堆不同的來源編譯,希望這將有助於某人。

var scopes = 'https://spreadsheets.google.com/feeds'; 
var clientId = 'working'; 
var apiKey = 'working'; 

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

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

function handleAuthResult(authResult) { 
    console.log('inside handleAuthResult function'); 
    console.log(gapi.auth.getToken()); 
    var authButton = document.getElementById('authButton'); 
    authButton.style.display = 'none'; 
    if (authResult && !authResult.error) { 
     //Access token has been successfully retrieved, requests can be sent to the API. 
     loadClient(); 
    } else { 
     //No access token could be retrieved, show the button to start the authorization flow. 
     authButton.style.display = 'block'; 
     authButton.onclick = function() { 
      gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult); 
     }; 
    } 
} 

function loadClient() { 
    console.log('inside loadClient function'); 
    var token = gapi.auth.getToken().access_token; 
    var urlLocation = ''; //Get this from the URL of your Spreadsheet in the normal interface for Google Drive. 

    //This gives a spitout of ALL spreadsheets that the user has access to. 
    var url = 'https://spreadsheets.google.com/feeds/spreadsheets/private/full?access_token=' + token; 

    //This gives a list of all worksheets inside the Spreadsheet, does not give actual data 
    var url = 'https://spreadsheets.google.com/feeds/worksheets/' + urlLocation + '/private/full?access_token=' + token; 

    //This gives the data in a list view - change the word list to cells to work from a cell view and see https://developers.google.com/google-apps/spreadsheets/#working_with_cell-based_feeds for details 
    var url = 'https://spreadsheets.google.com/feeds/list/' + urlLocation + '/od6/private/full?access_token=' + token; 

    console.log(url); 
    $.get(url, function(data) { 
     console.log(data); 
    }); 
} 
+0

當我第一次加入auth_token時,我開始再次收到「400錯誤請求」錯誤。事實證明,這是一個壞worksheetId。當我從電子表格的docs.google.com網址中輸入gid =的值時,它就起作用了。我沒有嘗試urlLocation的完整URL。 API文檔和大多數其他地方都聲稱使用文檔URL中的key =值。因此,如果是docs.google.com/spreadsheet/ccc?key=blahblah&gid=5,那麼urlLocation ='blahblah'和worksheetId = 5,如下所示:'https://spreadsheets.google.com/feeds/list/blahblah/ 5/private/full?access_token ='+ token – jla

+1

所以,我對這個例子有相當的瞭解,但是跨域安全限制阻止了我(即「No」Access-Control-Allow-Origin'頭部存在「等)你從哪裏運行這個腳本來讓JS訪問響應數據? –

相關問題