3

I'm trying to clear all the info my app is saving in the browser, whether it's in sessionStorage, localStorage or cookies.

I've added this small method to do so, and it get called in the ngOnInit of one of my components:

export class SomeComponent implements OnInit {

    constructor(private cookieService: CookieService) {}

    ngOnInit(): void {
        this.clearAppData();
    }

    private clearAppData(): void {
        sessionStorage.clear();
        localStorage.clear();
        this.cookieService.deleteAll();
}

sessionStorage and localStorage seems to be cleared, yet I can see that the cookies are not. I need to manually clear the cookies through the browser.

Moreover, sometimes I see that the cookie is saved under the root path, and sometimes I see it under the relative root path. I'm not sure what is the cause of this, and as sometimes it sends the wrong cookie, I would like to clear everything before getting a new one.

enter image description here

Any suggestions what am I doing wrong? Thanks!

MightGod
  • 436
  • 2
  • 8
  • 19

4 Answers4

4

I was also facing the same issue. if your cookie is customized which means secure, Strict, Path then you need to clear with specifications.

this._cookieService.delete("cookie name","/","domain name",true,"None");

I am sure this should work for you.

Ankit Gupta
  • 87
  • 7
  • Sorry for the late response, unfortunately I'm no longer developing with Angular, yet I'd give it a thumbs up as it seems to be the right way. – MightGod Apr 13 '22 at 08:11
1

I asume u using ngx-cookie-service?

Please check the execution order of your code and set the path to '/'

I've been fiddling around with it and it seems that setting a cookie with the same name will override the existing one. So you will not see your cookie being deleted if the order is incorrect.

I had no time to check the path-section you mentioned. I did not implement a router with paths to see if i could help you with that.

Setting a cookie with: Service.setcookie('name', 'value', int, '/'); Should work fine

And deleting it with: CookieService.deleteAll() Also works insite ngOnInit()

I'm pretty sure its the execution order and provide path as '/' .

That will do fine.

Sry for no nice code, im on a phone atm, will update later if still needed. I had to get away from my pc.

Jelly
  • 11
  • 3
1

In the development environment localhost; any client side app using UI frameworks will need to tweak the server session cookie code as below.

Note: On your backend server you need to turn the cookie setting for httpOnly to False as below code

cookie: {
       secure: false, //set this to true in production over https
       httpOnly: false, //set this to false in development to test delete 
       ....
       ....
}

Later, in your Angular service code for logout method use as below:

logout(){

this.cookieService.delete('<your-cookie-name>', '/', 'localhost', false, 'Lax');

}

See ngx-cookie-service documentation

For individual delete:

delete( name: string, path?: string, domain?: string, secure?: boolean, sameSite: 'Lax' | 'None' | 'Strict' = 'Lax'): void;

For Batch delete:

deleteAll( path?: string, domain?: string, secure?: boolean, sameSite: 'Lax' | 'None' | 'Strict' = 'Lax' ): void;

Important: On production both should be set as True | httpOnly & Secure | for a Cookie

Sunil Kumar
  • 1,718
  • 16
  • 33
0

You cannot delete an httpOnly cookie in the front-end as it is meant to be unavailable through JS, as said in this post

To delete httpOnly cookies, you must make an HTTP call to your backend and delete the cookie in your database. You can set the cookie with a new expiration date to make it expire from the client side.

Marine
  • 5
  • 2