skip to Main Content

I use express app as backend.

I set cors middleware:

  app.use(cors({
    credentials: true,
    origin: 'http://localhost:3000' //client host
  }));

Here are cookie options I set:

    res.cookie(this.refreshCookieName, refreshToken, {
      httpOnly: false,
      path: `/api`,
      sameSite: 'lax',
      maxAge: accessCookieMaxAge,
      secure: false
    });

On frontend app I make requests via axios. And, yes, I set withCredentials for instance config:

export const apiInstance = axios.create({
  withCredentials: true,
  baseURL: 'http://localhost:5000/api/' //backend host
});

I use chrome web browser on ubuntu os.

On "Network" tab of DevTools when I click on request and open "Cookies" tab of request I can see cookies there #screenshot1.

#screenshot1

But cookies are not visible in "Cookies" section on "Application" tab of DevTools #screenshot2. Which is frustrating, because I would like to have ability to remove cookies.

#screenshot2

Is it possible to make them visible on "Application" tab? If yes, how?

By the way cookies were visible when I tried to use firefox.

2

Answers


  1. Chosen as BEST ANSWER

    Not sure why chrome DevTools doesn't show cookies with path property value that is not included in current browser url. Maybe the purpose of such chrome behavior was to let developers see which cookies will be sent and receieved exactly on current browser url. I don't know... But when I changed cookies from path='/api' (I don't have page with url /api on my frontend app) to path='/' on backend, chrome began to show cookies in "Application" tab of DevTools.


  2. Chrome just updated to a new version and now you can’t see some cookies, I recommend you to install cookie manager or some extension like that.
    That was what I did.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search