Firstly, thanks alot with the vue-cookies!! Its great and is really helpful. On the other hand, I am new to cookies and might not have the best understanding on how to go about this problem so I had to post it here.
To give a background, I am using vue-cookies npm to store JWT tokens to see whether the user is authenticated on reloading a page.
I will take you step by step to help you best understand the problem I am facing:
When the user logs in for the first time, I use window.$cookies.set('user_token', resp.data.token, INFINITY) and resp.data.token is the JWT token I receive after making an axios call to the backend. The image below shows that there is one cookie set named user_token.
Note: The user is directed to http://localhost:3000/
I reload the page and it still successfully logs the user in and shows the results shown in the image above.
Now then I go to another route http://localhost:3000/user/1 which is a reusable route meaning that only the id changes while I call /user/:id to change the route. The pic below shows that it successfully lets the user access the page as the cookie set in the window is still active and matches the one in the backend
Now this is where my problem starts where when I reload this route http://localhost:3000/user/1 my cookie in the window changes and there are multiple cookies under the same name and this logs the user out. The pic below shows the difference in the cookie JWT values and there are multiple cookies under the same name.
Note: I only set cookie when the user logs in and not during reload because the cookie is already set.
So I have no idea how the new cookie is being set with a different JWT token of its own. Would it be a bug?
Firstly, thanks alot with the vue-cookies!! Its great and is really helpful. On the other hand, I am new to cookies and might not have the best understanding on how to go about this problem so I had to post it here.
To give a background, I am using vue-cookies npm to store JWT tokens to see whether the user is authenticated on reloading a page.
I will take you step by step to help you best understand the problem I am facing:
window.$cookies.set('user_token', resp.data.token, INFINITY)
andresp.data.token
is the JWT token I receive after making an axios call to the backend. The image below shows that there is one cookie set nameduser_token
. Note: The user is directed tohttp://localhost:3000/
I reload the page and it still successfully logs the user in and shows the results shown in the image above.
Now then I go to another route
http://localhost:3000/user/1
which is a reusable route meaning that only the id changes while I call/user/:id
to change the route. The pic below shows that it successfully lets the user access the page as the cookie set in the window is still active and matches the one in the backendhttp://localhost:3000/user/1
my cookie in the window changes and there are multiple cookies under the same name and this logs the user out. The pic below shows the difference in the cookie JWT values and there are multiple cookies under the same name.Note: I only set cookie when the user logs in and not during reload because the cookie is already set. So I have no idea how the new cookie is being set with a different JWT token of its own. Would it be a bug?