Produtos Divertidos? Eu Compraria!

O desenvolvedor é um blog sobre desenvolvimento web, não tratando apenas de programação mas também compartilhando experiências, métodos, debates e tendências da internet.

O Desenvolvedor é um blog de www.andafter.org
Assinar o Feed RSS
Classe para gravar e ler cookies - por javascript

Classe para gravar e ler cookies - por javascript

BomEste texto foi classificado como Bom
Em Internet, Programação, Softwares
Por Chris Benseler
4 de Agosto de 2008

Veja como criar uma classe em javascript usando a biblioteca Prototype para manipular cookies

RSS Acompanhe O Desenvolvedor por Feeds!


Juntando a idéia desse post do @gserrano sobre cookies (em ASP) e esse outro que fiz semana passada sobre orientação a objetos em javascript usando a biblioteca Prototype, tive a idéia de disponibilizar uma classe que fiz certa vez para gravar e ker cookies da máquina do usuário da sua aplicação.
*não vou aqui discutir a segurança e todos os outros pontos relativos ao não-uso de cookies (o qual concordo, mas certas vezes temos que fazer coisas na nossa vida profissional que vão contra nossos conceitos, né? :-/ )

Esse é o código da classe:

Cookie.prototype = {
    //construtor padrão
    initialize: function() {
         
    },
    /*
     * salva cookie no formato {chave}={valor};
     */
    setCookie: function(key, value) {
        var the_cookie = key + "=" + value + ";" ;
        document.cookie = the_cookie;
    },
   
    /*
     * retorna valor do cookie
     */
    getCookie: function (key) {
        var search = key + "="
        var returnvalue = "";
        if (document.cookie.length > 0) {
            offset = document.cookie.indexOf(search)
            if (offset != -1) {
                offset += search.length
                end = document.cookie.indexOf(";", offset);
                if (end == -1)
                    end = document.cookie.length;
                returnvalue=unescape(document.cookie.substring(offset, end))
            }
        }
        return returnvalue;
    }
}

A classe é bem simples: um método setCookie(key, value), o qual recebe uma chave e um valor; a chave é usada como o identificador do cookie, e o valor... bem, ele é o valor propriamente dito.
O outro método é o getCookie(key), que é chamado sendo passada a chave (identificador) referente ao cookie que você quer saber o valor que havia sido gravado.

Vale ressaltar que document.cookie é um comando (pensando se esse é o termo correto) nativo do javascript

Segue abaixo um exemplo funcional (html + javascript) onde há um formulário com dois campos. Ao clicar em salvar, é chamada a função que instancia o objeto Cookie e grava os valores. A outra função instância outro objeto Cookie e lê do cookie do browser do usuário, procurando a chave salva.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="prototype.js"></script>
<title>Cookie.js</title>
<script type="text/javascript">
var Cookie = Class.create();
Cookie.prototype = {
    //construtor padrão
    initialize: function() {
         
    },
    /*
     * salva cookie no formato {chave}={valor};
     */
    setCookie: function(key, value) {
        var the_cookie = key + "=" + value + ";" ;
        document.cookie = the_cookie;
    },
    
    /*
     * retorna valor do cookie
     */
    getCookie: function (key) { 
        var search = key + "="
        var returnvalue = "";
        if (document.cookie.length > 0) {
            offset = document.cookie.indexOf(search)
            if (offset != -1) { 
                offset += search.length
                end = document.cookie.indexOf(";", offset);
                if (end == -1)
                    end = document.cookie.length;
                returnvalue=unescape(document.cookie.substring(offset, end))
            }
        }
        return returnvalue;
    }
}
function salvarCookie() {
    var ck = new Cookie();
    ck.setCookie($F(´key´), $F(´value´));
}
function lerCookie() {
    var ck = new Cookie();
    alert(ck.getCookie($F(´key´)));
}
</script>
</head>
<body>
<h1>Cookie.js - teste</h1>
<form name="cookie" action="#">
    <label for="key">chave:</label><input type="text" name="key" id="key" />
    <label for="value">valor:</label><input type="text" name="value" id="value" />
    <a href="#" onclick="salvarCookie(); return false;" title="salvar cookie">salvar cookie</a>
    <a href="#" onclick="lerCookie(); return false;" title="ler cookie">ler cookie</a>
</form>
</body>
</html>
 
O que você achou do texto?

  • Muito ruim
  • Ruim
  • Regular
  • Bom
  • Muito bom
Sua opinião é o que faz a comunidade funcionar, colabore para isso!

Tags: cookie, javascript, classe, orientacao-a-objetos

Enviar para um amigo
Você pode comentar, assinar o feed, conhecer mais sobre o autor e ajudar a divulgar este artigo em sua ferramenta favorita através dos botões abaixo.
  • Rec6
  • ueba
  • linkk
  • dihitt
  • linkloko
  • websapiens
  • linkto
  • Eu curti

Comentários

Guilherme Serrano

6/8/2008 02:37:00

Ainda não testei, mas bacana isso. Vou procurar aplicar o que eu puder client-side para poupar servidor, acho que estou ficando meio paranóico com isso devido a quantidade de códigos e algoritmos doentes que fiz nos últimos tempos por causa do projeto (megalomaníaco) de sistema emergente e colaborativismo e o escambal do And After... hahaha

Sem testar eu só não entendi qual o valor gravado no cookie ali no exemplo, sou noob demais em js. Quando eu testar volto comentar a experiência. :D

[Responder este comentário]

Tiago Takamoto

10/9/2008 08:31:00

Muito interessante Chris, também tenho me aventurado atualmente com a orientação a objeto em Javascript também utilizando o prototype e o inheritance do Alex Arnell... também não acho que vale a pena entrarmos no mérito de segurança do Cookie porém à muito tempo tenho evitado manipular cookies com Javascript. Quem sabe a partir da sua iniciativa eu não tome coragem e faça algum trabalho utilizando eles.

Boa codificação.

Att.,

Takamoto

[Responder este comentário]
Deixe seu comentário!

Nome (requerido)

E-mail (requerido - não será divulgado)

URL

Quanto é 2 + 7?




web tracker