Conceito de Origem e Restrições do Navegador

Na arquitetura web, a segurança é fundamentada na Política de Mesma Origem (Same-Origin Policy). Uma origem é definida pela combinação exata de três componentes: o protocolo (ex: HTTP ou HTTPS), o nome de domínio e o número da porta. Quando um cliente tenta acessar um recurso onde qualquer um desses três elementos difere do contexto atual, ocorre uma solicitação cross-origin.

Os navegadores modernos impõem restrições rigorosas a esse tipo de comunicação para mitigar vulnerabilidades, como ataques de falsificação de solicitação entre sites (CSRF). Sem mecanismos adequados, scripts maliciosos poderiam explorar a sessão ativa de um usuário em outro domínio.

Mecanismos de Contorno

JSONP (Legado)

Antes da padronização atual, utilizava-se o JSON with Padding (JSONP). Esta técnica explora o fato de que tags como <script> não estão sujeitas à política de mesma origem. O funcionamento baseia-se em um acordo entre cliente e servidor: o cliente define uma função de callback e o servidor retorna um script JavaScript que executa essa função, passando os dados como argumento.

Embora compatível com navegadores antigos, o JSONP possui limitações críticas, suportando apenas verbos HTTP do tipo GET e oferecendo tratamento de erros insuficiente.

CORS (Padrão Atual)

O Cross-Origin Resource Sharing (CORS) é a especificação W3C vigente que permite relaxar as restrições de segurança de forma controlada. Através de cabeçalhos HTTP específicos, o servidor informa ao navegador quais origens externas estão autorizadas a consumir seus recursos.

Para solicitações complexas (que não sejam simples GET/POST com headers padrão), o navegador realiza automaticamente uma requisição prévia (preflight) utilizando o método OPTIONS. Somente após a confirmação do servidor, a requisição real é enviada.

Implementação em Django

Para habilitar CORS em projetos Django, recomenda-se o uso da biblioteca django-cors-headers, que gerencia automaticamente os cabeçalhos necessários nas respostas.

Instalação e Configuração Inicial

Primeiro, instale o pacote via gerenciador de dependências:

pip install django-cors-headers

Em seguida, registre a aplicação nas configurações do projeto:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'corsheaders',
    'django.contrib.contenttypes',
    # ... outras apps
]

Middleware

É crucial que o middleware do CORS seja posicionado antes do middleware comum do Django para garantir que os cabeçalhos sejam injetados corretamente:

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.security.SecurityMiddleware',
    # ... outros middlewares
]

Definição de Origens Permitidas

No arquivo settings.py, configure quais domínios frontend têm permissão para acessar a API. Utilize uma lista para definir as origens confiáveis:

# Domínios autorizados a fazer requisições
CORS_ALLOWED_ORIGINS = [
    "http://localhost:3000",
    "http://127.0.0.1:3000",
    "https://frontend.producao.com.br",
]

# Caso seja necessário enviar cookies ou credenciais
CORS_ALLOW_CREDENTIALS = True

# Hosts permitidos pelo Django também devem ser atualizados
ALLOWED_HOSTS = [
    '127.0.0.1',
    'localhost',
    'api.producao.com.br'
]

Personalização de Métodos e Cabeçalhos

Por padrão, a biblioteca já cobre os verbos comuns, mas é possível explicitar quais métodos HTTP e headers customizados são aceitos pela API:

CORS_ALLOW_METHODS = [
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
]

CORS_ALLOW_HEADERS = [
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
]