I'm having lot of troubles deleting a cookie using $cookies

On logout, my code does:

        var deferred = $q.defer()

        $http.post( REST.logout, {} )

            .finally( function() {
                // finally callback is triggered both on success and error,
                // since I don't really care if the server is dead or whatever

                console.log('out!')
                console.log( $cookies['persistent'] )

                delete $cookies['persistent']
                $cookies['persistent'] = undefined

                console.log( $cookies['persistent'] )

                deferred.resolve()
            })

        return deferred.promise

And the output is:

    out!
    "441b5deca5da04cad774a3844b6865dac8a98e91-oi=11"
    undefined 

However, the cookie don't bother itself to go away...

As stated in this SO question Can't delete cookie with AngularJS's $cookies, I've checked the domain, which in my case are the the same, since my web app runs from domokun.zodiac.lan and the cookie has domain of .zodiac.lan

I can add that it cannot be set again on the server side because I've cut off the munication between the client and the server, in order to test this out.

Any chance that you could see something I'm missing out would be wonderful!

tested against angular 1.2.[2-5]

I'm having lot of troubles deleting a cookie using $cookies

On logout, my code does:

        var deferred = $q.defer()

        $http.post( REST.logout, {} )

            .finally( function() {
                // finally callback is triggered both on success and error,
                // since I don't really care if the server is dead or whatever

                console.log('out!')
                console.log( $cookies['persistent'] )

                delete $cookies['persistent']
                $cookies['persistent'] = undefined

                console.log( $cookies['persistent'] )

                deferred.resolve()
            })

        return deferred.promise

And the output is:

    out!
    "441b5deca5da04cad774a3844b6865dac8a98e91-oi=11"
    undefined 

However, the cookie don't bother itself to go away...

As stated in this SO question Can't delete cookie with AngularJS's $cookies, I've checked the domain, which in my case are the the same, since my web app runs from domokun.zodiac.lan and the cookie has domain of .zodiac.lan

I can add that it cannot be set again on the server side because I've cut off the munication between the client and the server, in order to test this out.

Any chance that you could see something I'm missing out would be wonderful!

tested against angular 1.2.[2-5]

• javascript
• angularjs
• cookies

• did you include <script src="//cdn.jsdelivr/angularjs/1.0.2/angular-cookies.min.js"></script> in your page ? – Uncle Aaroh Commented Jan 3, 2014 at 16:53
• ofc Id did, otherwise console.log( $cookies['persistent'] ) will raise an exception (actually, injecting $cookies will). I used 1.2.[2-5] of that either. – domokun Commented Jan 3, 2014 at 17:23

4 Answers 4

One more possibility is you may be running into what I was running into. In my case I wanted to delete a cookie that had been created outside my app so it wasn't in the same domain. We intercept customers' logins through a mon portal to provide their username/password. This then creates an authentication cookie that can be later read by the app, and the request is then forwarded to the app.

Anyway, the problem was that you have to be specific in defining both the path and domain of the cookie to be removed. Angular was able to read this cookie without specifying a path or domain, I was able to read it with simply:

$cookies.get("MySSOCookie");

But to remove (which I did by just overwriting with undefined when I wanted the user to be re-directed back to the authentication landing screen, such as upon logout or timeout), I had to be precise:

$cookies.put('MySSOCookie', undefined, {domain: '.myCompanyName.', path: '/'});

Use native javascript , here some functions will help you:

//set cookies that you need
function setCookie(name, value, expires){
    document.cookie = name + "=" + escape(value) + "; ";

    if(expires){
        expires = setExpiration(expires);
        document.cookie += "expires=" + expires + "; ";

    }
}
//expiration of your cookie
function setExpiration(cookieLife){
    var today = new Date();
    var expr = new Date(today.getTime() + cookieLife * 24 * 60 * 60 * 1000);
    return  expr.toGMTString();
}

//get cookie with namecookie...
function getCookie(w){
   cName = "";
   pCOOKIES = new Array();
   pCOOKIES = document.cookie.split('; ');

       for(bb = 0; bb < pCOOKIES.length; bb++){
          NmeVal  = new Array();
          NmeVal  = pCOOKIES[bb].split('=');
          if(NmeVal[0] == w){
             cName = unescape(NmeVal[1]);
          }
       }
  return cName;
}

For your problem use:

  setCookie(nameyourcookie,'')

I have helped you...

Can you use:

$cookieStore.remove('persistent');

http://docs.angularjs/api/ngCookies/service/$cookieStore

A potential problem could be if your cookie is marked as httpOnly. HttpOnly cookies cant be read by any javascript. To see if you can read the cookie, try:

$ document.cookie

in your console. If it returns an empty string despite there being cookies present in the browser, then those cookies might be httpOnly. You could also look for the HTTP check mark in the Resources tab in chrome

To get rid of the httpOnly attribute you could see if the server framework has some option for that. In nodejs/express you can pass a flag like this:

app.use(express.cookieSession({cookie: { httpOnly: false }}));

However, I don't know if that's bad practice, seeing as it seems to be some sort of session cookie we are talking about and should be handled by the server.