2012-08-11 6 views
7

로컬 HTML 파일 (자바 스크립트)에서 Google API (캘린더 v3)에 액세스 할 수 있습니까? IIS를 통해 파일을 제공하는 대신 내 브라우저에서 c : \ temp \ gsotto \ gsotto.htm을 열려고합니다. 나는 웹 서버를 통해로컬 HTML/자바 스크립트 (웹 서버 없음)

http://localhost/ 

에서 내 파일을 제공하는 경우

그것은 작동합니다. 구글 API를 콘솔에서 은 내가 가진 "웹 애플리케이션의 클라이언트 ID"가 있습니다에 따라 (참조 자와)

Redirect URIs: http://localhost 
JavaScript origins:  http://localhost 

및 브라우저 응용 프로그램에 대한 "간단한 API 액세스"키

Firebug shows me this when accessing through http://localhost/gsotto/gsotto.htm 
GET http://localhost/gsotto/gsotto.htm 
GET https://apis.google.com/js/client.js?onload=handleClientLoad 
GET https://apis.google.com/_/apps-static/_/js/gapi/client....cb=gapi.loaded_0 
GET https://ssl.gstatic.com/accounts/o/...-postmessagerelay.js 
GET https://accounts.google.com/o/oauth2/auth?client_id=.....&authuser=0 
GET https://ssl.gstatic.com/accounts/o/....-postmessage.js 

and this when access through c:\... 
GET https://apis.google.com/js/client.js?onload=handleClientLoad 
GET https://apis.google.com/_/apps-static/_/js/gapi/client.....cb=gapi.loaded_0 
GET https://ssl.gstatic.com/accounts/o/.....-postmessagerelay.js 
and nothing more.... 

do i need to use other settings in the google api console for this to work? 


<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset='utf-8' /> 
    </head> 
    <body> 
    <!--Add a button for the user to click to initiate auth sequence --> 
    <button id="authorize-button" style="visibility: hidden">Authorize</button> 
    <script type="text/javascript"> 
     // google calendar id 
     var calId = "...."; 

     var clientId = "..."; // oAuth2 webapp 
     var apiKey = "....";// Key for browser apps (with referers) 

     // google authentication scopes 
     var scopes = 'https://www.googleapis.com/auth/calendar'; 
       //https://www.googleapis.com/auth/calendar.readonly 

     // Use a button to handle authentication the first time. 
     function handleClientLoad() { 
      console.log('handleClientLoad'); 
     gapi.client.setApiKey(apiKey); 
     window.setTimeout(checkAuth,1); 
     } 

     function checkAuth() { 
      console.log('checkAuth'); 
      try { 

     gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult); 
      } 
      catch(e) 
      { 
       console.log('e'); 
       console.log(e); 
      } 
     } 


     function handleAuthResult(authResult) { 

      console.log('handleAuthResult'); 
     var authorizeButton = document.getElementById('authorize-button'); 
     if (authResult && !authResult.error) { 
      console.log('result ok'); 
      authorizeButton.style.visibility = 'hidden'; 
      makeApiCall(); 
     } else { 
      console.log('authresult null or error'); 
      console.log(authResult); 
      authorizeButton.style.visibility = ''; 
      authorizeButton.onclick = handleAuthClick; 
     } 
     } 

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

function makeApiCall() { 
     console.log('makeApiCall'); 
    gapi.client.load('calendar', 'v3', function() { 
    var request = gapi.client.calendar.events.list({ 
     'calendarId': calId 
    }); 

    request.execute(function(resp) { 
     console.log('result:'); 
     console.log(resp); 

     for (var i = 0; i < resp.items.length; i++) { 
     var li = document.createElement('li'); 
     li.appendChild(document.createTextNode(resp.items[i].summary)); 
     document.getElementById('events').appendChild(li); 
     } 
    }); 
    }); 
} 
    </script> 
    <script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script> 
    <div id="content"> 
    <ul id="events"></ul> 
    </div> 
    </body> 
</html> 
+0

* "가능합니까?"* 묻기 전에 시도 했습니까? – Joseph

+0

가능합니다. 스크립트를 IE –

+0

에서 실행하도록 허용해야 할 수도 있습니다. 시도했지만 결과가 없습니다. 소스 및 방화 광 NET 로그 결과를 포함하도록 질문을 편집했습니다. – sotto

답변

5

당신의 브라우저를 사용하면 교차 사이트 (또는 교차 프로토콜) 이유로 file:// 프로토콜을 실행할 때 AJAX를 사용할 수 없음을 알게 될 것입니다. 작동하는 GET은 XHR/AJAX가 아니라 <script> 태그이므로 대부분의 최신 브라우저에서는 대답이 아니오입니다. discussion here을 참조하십시오. --allow-file-access-from-files--disable-web-security (link)으로 Chrome을 실행하면 제대로 작동 할 수 있습니다.