O que são cookies?

A Web foi projetada para que cada solicitação de um navegador a um site seja separada. Por design, a Web não tem "memória". Toda vez que você abre uma página da Web, o site que está visitando não consegue lembrar das informações da sua última sessão. Isso ajuda a tornar a Web eficiente, já que não há necessidade de um mecanismo para rastrear solicitações e respostas.

Mas a natureza esquecida da Web também apresenta um problema. Por exemplo, como um carrinho de compras pode funcionar se o site em que você está não consegue se lembrar do que você acabou de colocar nele?

Os cookies foram inventados para resolver esse problema.

Os cookies dão memória aos sites

Quando você visita uma página em um site, o navegador faz solicitações ao servidor do site para os recursos incluídos na página, como HTML, CSS, JavaScript ou imagens.

Os navegadores da Web e os sites interagem seguindo o protocolo HTTP. Esse é um conjunto padronizado de regras para comunicação.

Em resposta a uma solicitação HTTP de um recurso, o servidor do site pode incluir informações extras chamadas de cabeçalhos junto com o recurso em si. Um cabeçalho Set-Cookie incluído em uma resposta HTTP diz ao navegador para armazenar um texto: um nome e um valor. Isso é conhecido como um cookie. Por exemplo, o cabeçalho de resposta Set-Cookie: cat=tabby informa ao navegador para armazenar um cookie com o nome "cat" e o valor "tabby".

Depois que esse cookie é definido, as solicitações subsequentes do seu navegador ao site incluem o cabeçalho Cookie: cat=tabby. O servidor do site pode acessar o cookie no cabeçalho da solicitação e usar o valor.

Como os cookies funcionam: um guia explicativo

Imagine que você acessa o site cats.example. O site quer mostrar uma imagem aleatória de um gato e manter um registro de qual gato foi mostrado para você.

As etapas a seguir explicam como fazer isso com cookies.

1. O navegador solicita um arquivo

Você acessa a página inicial do site cats.example.

Depois que o navegador processa o HTML da página inicial, ele solicita os arquivos na página, incluindo cat.jpg de cats.example.

Uma solicitação HTTP para https://cats.example/cat.jpg

2. O servidor do site responde

O servidor em cats.example responde com o arquivo de imagem cat.jpg.

Com a resposta, o servidor inclui um cabeçalho: Set-Cookie: cat=tabby.

Uma resposta HTTP de https://cats.example/cat.jpg, com um cabeçalho Set-Cookie:
cat=tabby

3. O navegador recebe a resposta

O navegador recebe o arquivo de imagem e processa o cabeçalho Set-Cookie: cat=tabby incluído nele.

Um cookie é armazenado: nome cat, valor tabby.

O cookie cat=tabby em um navegador da Web em um laptop.

4. O navegador faz outras solicitações

A partir de agora, seu navegador inclui o cabeçalho Cookie: cat=tabby com solicitações para cats.example.

Uma solicitação HTTP para https://cats.example/cat.jpg, com um cabeçalho Cookie: cat=tabby

Quando o servidor da Web cats.example recebe uma solicitação, ele pode processar o cookie e fazer o que quiser com esse valor, como garantir que não envie uma imagem do mesmo gato malhado novamente.

Este é o processo completo de cookies:

  1. O navegador solicita um arquivo do servidor de um site.
  2. O servidor pode incluir um cabeçalho, como Set-Cookie: cat=tabby, com o arquivo enviado em resposta à solicitação.
  3. Quando o navegador recebe a resposta, ele armazena o cookie.
  4. Com cada solicitação subsequente, o navegador envia o cookie para o servidor em um cabeçalho Cookie: cat=tabby.


Diagrama de sequência mostrando solicitações e respostas entre um navegador da Web, cats.example e cats.example, mostrando como os cookies são definidos e enviados.

Acessar cookies com JavaScript

O exemplo anterior usa o cabeçalho de resposta Set-Cookie para definir um cookie.

Também é possível criar cookies com JavaScript usando o método document.cookie.

Teste a demonstração: javascript-cookie.glitch.me.

Saiba mais: Documento: propriedade de cookie.

Por que precisamos de cookies?

Em 1994, o engenheiro Lou Montulli trabalhava na empresa de software Netscape, que criou o navegador da Web mais popular de meados da década de 1990. Enquanto isso, uma empresa de telecomunicações, a MCI, tentava criar um carrinho de compras para uma das primeiras lojas on-line do mundo. A MCI entrou em contato com Montulli para explicar o problema. Montulli respondeu adicionando um recurso ao HTTP que permitia que um site armazenasse uma pequena quantidade de texto no navegador da Web de um usuário, um nome e um valor: algo como cart-id=123. Ele chamou de "cookie", já que naquela época os programadores usavam a palavra "cookie mágico" para um pequeno pedaço de informação extra incluído na comunicação de dados.

Montulli concluiu o trabalho com cookies HTTP em menos de uma semana. Ele não sabia que os cookies se tornariam fundamentais para recursos críticos da plataforma da Web, incluindo publicidade, login, pagamentos e detecção de fraudes. Os cookies são uma tecnologia aparentemente simples que teve efeitos colaterais de longo alcance.

Usos de cookies

Os cookies permitem que o navegador armazene uma pequena quantidade de informações sobre o usuário para "lembrar" algo em várias solicitações. Os cookies têm vários usos:

  • Gerenciamento de sessões
    Permite que um site reconheça um usuário, por exemplo, para manter um estado conectado em diferentes páginas.
  • Personalização
    Armazena preferências do usuário, como idioma, tema ou itens visualizados recentemente, para personalizar a experiência no site.
  • Rastreamento
    Historicamente, os cookies são usados para rastrear o comportamento do usuário em sites, para publicidade segmentada e outros casos de uso.

Os cookies são usados principalmente para identificadores, e não para armazenar informações diretamente.

Por exemplo, um cookie do carrinho de compras de uma loja de animais on-line não lista produtos, mas fornece um ID de conta que permite à loja pesquisar o que está no carrinho no armazenamento de dados do lado do servidor.

Uma solicitação ao servidor da pet shop pode incluir um cabeçalho de cookie como este:

Cookie: _cart=CART1.2.34567890.123456789

Em seguida, o servidor pode pesquisar a conta _cart no repositório de dados e incluir outras informações sobre a solicitação.

Saiba mais