Grow your CSS skills. Land your dream job.

Pure JS Help with Cookie Tool

  • # May 1, 2012 at 5:49 am

    Hi all,

    I’m building a super straight forward EU Cookie Tool so that customers/random people can copy paste the code into their webpages/sites.

    The caveat is that everything needs to be pure JS and inline, rather than in the head section etc, just to make it super easy to use for regular people.

    It’s pretty much there but now I need it to create a cookie to remember that they chose to accept the Cookies and hide itself if they reload the page or come back later.

    Any ideas?

    JS Fiddle here;

    http://jsfiddle.net/andyunleashed/xq6XX/

    # May 1, 2012 at 7:10 am

    You can find tons of developers who have written several different variants of how to set, get and delete cookies over the years.

    https://gist.github.com/gists/search?utf8=%E2%9C%93&q=javascript+cookies&page=1

    # May 1, 2012 at 7:46 am

    I’m not sure that those help, I had a read through but think the solution isn’t in them.

    Many of them require the JQuery library, which isn’t a viable solution.

    Ultimately I need to create a cookie on clicking the button and not before and I’m not sure how to go about this with purejs.

    # May 1, 2012 at 7:55 am

    Have you thought about using localStorage with cookies as a fallback?

    Actually, why isn’t using jQuery a viable solution? Using it on your site to make it easier for you to code has nothing to do with the code you are providing. If you’ll consider it, here is a nice clean solution that does use local storage with a cookie fallback.

    # May 1, 2012 at 8:56 am

    I don’t understand where you got the idea that they require jQuery as that is JavaScript anyway so all the gists will work regardless of whether you use jQuery or not, here is a random gist which works fine.

    https://gist.github.com/949141

    # May 1, 2012 at 3:12 pm

    Add
    document.cookie =
    ‘stupid-eu-law=accept-cookies; expires=Mon, 31 Dec 2525 23:59:59 UTC; path=/’;

    into the onclick property of the button, eg:

    onclick=”setVisibility(‘cookies-notify’, ‘none’);document.cookie =
    ‘stupid-eu-law=accept-cookies; expires=Mon, 31 Dec 2525 23:59:59 UTC; path=/’;”

    it will set the following cookie:
    Name: stupid-eu-law
    Content: accept-cookies
    Domain: fiddle.jshell.net
    Path: /
    Send for: Any kind of connection
    Accessible to script: Yes
    Created: Tuesday, 1 May 2012 20:09:15
    Expires: Monday, 31 December 2525 23:59:59

    the Created date will change, but the rest is fixed

    See http://jsfiddle.net/xq6XX/9/

    if you want some useful js cookie functions check out http://jsfiddle.net/chrisjg/bbVuq/1/

    I have used these for a long time, in many places. They are pretty standard ways of writing, reading and deleting cookies in js. Hope you find them useful, and/or learn from them.

    Chris.

    # May 1, 2012 at 5:10 pm

    Thanks Chris, and Legend & Mottie.

    @mottie I’ll have a play!
    @legend thanks for the Git links but I’m needing some direction really.

    @Chrisjg I’ve just tried using the fiddle but it’s not remembering to hide the div when revisiting the test page so not sure how I can insert that into the cookie?

    # May 1, 2012 at 7:22 pm

    @andy_unleash

    I only set the cookie, I did not add the code for checking it -

    http://jsfiddle.net/chrisjg/bbVuq/3/

    shows how to write, delete and check for cookie.

    http://jsfiddle.net/chrisjg/xq6XX/15/

    is your original, with the added functionality to test if the cookie is present or not (and lets you delete it)

    For EU compliance you would need to list each cookie by name and originator and state what the cookie is used for. This can be done in your privacy or cookie policy, but you must link to that information from the accept cookies box.

    The accept button must be shown before any cookies are set on the site, so every cookie that is being written via your site must have some code around it to only write it if the ‘accept-cookies’ cookie is set.

    You must also have a simple and obvious way for people to change their mind and stop accepting cookies.

    http://kissjoomla.stempsite.co.uk/ is a potential solution I am working on for the Joomla CMS – still needs a little work for full compliance though.

    Because of the complexities of the law there are no quick and easy solutions, other than don’t write cookies, or use any other code on your site that sets cookies.

    It is a nice idea to have a ‘drop-in’ solution for this, but I think you would needs to put loads of caveats with your solution – and tutorials, code examples, etc. on how to ‘find and isolate’ each cookie (is it set with js or php for instance).

    I don’t want to put you off, but if you are going to release this as a solution to the EU directive then you need to think carefully about who you are releasing it to (coders, content managers, site owner who just copy/pastes) and make sure you do not offer any compliance guarantees, either explicitly or implied.

    Good luck,

    Chris.

    # May 1, 2012 at 7:35 pm

    @andy

    I am not a lawyer, but have read pretty much all the documentation from the ICO and EU about this directive. It is horrible and very dry.

    The best javascript solution I have seen is the one by wolf-software – http://jpecr.dev.wolf-software.com/ – it is also free, and has some good documentation with it.

    http://www.ico.gov.uk/news/latest_news/2011/must-try-harder-on-cookies-compliance-says-ico-13122011.aspx

    is a good link to the ICO, and it links to a guidance document that is a “must read” for any UK based solution.

    Regards,

    Chris.

    # May 2, 2012 at 5:48 am

    Many thanks Chris, I think my band-aid idea is definitely not a viable option.

    Appreciate your replies and will have a good read through.

    This cookie law is such a stupid idea it’s untrue.

    # May 2, 2012 at 8:13 am

    Totally agree, it has not been properly thought out.

    Mostly it not enforcable, the ICO employs around 350 people – even if all of them were checking website compliance they would be swamped.

    The ICO are not even sure what compliance is yet, or what it will be in a years time!

    Dave Evans, Group Manager for Business & Industry at the Information Commissioner’s Office (ICO), was interviewed in April this year – these are couple of his answers (full interview http://econsultancy.com/uk/blog/9610-q-a-the-ico-s-dave-evans-on-eu-cookie-law-compliance )


    Will you come up with a definitive answer on what compliance is?

    We don’t know what compliance will look like in a year’s time.

    There are lots of gaps here, and we want people to fill them with good practice. We can then point to examples of this and everyone will have a greater understanding of what is required.

    We hope that this will pick up over the next month or so.

    Will ‘implied consent’ solutions be enough in some cases?

    The law does allow us some leeway, and if a company’s revenue would drop if it went for a strict opt-in, then we could look at different ways of educating users and gaining consent.

    Just because analytics cookies are caught by this law doesn’t mean a strict opt-in is necessary. It could, in some cases, be seen as an essential part of the relationship.

    If a website says ‘we’d like you to use cookies, but click here if you don’t want us to, and click anywhere else to continue’. If customers have seen this message, then this may be enough in most cases.

    If it looks like an organisation has put enough information there, and it is clearly visible, such that it wouldn’t be likely that users would miss it, then it’s unlikely we would take that [complaint] further.


    This sounds different to the advice given in the guidance document produced by the ICO http://www.ico.gov.uk/news/latest_news/2011/~/media/documents/library/Privacy_and_electronic/Practical_application/guidance_on_the_new_cookies_regulations.ashx

    My thoughts, for what they are worth (IANAL):
    1. Update privacy policy to list the cookies used.
    2. State that “We are working towards a compliant solution for the EU e-privacy directive 2009/136/EN”
    3. Providing you are not a big-bussiness, simply wait and see what the ICO says in a couple of months time.

    This is what I am advising my small business and hobby/personal site clients to do.

    Having said that, I am working on a solution for Joomla – which started as a little side-project, a sort-of technical challenge along the lines of “how could this be done without having to add code to every module/component/add-on that uses cookies?”. It has grown a bit since then, from theory, through proof of concept, to finalising the details and making it a standard add-on module. Once complete I will release it on github.

    Chris.

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".