如何检查用户是否已登录或未登录“Google登录” (OAuth 2.0) [英] How to check if user is logged in or not with "Google Sign In" (OAuth 2.0)

查看:178
本文介绍了如何检查用户是否已登录或未登录“Google登录” (OAuth 2.0)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在按照此处和< here



我是使用带有Javascript的HTML。



需要解决的问题如下:初次登录后,如何在不同的页面上(例如登录页面或门户用户在登录后看到),请检查用户是否已登录?有没有我可以拨打的服务,用我的应用程序密钥或类似的东西来检查用户的登录状态?
我假设我必须在每个页面上包含google API。



登录页面代码:



<
$ b

 < head> 
....
< script src =https://apis.google.com/js/platform.jsasync defer>< / script>

< script>
函数onSignIn(googleUser)
{
var profile = googleUser.getBasicProfile();
console.log('ID:'+ profile.getId());
console.log('Name:'+ profile.getName());
console.log('Image URL:'+ profile.getImageUrl());
console.log('Email:'+ profile.getEmail());

alert(profile.getName());


函数注销()
{
alert('注销');
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut()。then(function(){
console.log('User signed out。');
});
}
...
< / head>

Code In Body(上面Google列出的第一行,第二行触发注销测试) p>

 < body> 
...
< div class =g-signin2data-onsuccess =onSignIn>< / div>
< div onmousedown =logout()>注销< / div>
...
< / body>

有什么方法可以将google API包含在另一页上,然后调用一些检查登录状态功能?或另一种方式来具体地告诉用户是否登录或退出? 在sessionStorage中,您可以随时在加载新页面时进行检查。我没有测试以下内容,但它应该可以工作(以相同的方式对WebAPI标记进行类似操作)。

 函数onSignIn(googleUser){var profile = googleUser.getBasicProfile(); console.log('ID:'+ profile.getId()); console.log('Name:'+ profile.getName()); console.log('Image URL:'+ profile.getImageUrl()); console.log('Email:'+ profile.getEmail()); var myUserEntity = {}; myUserEntity.Id = profile.getId(); myUserEntity.Name = profile.getName(); //将实体对象存储在sessionStorage中,可以从站点的所有页面访问它。 sessionStorage.setItem( myUserEntity,JSON.stringify(myUserEntity));警报(profile.getName()); } function checkIfLoggedIn(){if(sessionStorage.getItem('myUserEntity')== null){//重定向到登录页面,sessionStorage中没有用户实体window.location.href ='Login.html'; } else {//用户已经登录var userEntity = {}; userEntity = JSON.parse(sessionStorage.getItem('myUserEntity')); ... DoWhatever(); }} function logout(){//当用户注销时,不要忘记清除sessionStorage sessionStorage.clear();}  



当然,如果sessionStorage对象被篡改,您可以进行一些内部检查。这种方法应该适用于Chrome和Firefox等现代浏览器。


I am implementing Google log in for the first time as described here and here.

I am using HTML with Javascript.

The problem that needs solving is as follows: How can I, after the initial login, on a different page (say a landing page, or portal that the user sees after logging in), check if the user is logged in? Is there a service I can call to check the user's login in status with my app key or something similar? I assume I would have to include the google API on each page.

Login Page Code:

Script In Head (Code from Google's tutorial listed above):

<head>
....
<script src="https://apis.google.com/js/platform.js" async defer></script>

<script>
function onSignIn(googleUser) 
{
  var profile = googleUser.getBasicProfile();
  console.log('ID: ' + profile.getId()); 
  console.log('Name: ' + profile.getName());
  console.log('Image URL: ' + profile.getImageUrl());
  console.log('Email: ' + profile.getEmail());

  alert(profile.getName());   
}

function logout()
{
    alert('logging out');
    var auth2 = gapi.auth2.getAuthInstance();
        auth2.signOut().then(function () {
        console.log('User signed out.');
        });
}
...
</head> 

Code In Body (1st line from Google's tutorial listed above, 2nd line to trigger logout test)

<body>
...
<div class="g-signin2" data-onsuccess="onSignIn"></div>
<div onmousedown="logout()">Logout</div>
...
</body>

Is there some way I can include the google API on another page, and then call some check login status function? Or another way to concretely tell if the user is logged in or out?

解决方案

You can stringify a custom userEntity object and store it in sessionStorage where you can check it anytime you load a new page. I have not tested the following but it should work (doing something similar with WebAPI tokens in the same way)

function onSignIn(googleUser) 
{
  var profile = googleUser.getBasicProfile();
  console.log('ID: ' + profile.getId()); 
  console.log('Name: ' + profile.getName());
  console.log('Image URL: ' + profile.getImageUrl());
  console.log('Email: ' + profile.getEmail());
  
  var myUserEntity = {};
  myUserEntity.Id = profile.getId();
  myUserEntity.Name = profile.getName();
  
  //Store the entity object in sessionStorage where it will be accessible from all pages of your site.
  sessionStorage.setItem('myUserEntity',JSON.stringify(myUserEntity));

  alert(profile.getName());   
}

function checkIfLoggedIn()
{
  if(sessionStorage.getItem('myUserEntity') == null){
    //Redirect to login page, no user entity available in sessionStorage
    window.location.href='Login.html';
  } else {
    //User already logged in
    var userEntity = {};
    userEntity = JSON.parse(sessionStorage.getItem('myUserEntity'));
    ...
    DoWhatever();
  }
}

function logout()
{
  //Don't forget to clear sessionStorage when user logs out
  sessionStorage.clear();
}

Of course, you can have some internal checks if the sessionStorage object is tampered with. This approach should work with modern browsers like Chrome and Firefox.

这篇关于如何检查用户是否已登录或未登录“Google登录” (OAuth 2.0)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆