0

I am currently working on a medium scale app and am a month into learning React. I got to the part where I need to authenticate users. I have written some code and It is working, but I don't know is it secure enough. When my users login, they are assigned with a JWT token like this:

await axios.post(APIbase + '/login', {
          username: username, password: password
       }).then(res=>{
           const token = res.data.token;
           localStorage.setItem('token', token);
       }).catch(err => {
           console.log(err);
        });

And then, when the user makes a request to a server it send the token by an auth header like this:

 const token = localStorage.getItem('token');
      const headers = { Authorization: `Bearer ${token}`};
      const detailResult= await axios.get(API.base + API.details, {
      headers:headers});

Is this safe enough? I heard that this is a not really a good practice, but I am not sure what exactly should I do.

NoDiggityNoDoubt
  • 1
  • See https://stackoverflow.com/questions/44133536/is-it-safe-to-store-a-jwt-in-localstorage-with-reactjs – Rodrigo Murillo Mar 21 '22 at 14:24
  • use cookies... they will automatically be sent with subsequent requests (so no JS needed to send them) and only to the domain that set them. You can set them as "same-site", "HttpOnly", etc... to make them more secure. See options here: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie Localstorage is more for simple non-secure info like gui settings/properties. – pcalkins Mar 21 '22 at 20:41

0 Answers0