jQuery detecting cookies enabled

Question

I have a jQuery-based web app. My requirement is fairly simple: I want to use jQuery to find out if the user has enabled or disabled cookies in their web browser. I'm aware that there's a plugin available which can be used to create/retrieve/delete/update a cookie. But, is there a way jQuery can detect the user agent's settings?

score 41 · Answer 1 · answered Nov 13 '11 at 15:40

41

You don't need jQuery for that, you can use vanilla Javascript:

function are_cookies_enabled()
{
    var cookieEnabled = (navigator.cookieEnabled) ? true : false;

    if (typeof navigator.cookieEnabled == "undefined" && !cookieEnabled)
    { 
        document.cookie="testcookie";
        cookieEnabled = (document.cookie.indexOf("testcookie") != -1) ? true : false;
    }
    return (cookieEnabled);
}

http://sveinbjorn.org/cookiecheck

answered Nov 13 '11 at 15:40

Sarfraz

377,238
77
533
578

17

Easier than 6 lines of JS? – Scott Nov 13 '11 at 19:26
18

2 lines of code bests 6 lines. jQuery resolves cross-browser incompatibilities, and is extensively tested by many developers. http://stackoverflow.com/a/2031653/59087 – Dave Jarvis Sep 25 '12 at 18:19
4

@Scottie, it's not so much the # of lines, but the cross-browser compatibility that you get which means you don't have to spend more time testing this solution on different browsers. – johntrepreneur Jun 04 '13 at 23:48
6

@johntrepreneur: you mean you don't have to test jQuery solutions across multiple browsers? Huh, apparently I've been doing it wrong all this time. Sure, you could use jQuery for this (though Dave Jarvis' assertion that it's "2 lines" should actually be "2 lines plus a 95 line jQuery plugin"), but adding a jQuery plugin just to test if cookies are enabled or not is something I'd smack one of my team members with a copy of Javascript: The Good Parts for doing. – Scott Jun 05 '13 at 08:55

score 7 · Answer 2 · answered Aug 07 '13 at 21:20

7

Internet Explorer (version 10, at least) always returns true for navigator.cookieEnabled. Here's a method to work around this:

function areCookiesEnabled() {
    var cookieEnabled = navigator.cookieEnabled;

    // When cookieEnabled flag is present and false then cookies are disabled.
    if (cookieEnabled === false) {
        return false;
    }

    // try to set a test cookie if we can't see any cookies and we're using 
    // either a browser that doesn't support navigator.cookieEnabled
    // or IE (which always returns true for navigator.cookieEnabled)
    if (!document.cookie && (cookieEnabled === null || /*@cc_on!@*/false))
    {
        document.cookie = "testcookie=1";

        if (!document.cookie) {
            return false;
        } else {
            document.cookie = "testcookie=; expires=" + new Date(0).toUTCString();
        }
    }

    return true;
}

answered Aug 07 '13 at 21:20

Josh Schultz

8,000
9
32
39

3

Please tell me, why we need to write like `(cookieEnabled === null || /*@cc_on!@*/false)` "|| false" – Naga Harish M Aug 12 '13 at 06:52
@Naga he is relying on conditional compilation "feature detection" (ie only) to enable (adding the '!') access to the second block of testing for a cookie by writing/reading to document.cookie . This is not really future proof as it is making the assumption that all browsers which return true to cookieEnabled will have conditional compilation. – felickz Mar 03 '14 at 13:56
@josh this fails in IE11 as it always returns true AND CC appears to be disabled in IE11 [See Demo here](http://www.browserstack.com/screenshots/0dd0e22178d9f3979e976c68381e3b310394e2c6). See Mike's answer [here](http://stackoverflow.com/questions/6125330/javascript-navigator-cookieenabled-browser-compatibility), seems best to just never rely on navigator.cookieEnabled – felickz Mar 03 '14 at 17:18
i say we all just use [modernizr](https://github.com/Modernizr/Modernizr/blob/33f00fbbeb12e92bf24711ea386e722cce6f60cc/feature-detects/cookies.js) – felickz Mar 03 '14 at 18:18

score 5 · Answer 3 · answered Nov 13 '11 at 16:26

5

The simplest way is to check the navigator's property which contains the browser's information. Reference

You could use navigator.cookieEnabled === true to detect the browser's support for cookie.

answered Nov 13 '11 at 16:26

steveyang

9,178
8
54
80

score 1 · Answer 4 · answered Jul 29 '14 at 20:01

1

I like this 1 liner function:

function cookiesEnabled() {
    return $.cookie('check', 'valid', { expires: 1 }) && $.cookie('check') == 'valid';
}

answered Jul 29 '14 at 20:01

wayofthefuture

8,339
7
36
53

score 0 · Answer 5 · edited Jul 03 '17 at 21:01

Why are you testing with the property cookieEnabled? just try to create a cookie and check if it's done. And in case cookies work, delete the test created cookie.

 function are_cookies_enabled()
    {
            document.cookie="testcookie=valid";
            cookieEnabled = (document.cookie.indexOf("testcookie") != -1) ? true : false;

            if(cookieEnabled){
               document.cookie = "testcookie=; expires=Thu, 01 Jan 1970 00:00:00 UTC;"; 
            }

            return cookieEnabled;
    }

Ritchie · Answer 6 · 2015-10-19T08:57:19.733

-2

You can simply set a test_cookie when loading your page. then delete if it is set, else alert('please enable cookies...');

    <script>
  jQuery(document).ready(function()
  {
    var TEST_COOKIE = 'test_cookie';
    jQuery.cookie( TEST_COOKIE, true );
    if ( jQuery.cookie ( TEST_COOKIE ) )
    {
      jQuery.cookie( TEST_COOKIE, null );  // delete the cookie
      alert( 'Good news, cookies are enabled.' );
    }
    else
    {
      alert( 'Cookies not enabled. Please enable and try again.' );
    }
  }
</script>

edited Oct 19 '15 at 08:57

answered Jan 31 '14 at 08:14

Ritchie

408
3
11

The code above is what i meant. I still do not get why my answer was voted -1. – Ritchie Oct 19 '15 at 09:01

jQuery detecting cookies enabled

6 Answers6

Linked