Bem-vindo ao site John Pires!

Javascript – Fund. Básicos

Home/Curso/Javascript – Fund. Básicos

Javascript – Fund. Básicos

Javascript – Aprendendo Sobre Cookies



O que são cookies?

Os navegadores e servidores da Web usam o protocolo HTTP para se comunicar e o HTTP é um protocolo sem estado. Mas, para um site comercial, é necessário manter as informações da sessão entre as diferentes páginas. Por exemplo, o registro de um usuário termina após completar muitas páginas. Mas como manter as informações da sessão dos usuários em todas as páginas da web.

Em muitas situações, o uso de cookies é o método mais eficiente de lembrar e rastrear preferências, compras, comissões e outras informações necessárias para uma melhor experiência do visitante ou estatísticas do site.

Como funciona ?




Seu servidor envia alguns dados para o navegador do visitante na forma de um cookie. O navegador pode aceitar o cookie. Em caso afirmativo, ele é armazenado como um registro de texto simples no disco rígido do visitante. Agora, quando o visitante chega a outra página do seu site, o navegador envia o mesmo cookie ao servidor para recuperação. Uma vez recuperado, seu servidor sabe / lembra o que foi armazenado anteriormente.

Cookies são um registro de dados de texto simples de 5 campos de comprimento variável :

  • Expira – A data em que o cookie irá expirar. Se estiver em branco, o cookie irá expirar quando o visitante sair do navegador.
  • Domínio – o nome de domínio do seu site.
  • Caminho – o caminho para o diretório ou página da web que definiu o cookie. Isso pode ficar em branco se você quiser recuperar o cookie de qualquer diretório ou página.
  • Seguro – se este campo contiver a palavra “seguro”, o cookie só poderá ser recuperado com um servidor seguro. Se este campo estiver em branco, não existe tal restrição.
  • Nome = valor – os cookies são definidos e recuperados na forma de pares de valores-chave

Os cookies foram originalmente projetados para programação CGI. Os dados contidos em um cookie são transmitidos automaticamente entre o navegador da web e o servidor da web, para que os scripts CGI no servidor possam ler e gravar valores de cookies armazenados no cliente.

JavaScript também pode manipular cookies usando a propriedade cookie do objeto Document. JavaScript pode ler, criar, modificar e excluir os cookies que se aplicam à página da web atual.

Armazenando Cookies



A maneira mais simples de criar um cookie é atribuir um valor de string ao objeto document.cookie, que se parece com isto.

document.cookie = "key1 = value1;key2 = value2;expires = date";

Aqui, o atributo expires é opcional. Se você fornecer a este atributo uma data ou hora válida, o cookie irá expirar em uma determinada data ou hora e, a partir de então, o valor dos cookies não estará acessível.

Observação – os valores dos cookies não podem incluir ponto e vírgula, vírgula ou espaço em branco. Por esse motivo, você pode querer usar a função escape () do JavaScript para codificar o valor antes de armazená-lo no cookie. Se você fizer isso, também terá que usar a função unescape () correspondente ao ler o valor do cookie.
Exemplo

Experimente o seguinte. Ele define um nome de cliente em um cookie de entrada.

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function WriteCookie() {
               if( document.myform.customer.value == "" ) {
                  alert("Enter some value!");
                  return;
               }
               cookievalue = escape(document.myform.customer.value) + ";";
               document.cookie = "name=" + cookievalue;
               document.write ("Setting Cookies : " + "name=" + cookievalue );
            }
         //-->
      </script>      
   </head>
   
   <body>      
      <form name = "myform" action = "">
         Enter name: <input type = "text" name = "customer"/>
         <input type = "button" value = "Set Cookie" onclick = "WriteCookie();"/>
      </form>   
   </body>
</html>

Agora sua máquina tem um cookie chamado nome. Você pode definir vários cookies usando vários pares de chave = valor separados por vírgula.

Lendo Cookies



Ler um cookie é tão simples quanto escrever um, porque o valor do objeto document.cookie é o cookie. Portanto, você pode usar essa string sempre que quiser acessar o cookie. A string document.cookie manterá uma lista de pares name = value separados por ponto e vírgula, onde name é o nome de um cookie e value é o valor da string.

Você pode usar a função split () de strings para quebrar uma string em chave e valores da seguinte maneira –
Exemplo

Tente o exemplo a seguir para obter todos os cookies.

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function ReadCookie() {
               var allcookies = document.cookie;
               document.write ("All Cookies : " + allcookies );
               
               // Get all the cookies pairs in an array
               cookiearray = allcookies.split(';');
               
               // Now take key value pair out of this array
               for(var i=0; i<cookiearray.length; i++) {
                  name = cookiearray[i].split('=')[0];
                  value = cookiearray[i].split('=')[1];
                  document.write ("Key is : " + name + " and Value is : " + value);
               }
            }
         //-->
      </script>      
   </head>
   
   <body>     
      <form name = "myform" action = "">
         <p> click the following button and see the result:</p>
         <input type = "button" value = "Get Cookie" onclick = "ReadCookie()"/>
      </form>      
   </body>
</html>

Definição da data de expiração dos cookies



Você pode estender a vida de um cookie além da sessão atual do navegador, definindo uma data de expiração e salvando a data de expiração dentro do cookie. Isso pode ser feito definindo o atributo ‘expira’ para uma data e hora.

Exemplo

Experimente o seguinte exemplo. Ele ilustra como estender a data de validade de um cookie em 1 mês.

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function WriteCookie() {
               var now = new Date();
               now.setMonth( now.getMonth() + 1 );
               cookievalue = escape(document.myform.customer.value) + ";"
               
               document.cookie = "name=" + cookievalue;
               document.cookie = "expires=" + now.toUTCString() + ";"
               document.write ("Setting Cookies : " + "name=" + cookievalue );
            }
         //-->
      </script>      
   </head>
   
   <body>
      <form name = "myform" action = "">
         Enter name: <input type = "text" name = "customer"/>
         <input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
      </form>      
   </body>
</html>

Excluindo um Cookie



Às vezes, você desejará excluir um cookie para que as tentativas subsequentes de ler o cookie não retornem nada. Para fazer isso, você só precisa definir a data de validade para uma hora no passado.

Exemplo

Experimente o seguinte exemplo. Ele ilustra como excluir um cookie definindo sua data de validade para um mês antes da data atual.

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function WriteCookie() {
               var now = new Date();
               now.setMonth( now.getMonth() - 1 );
               cookievalue = escape(document.myform.customer.value) + ";"
               
               document.cookie = "name=" + cookievalue;
               document.cookie = "expires=" + now.toUTCString() + ";"
               document.write("Setting Cookies : " + "name=" + cookievalue );
            }
          //-->
      </script>      
   </head>
   
   <body>
      <form name = "myform" action = "">
         Enter name: <input type = "text" name = "customer"/>
         <input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
      </form>      
   </body>
</html>



Leave a Comment

Copyright John Pires - Todos os direitos reservados

SIGN IN

Forgot Password

Message modal