Read express session cookie from React js app

Question

I'm building a project with authentication. I'm using Node+React. I set an express session cookie on the back-end and I want a component in react to read that cookie to see if the user is authenticated or not. For some reason I can not access that cookie from the react(client-side)... Maybe someone could help out?

BACK:
app.use(session({
  name: process.env.SESS_NAME,
  resave: false,
  saveUninitialized: false,
  secret: process.env.SESS_SECRET,
  cookie: {
    maxAge: parseInt(process.env.SESS_LIFETIME),
    sameSite: true, //strict,
    secure: process.env.NODE_ENV === "production"
  }
}))

FRONT:
import Cookies from "js-cookie";
...
console.log("cookie", Cookies.get("sid"));

I have a cookie named "sid" in this case and I can see it in my console in the browser... but when I try to access it its undefiend

thanks!

no I use the server side as api for the client side... @Chev — rio
– rio, Commented Nov 15, 2019 at 14:43
is there a specific reason for trying to access it? you've set it as HTTPcookie so you won't be able to access it on the client. curl.haxx.se/rfc/cookie_spec.html — Rajat banerjee
– Rajat banerjee, Commented Nov 15, 2019 at 21:52

Samuel Goldenbaum · Accepted Answer · 2019-11-15 17:34:37Z

3

Your issue is that you have not set the httpOnly property on the cookie when configuring session. The default value is true which will prevent client browsers from reading the cookie.

Note be careful when setting this to true, as compliant clients will not allow client-side JavaScript to see the cookie in document.cookie.

app.use(session({
  name: process.env.SESS_NAME,
  resave: false,
  saveUninitialized: false,
  secret: process.env.SESS_SECRET,
  cookie: {
    maxAge: parseInt(process.env.SESS_LIFETIME),
    sameSite: false, // this may need to be false is you are accessing from another React app
    httpOnly: false, // this must be false if you want to access the cookie
    secure: process.env.NODE_ENV === "production"
  }
}))

See the cookie options in docs

answered Nov 15, 2019 at 17:34

Samuel Goldenbaum

19k20 gold badges74 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

rio Over a year ago

YES but I do want it to be httpOnly since I don't want attackers to have any access... but still I need that for my front-end to know when user is authenticated @Chev

Samuel Goldenbaum Over a year ago

OK, but your question and answer above explain why you cannot access the cookie. You may be confusing session state with authentication and the session cookie is not used to test for authentication. This would be best served using JWT tokens. There are numerous articles on authentication with JWT and recommend you look at the jsonwebtoken.

Samuel Goldenbaum Over a year ago

@hindi1991 please can you accept the answer covering why you could not read the cookie so other users can understand. Please create a new question if you having issues with the auth JWT design. Best, Chev

Collectives™ on Stack Overflow

Read express session cookie from React js app

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related