OAuth 2.0을 통한 Google 인증 방법

큰 수정을 위해 죄송합니다. 나는 내 질문을 올바르게 말하지 않기 때문에 다시 시작하고있다.OAuth 2.0을 통한 Google 인증 방법

HTML5에 클라이언트 측 앱을 작성하려고합니다. 웹 사이트에서 호스팅되는 것을 원하지 않습니다. 나는 이것이 가능하다는 것을 확신하지 못한다. 나는이 유형의 응용 프로그램에 대해 상당히 새로운 지식을 가지고있다.

어쨌든 OAuth와 같은 인증이 필요한 Google 서비스에 액세스하고 싶습니다. OAuth2는 자바 스크립트이기 때문에 필요한 것입니다.

팝업 (이 부분이 있음)에서 Google 인증을 열고 사용자가 액세스하도록 허용 한 다음 Google 서비스를 쿼리 할 수있는 애플리케이션으로 다시 전달합니다. 문제는 1. 둘 다 response_type=code을 사용할 때마다 사용자에게 앱에 토큰을 복사/붙여 넣으라고 요청하지만 response_type=token을 사용하면 웹 서버에서 호스팅되지 않기 때문에 올바른 URL로 리디렉션해야합니다. 없음입니다.

그래서 어떻게 OAuth를 사용하고 사용자가 원활하게 액세스하도록 허용 할 수 있습니까?

출처

2011-10-30 esac

확인이 답변 http://stackoverflow.com/a/38094113/1153703 –

당신은 인증이 완료된 후 리디렉션 구글에 정의 된 일부 리디렉션 URL이 있어야합니다

편집 코멘트 후, 여기를 수행하는 Google OAuth2 page에서 추출한 코드입니다. 모든 웹 사이트에서 페이지를 호스팅 할 수 없다면 로컬 호스트에서 페이지를 호스팅 할 수 있습니다.

팝업에서 기본 상위 창으로 액세스 토큰을 가져 오는 것과 관련하여 상위 창에서 팝업의 문서 위치를 계속 확인하는 타이머를 설정할 수 있습니다. 문서 위치가 리디렉션 URL과 일치하면 URL 자체에 포함될 액세스 토큰을 구문 분석 할 수 있습니다.

나는 정확히 같은 (로컬 호스트를 사용) 문제가 어제에 튜토리얼을 작성하고 여기에 링크입니다 : http://www.gethugames.in/2012/04/authentication-and-authorization-for-google-apis-in-javascript-popup-window-tutorial.html

당신이 그것을 유용 바랍니다.

출처

2012-04-25 06:23:34 saiy2k

나는 당신의 튜토리얼을 읽고, 당신이 제안하는 방식으로 토큰을 얻을 수 있는지 궁금하네요 일단 토큰이 부모 창에 저장되면 API 호출을하기 위해 PHP를 사용하십시오. 내가이 방법으로 원할 이유는 google-api-php-client 라이브러리를 사용하고 있기 때문입니다. 감사합니다 – IberoMedia

나는 google-api-php 라이브러리에 권한을 부여하고 액세스 토큰을 얻는 기능이 있다는 것을 알고 있습니다. 왜 당신은 그들을 사용하지? http://code.google.com/p/google-api-php-client/wiki/OAuth2 – saiy2k

일련의 양식 또는 프로세스를 구현하려고하기 때문에. 액세스 토큰 또는 새로 고침 토큰을 사용할 수없는 경우 사용자는 캘린더 및 스프레드 시트, 프로세스의 모든 단계에서의 b/c 또는 양식 제출 (멀티 파트 양식 프로세스) 후에 시간 경과 기록을 승인해야합니다 캘린더 및 스프레드 시트에 데이터를 구성 할 수 있습니다. PHP 라이브러리를 사용할 때의 문제점은 동일한 페이지에 열리 며 첫 번째 시작 프로세스 양식에서 POST를 반환 할 방법이 없다는 것입니다. – IberoMedia

잠재적 인 click jacking을 피하기 위해 Google 인증을 사용하면 전체 페이지 로그인으로 이동해야합니다. 네가 그걸 통제 할 수 있다고 생각하지 않아.

<body> 
    <a href="javascript:poptastic('https://accounts.google.com/o/oauth2/auth?scope=https://www.google.com/m8/feeds&client_id=21302922996.apps.googleusercontent.com&redirect_uri=https://www.example.com/back&response_type=token');">Try 
    out that example URL now</a> 
<script> 
    function poptastic(url) { 
     var newWindow = window.open(url, 'name', 'height=600,width=450'); 
     if (window.focus) { 
     newWindow.focus(); 
     } 
    } 

</script> 
</body>

출처

2011-10-30 19:26:35 Mic

나는 이것이 사실 잘 모르겠어요. 자신의 예제 웹 페이지 (http://code.google.com/intl/ko/apis/accounts/docs/OAuth2.html#ClientLibraries)에 '지금 예제 URL 사용해보기'라는 링크가 있습니다. 클릭하면 새 URL로 열립니다. 팝업창. – esac

답변을 업데이트했습니다. 페이지를 리디렉션하는 이유가 될 수있는 iframe에 삽입하려고했습니다. 정보 주셔서 감사합니다. – Mic

죄송합니다. 이미 그 부분을 얻을 수있었습니다. 창이 열리지 만, 원하지 않는 클라이언트 응용 프로그램에 일부 인증 토큰을 복사/붙여 넣기를 원합니다. 사용자가 '허용'을 클릭 한 다음 계속 진행하기를 원합니다. 이것은 내가 알 수없는 부분입니다. – esac

저는 작업을위한 미니 JS 라이브러리를 작성했습니다.이 라이브러리를 가져와 작동하는지 확인하십시오. (있을 경우) 진행은 다음과 확인 ...

https://github.com/timdream/wordcloud/blob/master/go2.js

나는 최근에 동일한 스크립트에 의존하는 다른 프로젝트를 개발하고, 그래서 an independent library project에이 일을 분리하고있다.

출처

2012-10-11 06:17:58 timdream

그런데 http://timc.idv.tw/wordcloud/ *는 정확히 원하는 방식으로 Google을 인증하는 클라이언트 측 웹 앱입니다. – timdream

나는 자바 스크립트에서 Oauth를 위해 google api (gapi)를 사용할 수 있다고 생각합니다. 여기 는 문서입니다 : 당신은 복사/어떤 코드를 붙여 사용자를 필요로하지 않습니다 Authentication using the Google APIs Client Library for JavaScript

당신은 리디렉션 URI를 제공하기 위해 필요로하지 않습니다

당신이하기 만하면됩니다 : Google Developers Console에서 프로젝트로 이동 다음을 생성하십시오. 1. 새 클라이언트 ID를 생성하고 '설치된 응용 프로그램'및 '기타'옵션을 선택하십시오. 2.위의 문서에서 키

샘플 코드 공개 API를 생성 :

// Set the required information 
var clientId = 'YOUR CLIENT ID'; 
var apiKey = 'YOUR API KEY'; 
var scopes = 'https://www.googleapis.com/auth/plus.me'; 

// call the checkAuth method to begin authorization 
function handleClientLoad() { 
    gapi.client.setApiKey(apiKey); // api key goes here 
    window.setTimeout(checkAuth,1); 
} 

// checkAuth calls the gapi authorize method with required parameters 
function checkAuth() { 
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult); // scope and client id go here 
} 

// check that there is no error and makeApi call 
function handleAuthResult(authResult) { 
    var authorizeButton = document.getElementById('authorize-button'); 
    if (authResult && !authResult.error) { 
    makeApiCall(); 
    } 
} 

// API call can be made like this: 
function makeApiCall() { 
    gapi.client.load('plus', 'v1', function() { 
    var request = gapi.client.plus.people.get({ 
     'userId': 'me' 
    }); 
    request.execute(function(resp) { 
     var heading = document.createElement('h4'); 
     var image = document.createElement('img'); 
     image.src = resp.image.url; 
     heading.appendChild(image); 
     heading.appendChild(document.createTextNode(resp.displayName)); 

     document.getElementById('content').appendChild(heading); 
    }); 
    }); 
}

출처

2014-08-09 11:59:49 mlfan

OAuth 2.0을 통한 Google 인증 방법

답변

관련 문제