I am trying to access some google APIs from my javascript client using Oauth2. I've succeeded in getting the user to authenticate requests, but there's some unexpected behaviour when running the code below that'd I'd like to understand. When I click the 'authorize' button the first time, the result is:
'[ { "error": { "code": 401, "message": "Login Required", "data": [ { "domain": "global", "reason": "required", "message": "Login Required", "locationType": "header", "location": "Authorization" } ] }, "id": "gapiRpc" } ] '
on the second click the result is
[ { "id": "gapiRpc", "result": { "id": "1115793426680xxxx", "email": "[email protected]", "verified_email": true } } ]
here is the code for the page I am testing
<div id='sign in'>
<button onclick="init();">Authorize</button>
</div>
<p id="output">hello</p>
<script type="text/javascript">
function init() {
document.getElementById('output').innerHTML='loading oauth2 api'
gapi.client.load('oauth2', 'v2', auth);
}
function auth() {
var config = {
client_id: '2264xxxxx-odt0g7jn8vspa3ot9ogjxxxxxxxxx.apps.googleusercontent.com',
scope: 'https://www.googleapis.com/auth/userinfo.email',
immediate:true
};
document.getElementById('output').innerHTML='authorizing'
gapi.auth.authorize(config, authed());
}
function authed() {
document.getElementById('output').innerHTML='authorized'
var request = gapi.client.oauth2.userinfo.get().execute(
function(resp, raw) {
document.getElementById('output').innerHTML=raw
}
);
}
</script>
<script src="https://apis.google.com/js/client.js"></script>
<!--<script src="https://apis.google.com/js/client.js?onload=init"></script>-->
Could you please explain why I would get a 'login required' on the first execution of the code and a successful authentication on the second execution?
