CODEWITHSUNDEEP
node.jsreactjscookiesreduxjs-cookie
mohamed nageh
mohamed nageh

Reputation: 733

i want to get my jwt value from cookies in browser

i have now stored my jwt in cookies when user sign in or sign up but the data don't stay so i made a function to handle this but i need the value of the token to make it work

this is the function that i need token value for 

const setAuthToken = (token) => {
  if (token) {
    axios.defaults.headers.common['x-auth-token'] = token;
  } else {
    delete axios.defaults.headers.common['x-auth-token'];
  }
};

and this is my action that i use in react to send the token value to this function i tried to use js-cookies for that but it give me undefined

import Cookies from 'js-cookie';
//load user
export const loadUser = () => async (dispatch) => {
  const token = Cookies.get('access_token');
  console.log(token);
  // if (cookie.access_token) {
  //   setAuthToken(cookie.access_token);
  // }

  try {
    const res = await axios.get('/user/me');
    dispatch({
      type: USER_LOADED,
      payload: res.data,
    });
  } catch (err) {
    dispatch({
      type: AUTH_ERROR,
    });
  }
};

and this is my recieved cookie in browser enter image description here

Upvotes: 4

Views: 25819

Answers (2)

mohamed nageh
mohamed nageh

Reputation: 733

 res.cookie('x-auth-token',token,{
      maxAge: 3600,
      httpOnly: true,
      secure:true
    })

Upvotes: 0

Sebastian B.
Sebastian B.

Reputation: 2201

If you take a close look at your screenshot, you can see that the cookie is sent by the server as HttpOnly. This is a security measure, and therefore the cookie isn't accessible to any JavaScript code by design.

See https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies#Restrict_access_to_cookies

If you are in control of the server, you could change it accordingly, if not you will have to make a deal :-)

Upvotes: 5

Related Questions