Gostaria de deixar claro que todos os códigos que apresento são testados no mínimo no Internet Explorer, Netscape 4.5, Netscape 7 e Opera 7, rodando na plataforma Windows. Gostaria de deixar claro também que o Javascript não trabalha como uma linguagem server-side e não consegue ter a informação do número de IP do usuário. Por esse motivo, toda vez que o usuário recarregar a página será contada uma visita.
Sempre que se trabalha com cookie, é necessário criar funções para criar, recuperar e deletar um cookie. Uma função extra é criada para reparar a data para browsers mais antigos, principalmente Netscape.
Exemplo:
1 function setCookie(name, value, expires, path, domain, secure) {
2 var curCookie = name + "=" + escape(value) +
3 ((expires) ? "; expires=" + expires.toGMTString() : "") +
4 ((path) ? "; path=" + path : "") +
5 ((domain) ? "; domain=" + domain : "") +
6 ((secure) ? "; secure" : "");
7 document.cookie = curCookie;
8 }
9 function getCookie(name) {
10 var dc = document.cookie;
11 var prefix = name + "=";
12 var begin = dc.indexOf("; " + prefix);
13 if (begin == -1) {
14 begin = dc.indexOf(prefix);
15 if (begin != 0) return null;
16 } else
17 begin += 2;
18 var end = document.cookie.indexOf(";", begin);
19 if (end == -1)
20 end = dc.length;
21 return unescape(dc.substring(begin + prefix.length, end));
22 }
23 function deleteCookie(name, path, domain) {
24 if (getCookie(name)) {
25 document.cookie = name + "=" +
26 ((path) ? "; path=" + path : "") +
27 ((domain) ? "; domain=" + domain : "") +
28 "; expires=Thu, 01-Jan-70 00:00:01 GMT";
29 history.go(0);
30 }
31 }
32 function fixDate(date) {
33 var base = new Date(0);
34 var skew = base.getTime();
35 if (skew > 0) date.setTime(date.getTime() - skew);
36 }
Linha 1 – Declaração da função setCookie responsável pela criação do cookie.
Linha 2 – Declaração da variável curCookie que recebera os valores dos argumentos da função.
name – nome do cookie
value – valor do cookie
[expires] – data de expiracao do cookie (por padrão quando o browser for fechado)
[path] – caminho para qual o cookie é valido (por padrão o caminho do documento que está o chamando)
[domain] – dominio para qual o cookie é valido (por padrão o domínio do documento que está o chamando)
[secure] – Valor booleano indicando se a transmissão do cookie requer segurança.
Linha 7 – Criação do cookie com as informações recebidas pela função.
Linha 9 – Declaração da função getCookie, responsável por recuperar as informações do cookie.
Linha 10 – Declaração da variável dc com a intenção de economizar digitação.
Linha 11 – Declaração da variável prefix que contém informações para fazer a verificação no cookie.
Linha 12 – Declaração da variável begin que fará a verificação do início das informações do cookie.
Linha 13 – Verificação da variável begin. Se retornar true, a variável begin é setada com outro valor.
Linha 15 – Verificação se a variável begin != 0. Se retornar true, a função retornará um valor nulo, se não a variável begin acrescentará 2 ao seu valor.
Linha 18 – Declaração da variável end que fará a verificação onde será o fim das informações do cookie.
Linha 19 – Verificação da variável end. Se retornar false, a variável end é setada com o valor do tamanho da variável dc .
Linha 21 – A função retornará uma parte do cookie onde contem as informações referentes aos valores do mesmo.
Linha 23 – Declaração da função deleteCookie responsável por apagar as informações do cookie.
name – nome do cookie
value – valor do cookie
[domain] – dominio para qual o cookie é valido (por padrão o domínio do documento que está o chamando)
Linha 24 – Verificação se o cookie referido pelo argumento name existe. Se retornar true, o cookie recebe informações vazias.
Linha 29 – A página página é recarregada para as alterações terem efeito.
Linha 32 – Declaração da função fixDate responsável por consertar erro de data de alguns navegadores antigos.
Criada as funções responsáveis pela manipulação do cookie, vamos agora criar o código para ler e escrever na tela quantas vezes o usuário já visitou a página.
1 var now = new Date();
2 fixDate(now);
3 now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
4 var visits = getCookie("counter");
5 if (!visits) {
6 visits = 1;
7 document.write("A propósito esta é a sua primeira vez por aqui.");
8 } else {
9 visits = parseInt(visits) + 1;
10 document.write("A propósito você já esteve aqui " + visits + " vezes.");
11 }
12 setCookie("counter", visits, now);
Linha 1 – Declaração da variável now que recebe o valor da instancia do objeto Date.
Linha 2 – Uma chamada da função fixDate para consertar a data passada pela variável now.
Linha 3 – A variável now recebe um novo valor referente à data atual mais um ano, que será o tempo de duração do cookie.
Linha 4 – Declaração da variável visits que receberá as informações do cookie counter.
Linha 5 – Verificação se variável visits contém algum valor. Se retornar false, a variável vai ser setada com o valor = 1 e será escrito na página que é a primeira vez que o usuário está acessando. Se retornar true, a variável vai acrescentar 1 ao seu valor e será escrito na página quantas vez que o usuário esteve por ali.
Linha 12 – A função setCookie é chamada com a intenção de registrar o cookie com o valor acrescido.
Esse código é muito simples e tem um propósito muito bom para quem não quer ou não sabe trabalhar com linguagem de programação server-side para criar um contador de visitas.
Sempre lembrando que a partir do momento que o usuário apagar os cookies da máquina, quando o mesmo retornar à pagina o contador vai ter sido reiniciado.
Vou deixar um exemplo do código acima em anexo.