How to save Token to Local Storage?

Question

I'm working on a login system for an app in school. I can register a user that gets saved to my azure documentDB. I can then, sort of log in with the user. But it (the Token) never gets saved so that I can access the token...

The script for the log in looks like this:

      var signin = function() {

            var tokenUrl = "http://localhost:15746/Token";
            var loginData = $("#userSignup").serialize();
            loginData = loginData + "&grant_type=password";
            $.post(tokenUrl, loginData).then(navigateToEvent);
                                                      
            return false;
        }

        $("#signup").click(signin);

How could I store the Token? In Local Storage? How?

Answer 1

To save a string in Local Storage you use

window.localStorage.setItem(key, value);

You can get the value later with:

window.localStorage.getItem(key);

Answer 2

Dont save a Token in the Local Storage. Its not a good Style because you open up to attackers. I found this link on my search: https://medium.com/@benjamin.botto/secure-access-token-storage-with-single-page-applications-part-1-9536b0021321.

This is a part from whats inside the page:

“It’s recommended not to store any sensitive information in local storage.” -OWASP Cheat Sheet

“Don’t store tokens in local storage.” -Auth0: Where to Store Tokens

“You are safe from CSRF, but you have opened yourself up to a much greater attack vector… XSS.” Okta: JWTs Suck

“Don’t store [JWTs] in local storage (or session storage).” LogRocket: JWT Authentication Best Practices

“It is best to avoid letting the JavaScript code ever see the access token.” OAuth 2.0 for Browser-Based Apps: Best Current Practice