Google使用Javascript API登录而不触发弹出窗口

Google使用Javascript API登录而不触发弹出窗口,javascript,jquery,google-api,google-plus,google-oauth,Javascript,Jquery,Google Api,Google Plus,Google Oauth,我使用以下代码让用户能够通过Javascript API使用他们的Google帐户登录 HTML Javascript function gPOnLoad(){ // G+ api loaded document.getElementById('gp_login').style.display = 'block'; } function googleAuth() { gapi.auth.signIn({ callback: gPSignInCallb

我使用以下代码让用户能够通过Javascript API使用他们的Google帐户登录

HTML

Javascript

function gPOnLoad(){
     // G+ api loaded
     document.getElementById('gp_login').style.display = 'block';
}
function googleAuth() {
    gapi.auth.signIn({
        callback: gPSignInCallback,
        clientid: googleKey,
        cookiepolicy: "single_host_origin",
        requestvisibleactions: "http://schema.org/AddAction",
        scope: "https://www.googleapis.com/auth/plus.login email"
    })
}

function gPSignInCallback(e) {
    if (e["status"]["signed_in"]) {
        gapi.client.load("plus", "v1", function() {
            if (e["access_token"]) {
                getProfile()
            } else if (e["error"]) {
                console.log("There was an error: " + e["error"])
            }
        })
    } else {
        console.log("Sign-in state: " + e["error"])
    }
}

function getProfile() {
    var e = gapi.client.plus.people.get({
        userId: "me"
    });
    e.execute(function(e) {
        if (e.error) {
            console.log(e.message);
            return
        } else if (e.id) {
            // save profile data
        }
    })
}(function() {
    var e = document.createElement("script");
    e.type = "text/javascript";
    e.async = true;
    e.src = "https://apis.google.com/js/client:platform.js?onload=gPOnLoad";
    var t = document.getElementsByTagName("script")[0];
    t.parentNode.insertBefore(e, t)
})()
此代码运行良好。
我想使用上面的代码(使用Javascript)从用户的Google帐户登录,而不触发弹出窗口。例如,用户单击登录链接,在同一窗口/选项卡中请求应用程序权限,用户授予权限,用户重定向回Google登录链接所在的页面,保存配置文件数据,用户登录。

Google API不提供此类功能。你应该坚持使用gapi.auth.sign。我只知道一种方法可以让它工作,但它非常粗糙。

gapi.auth.sign打开身份验证窗口。 在app1中保存身份验证窗口url。 不要调用gapi.auth.sign,而是将用户重定向到该url

要将成功的身份验证重定向回您的网站,请在url2中添加/修改redirect_url参数。请记住,重定向uri必须在开发人员控制台中注册

例如: &重定向\u uri=

通过这种方式,谷歌将用户重定向回您的网站。访问令牌是通过GET参数提供的

1如果google更改其API,这可能会中断(因为此方法绕过JS API,并假设url中的所有参数都将永远受支持)

2Redirect_url在中介绍。我认为这个参数在其他任何情况下都不会起作用


我强烈建议不要使用这个想法(因为它绕过了JSAPI,使用了未记录的功能)。坚持使用gapi.auth.sign.

如果要重定向到其他页面,可以使用ux\u mode参数(选项为“重定向”或“弹出”),并设置重定向uri

还需要在您的google项目页面上授权OAuth客户端的URL

  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;
    });
  }

感谢您的回答注:Zendesk似乎做了与此完全相同的事情,支持或不支持。(而且,我很高兴他们这样做了,因为它消除了可能出现的帐户混乱。)希望Google API能很快使用此功能升级。弹出窗口的ux_模式没有显示弹出窗口。您能告诉我原因吗?@SachinHR弹出窗口也可能意味着一个新选项卡,或者它已被浏览器阻止。默认行为是打开一个弹出窗口,如果我问了这个问题,那么我会接受你的回答作为最佳答案!:)这应该是公认的答案!这里有一个指向谷歌文档的链接,该文档解释了可用的参数,这对于inapp WebView来说是一种合适的方式。当popup试图关闭自身并将回调返回到原始窗口时,带有popup的google登录API与webview存在问题。