使用Google oAuth 2.0时刷新新用户登录页面

我试图制作一个网站使用Google Sign For Websites.主要是为了了解它是如何工作的。使用Google oAuth 2.0时刷新新用户登录页面

我已经按照该教程Google提供的步骤进行了操作。用户可以成功登录到我的网站，它可以将用户ID传递到后端，然后使用php脚本验证ID服务器端。

然后PHP会在网站上为用户创建一个会话。我无法弄清楚的是，当用户点击Google登录按钮并且登录成功时，我将如何刷新页面。刷新页面将允许主页重新加载新的php会话数据。

<div class="g-signin2 signin-button" data-onsuccess="onSignIn" data-theme="dark"></div> 

function onSignIn(googleUser){ 

     // The ID token you need to pass to your backend: 
     var id_token = googleUser.getAuthResponse().id_token; 

     var xhr = new XMLHttpRequest(); 
     xhr.open('POST', 'https://mywebsite.com/tokensignin.php'); 
     xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
     xhr.onload = function() { 
      console.log('Signed in as: ' + xhr.responseText); 
     }; 
     xhr.send('idtoken=' + id_token); 
     };

我使用简单location.reload()代码的onload =函数（）部的内侧试过。这会导致页面在每次加载时都会无限次地刷新，但是由于Google每次都验证用户是否通过此变量登录了该变量。

我试过looking through their reference使用GoogleAuth.isSignedIn.listen(listener)来监视任何更改，但它似乎并未完全满足我的要求，或者我没有正确使用它，因为我不完全知道监听器应该是什么。

另一种选择可能是使用它们的GoogleAuth.attachClickHandler(container, options, onsuccess, onfailure)函数，但我不完全确定如何正确配置选项字段/变量。

如果有人能提供一些关于这个世界如何工作的见解，我将不胜感激。

总结如果用户已经使用Google登录我的网站，我希望网页不做任何事情，如果他们点击登录按钮，登录成功后我想刷新他们所在的页面。

来源

2017-04-19 Jem

您可以使用回调函数向xhr添加一个侦听器。

xhr.addEventListener("load", loginComplete);

，然后创建一个函数：

function loginComplete(evt) { 
    console.log("Login Complete"); 
    window.location.reload(); 
}

编辑：

确定。由于听众不帮忙。您需要检查用户是否已经登录。为了保存这些信息，我能想到的一件事就是使用cookie。

因此，您可以存储您从Google收到的Auth令牌，并为其设置一个cookie并在每次进行POST之前检查。

这里是一个不错的js的cookie库：https://github.com/js-cookie/js-cookie

然后为onload您保存ID：

xhr.onload = function() { 
    Cookie.set('google_token', id_token); 
    window.location.reload(); 
};

而且onSignIn功能将是这样的：

function onSignIn(googleUser){ 
    var cookie = Cookie.get('google_token'); 
    if(cookie != undefined){ 
     //cookie is set 
     return; 
    } 
    ... 
    //rest of the function 
}

当然，你需要例如，检查存储在cookie中的令牌是否仍然有效，有些情况下可以刷新它，而不是让用户再次登录（oAut h API提供这样的东西）。

使一些安全措施，以确保令牌不被注入等。

来源

2017-04-21 12:14:56

这仍然不能解决问题，因为它仍然会创建无限循环的页面刷新。当按钮被点击并且登录完成时它将触发刷新。但是，一旦刷新完成页面加载，它就会再次发送请求。由于每次加载页面时，Google都会处理登录信息，以查看用户是否仍然登录到网站。如果他们登录到该站点，则登录成功完成。然后导致登录被再次“完成”。 – Jem

@New_Wav你可以检查我的编辑吗？ –

当我在第二天或第二天有空时，我会试试这个。我认为这可能会成为最可靠的方法。我在最后一天左右对API做了一些额外的尝试。有些功能会查找用户状态的变化，例如GoogleAuth.isSignedIn.listen，但这些功能会引起一些已经存在的问题。每次页面加载时都会检查状态更改的侦听，并再次创建无限循环刷新。检查新已登录vs的cookie，与会话配对以验证数据将成为一种简单而安全的方式来执行此操作 – Jem

为什么没有你的后端重定向（或发送信息，因此页面，以便它可以在成功重定向）？

需要重新加载登录屏幕？

你也可以看看听者的文档，它似乎可以解决你想要的。即。监听用户更改并触发功能或重定向。

https://developers.google.com/identity/sign-in/web/listeners

来源

2017-04-25 08:10:10 Ryan

我的做法是一样的你和我确实遇到了与不断清爽同样的问题。

我尝试了几个解决方案，最好的工作之一是如下：

使用GAPI2触发回调用户迹象onGoogleSignIn
后端通过会话检查ID令牌有效性，体征用户在我Web应用程序
如果成功的话，我注销用户使用GAPI2，防止无限的重装，因为onGoogleSignIn永远不再叫
然后我刷新页面，replac e为退出按钮的登录按钮，我的webapp

此解决方法当然是非常无用的，如果你想操作用户的谷歌帐户的一些数据，但我发现没有使用此功能。

将某人从他们的Google帐户中签名的代码。

function signOut() { 
    var auth2 = gapi.auth2.getAuthInstance(); 
    auth2.signOut().then(function() { 
     console.log('User signed out.'); 
    }); 
}

来源

2017-04-25 09:03:54 Somrlik

使用Google oAuth 2.0时刷新新用户登录页面

回答

相关问题