Geek Answers Handbook

How to check if a user is logged in or not using Google Login (OAuth 2.0)

This is my first time introducing Google Magazine as described here and here .

I am using HTML with Javascript.

The problem that needs to be solved is the following: how can I, after the first login to another page (for example, the landing page or portal that the user sees after logging in), check whether the user is logged in? Is there a service that I can call to check the user’s status entry with my application key or something similar? I assume that I will have to include the Google APIs on every page.

Login page code:

Script In the chapter (Code from the Google manual 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 the Google tutorial above, second line to run the exit test)

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

Is there a way to enable the Google API on another page and then call the login check function? Or another way to specifically indicate whether the user is registered or not?

+6
source share
1 answer

You can create a userEntity user object and save it in sessionStorage, where you can check it when loading a new page. I have not tested the following, but it should work (similarly do the same with WebAPI tokens)

 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 modified. This approach should work with modern browsers such as Chrome and Firefox.

+3
source

More articles:


All Articles