2

Sei criar cookies em JavaScript, mas não sei como aplicar eles em algum projeto. Alguém poderia postar um exemplo de como usar cookies?

1

1 Resposta 1

8

Como respondi em Gravar cookie e ler seu valor ao aceder ao web site para verificar se expirado

Você deve usar document.cookie para criar os cookies conforme a necessidade e o script deve rodar em um servidor (como Apache por exemplo), acesso local (protocolo file://) geralmente não funciona com cookies.

note que alguns navegadores bloqueiam cookies gerados pelo http://localhost, para contornar o problema use o endereço http://127.0.0.1

Para criar um cookie devemos usar os parâmetros suportados são:

  • ;path= deve conter o caminho/path HTTP que poderá ser usado para limitar aonde o cookie deve ser acessível
  • ;expires= deve conter data em formato GMT de quando vai expirar
  • ;max-age= deve conter conter o tempo em segundos de quando o cookie deve expirar, não é necessário usar max-age e expires ao mesmo tempo
  • ;secure especifica que o cookie só deve funcionar sobre o protocolo HTTPS

O nome do cookie (chave) e o valor podem ser codificados com encodeURIComponent para evitar que caracteres como espaços ou ; façam os dados se perderem.

Exemplo de com como criar um cookie:

document.cookie="<chave>=<valor>; expires=<data para expirar>; path=<caminho HTTP>";

Um exemplo de cookie que deve expirar em 31/12/2018 as 23:59:59 (em GMT):

document.cookie="chave=valor; expires=Mon, 31 Dec 2018 23:59:59 GMT;path=/"

Note que talvez ao invés de cookies você pode usar localStorage e sessionStorage (https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage)

Por exemplo com sessionStorage:

// Salva dados
sessionStorage.setItem("foo", "bar");

// Pega os dados
alert( "foo = " + sessionStorage.getItem("foo"));

Por exemplo com localStorage:

// Salva dados
localStorage.setItem("baz", "bar");

// Pega os dados
alert( "foo = " + localStorage.getItem("baz"));

A diferença entre sessionStorage e localStorage é que o primeiro expira sempre que o navegador é fechado, o segundo se mantém

Nota: se quiser usar localStorage com tempo para expirar veja esta outra resposta que criei Como fazer para que o Local Storage expire?


Mas como a questão sobre cookies, irei mostrar um exemplo com tal, então criei as seguintes funções:

function getCookie(k) {
    var cookies = " " + document.cookie;
    var key = " " + k + "=";
    var start = cookies.indexOf(key);

    if (start === -1) return null;

    var pos = start + key.length;
    var last = cookies.indexOf(";", pos);

    if (last !== -1) return cookies.substring(pos, last);

    return cookies.substring(pos);
}

function setCookie(k, v, expira, path) {
    if (!path) path = "/";

    var d = new Date();
    d.setTime(d.getTime() + (expira * 1000));

    document.cookie = encodeURIComponent(k) + "=" + encodeURIComponent(v) + "; expires=" + d.toUTCString() + "; path=" + path;
}

Para definir o seu cookie de ID, faça isto:

setCookie("chave", "valor");

Para ler o cookie que chamamos de chave faça assim:

var resultado = getCookie("chave");
console.log(resultado); //Exibe o resultado ou exibe null se tiver expirado ou não for acessível a partir do PATH da URL atual

Para definir um tempo para expirar o cookie faça assim:

setCookie("foo", "baz", 3600);//Expira o cookie "foo" em uma hora

Para restringir o cookie somente a certas caminhos HTTP (rotas) use assim:

setCookie("bar", "baz", false, "/pasta2/");//o cookie só estara acessível em urls como http://site/pasta2/*

Se quiser definir um tempo para expirar em um PATH especifico use assim:

setCookie("bar", "baz", 86400, "/pasta3/");//o cookie só estará acessível em urls como http://site/pasta3/* e irá expirar em 24 horas

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .