检查用户是否登录

Question

hey There I completely new to this kind of work! Actually I want to check if user is successfully logged in!

suppose that i have a menu item:

  <li><a href="#" title="Know about Java" onclick="CheckSignIn()">Java</a></li>

when user clicks on it:

function CheckSignIn() {
    //here i want to check login

    if (!login) {
        alert('please login');
    } else {
        window.open('new page url here');
    }
}

I know how can i do it with php ie

<?php
session_start();

if (isset($_SESSION['loggedin']) && $_SESSION['loggedin'] == true) {
    echo (welcome user);//sort of                           
} else {
    echo "please login!";           
}
?>

In simple I want to check if user logs in using javascript and i know i cant use php inside java script can somebody help me please! Its not an assignment but i am learning it to my own

Answer 1

You cannot check session variable using JavaScript since a session variable is stored on server. To do this you'll have to call your server side code asynchronously using js. jQuery ajax can help you make the async call.

Answer 2

Very similar to access-php-variable-in-javascript

Even $_SESSION is a PHP variable so I am sure you should be able to get it in javascript variable.

Answer 3

One way is to send a xhr to the server which returns true or false if a user is signed in (aka a session value is set eventually making a database call), parse the response and return true or false.

Another way is to send an encrypted token (jwt is what I use currently) upon login that is stored in the browser's sessionStorage

So either you have everything on the server side or you have the clientside UI which makes requests to the server side api.

Both have advantages and disadvantages.

If you have a client side UI that makes requests to an api, like in your example I suggest you send a JWT upon login, store it in the browser's sessionStorage. Now you'd like to check on the client side if a user is logged in for display purposes. So check if a token in the sessionStorage exists, that means a user is logged in. Now when making a request to the server you send that token in a header field. The server checks the token for validity and if valid performs the operation. If not status 403.

This has downsides, the user needs to log in for every browser window it opens. Storing it in localStorage adds new security considerations, which are out of scope of the question (CSP, X-Frame-Options, and so on). JWT by default uses RSA and SHA256 (RS256).

The flow is:

1. User fills out login form and hits submit
2. Server receives the login information and if valid sends a token
3. If reponse status != 403|401 store the token in sessionStorage
4. When making a request to a protected resource the client sends the token in a header field.
5. Server checks token for validity
6. If valid send protected resource (or content that was requested)
7. Client renders received content