2012-11-18 3 views
5

원산지 불일치 : http://googleappsdeveloper.blogspot.com/2011/12/using-new-js-library-to-unlock-power-of.htmlGoogle 캘린더 API 자바 스크립트 오류 : 내가 여기 간단한 자바 스크립트 코드에서 일하고 있어요

그것은 기본적으로 구글 캘린더에 인증을 획득하고 그 안에 포함 된 이벤트의 목록을 검색합니다. 웹 응용 프로그램을 등록하고 클라이언트 ID와 API 키를 받았습니다.

"오류 : 원본이 맞지 않습니다.", localhost를 사용하여 로컬로 javascript를 실행하고 있으며 localhost에 대한 Google 응용 프로그램 등록에서 내 홈페이지를 설정했습니다.

어떤 도움이라도 대단히 감사하겠습니다.

코드 :

<html> 
    <body> 
    <div id='content'> 
     <h1>Events</h1> 
     <ul id='events'></ul> 
    </div> 
    <a href='#' id='authorize-button' onclick='handleAuthClick();'>Login</a> 

    <script> 
    var clientId = '506979856128.apps.googleusercontent.com'; 
var apiKey = 'AIzaSyAGbQAZQU0YNL8hK5EU69exIg7_sOg3JoA'; 
var scopes = 'https://www.googleapis.com/auth/calendar'; 

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

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

function handleAuthResult(authResult) { 
    var authorizeButton = document.getElementById('authorize-button'); 
    if (authResult) { 
    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('calendar', 'v3', function() { 
    var request = gapi.client.calendar.events.list({ 
     'calendarId': 'primary' 
    }); 

    request.execute(function(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> 
</body> 
</html> 

답변

2

내가 검색 같은 오류 원산지 불일치 말은 오늘의 비트를 가지고 난 이유를 얻었다.

구글 API 광고 액세스를 만드는 동안

, 우리는 리디렉션 URI를 공인 공인 리디렉션 URI를를 지정해야합니다.

이제 공인 리디렉션 URI를에 지정된 이외의 URI에서 로그인을 호출하는 경우

error:Unknown Origin is thrown 참고 : 나는 당신이 로컬에서 자바 스크립트를 실행하는 로컬 호스트를 사용하는 것을 보았다. 이것은 인증 된 리디렉션 URI에 localhost URI를 추가하지 않았 음을 의미합니다.

하지만 시간 낭비하지 마세요. 인증 된 리디렉션 URI는 로컬 호스트 URI를 허용하지 않습니다. 이는 Chrome의 원본 정책 때문입니다. 그리고 Chrome을 disable-web-security 플래그로 실행하면 로컬에서 작동합니다 너무.

+0

소리가 합리적이지만 ... '''cd "/ Applications/Google 크롬 Canary.app/Contents/MacOS/"'''->'''./Google \ Chrome \ Canary --disable- 웹 보안''''''추적/BPT 트랩 : 5''' -'''Chrome이 예기치 않게 종료되었습니다 .'' –

+0

Firefox에서 실행 ... 제대로 작동합니다. –

+0

@CraigMorgan : chrome 확장 FF에서 ?? –

1

원산지 불일치의 문제는 Google 개발자 콘솔클라이언트 ID를 만들 때 리디렉션 URI를자바 스크립트 기원에 대한 치료를 취함으로써 해결 될 수있다. /

자바 스크립트 기원

는해야 하지 끝.

:-> 올바른 형식은 http://example.com입니다.

관련 문제