Google sign-in using Javascript API without triggering popup
Such functionality is not provided through Google API. You should stick with gapi.auth.signIn. I know just one way to make it work, but it's very hacky.
gapi.auth.signIn opens authentication window. Save authentication window url in your app1. Instead of calling gapi.auth.signIn, redirect user to that url.
To redirect successful authentication back to your website, add/modify redirect_url param in the url2. Keep in mind that redirect_uri must be registered in developers console.
Example: https://accounts.google.com/o/oauth2/auth?client_id=1234567890.apps.googleusercontent.com&scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fplus.login&immediate=false&response_type=token&redirect_uri=http://example.com
This way google will redirect user back to your website. access_token is provided through GET params.
1If google changes their API this may break (since this method bypasses JS API and assumes that all those params in the url will be supported for ever).
2Redirect_url is introduced in offline access flow documentation. I don't think this param was intended to work in any other cases.
I strongly advise not to use this idea (since it bypasses JS API and uses undocumented functionality). Stick with gapi.auth.signIn.
You can the use ux_mode parameter (options are 'redirect' or 'popup') and set a redirect_uri if you want to redirect to a different page.
It's also necessary to authorize the URL for the OAuth client on your google project page.
function initClient() {
gapi.client.init({
apiKey: API_KEY,
clientId: CLIENT_ID,
discoveryDocs: DISCOVERY_DOCS,
scope: SCOPES,
ux_mode: 'redirect',
//redirect_uri: custom url to redirect'
}).then(function () {
// Listen for sign-in state changes.
gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);
// Handle the initial sign-in state.
updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
authorizeButton.onclick = handleAuthClick;
signoutButton.onclick = handleSignoutClick;
});
}