VueJS - Erase cookie set by the backend server via a logout component

Question

I have a VueJS UI that runs on the port 8080, whereas my Node server which handles the auth runs on 8082. After login our Auth server redirects back to the UI, and sets the required session cookie. I need to set this cookie to null in my frontend when I click the Logout button, before redirecting to the server Logout action which takes care of the backend details.

I am not able to access document.cookie, or delete the cookie using Vue.cookie. Both of these return the cookie value as null. How would I do it?

Have you tried https://stackoverflow.com/questions/10593013/delete-cookie-by-name#23995984 ? — Saddy, Apr 19 '20 at 16:55
Hey yes, this worked. Thanks, please add an answer so I can accept. — Rutwick Gangurde, Apr 19 '20 at 19:33

score 4 · Accepted Answer · answered Apr 19 '20 at 19:33

4

To properly delete a cookie, do the following:

function delete_cookie(name) {
  document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}

Source

answered Apr 19 '20 at 19:33

Saddy

1,515
1
9
20

1

Thanks. You can also add this - `Vue.cookie.set('session=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;');` also does the job, but you have to install the `vue-cookie` package. – Rutwick Gangurde Apr 19 '20 at 19:35
For Vue3 users install the **vue3-cookies** package. – ShadowGames Oct 18 '22 at 11:06

VueJS - Erase cookie set by the backend server via a logout component

1 Answers1