Utilia
Categorias ▾
Idioma: pt ▾

Gerador de hash SRI

Gera hashes Subresource Integrity (SRI) sha384 para um ficheiro JavaScript ou CSS e copia os atributos integrity e crossorigin prontos a usar.

Cola o conteúdo do ficheiro ou abre o próprio ficheiro: esta ferramenta não descarrega URLs. Ler um script de outro site exigiria que esse servidor o permitisse (CORS) ou que um servidor nosso o fosse buscar por ti, e nada do que calculas aqui sai do teu navegador. Calcula o hash do ficheiro exato que vais servir.

Calcular hash de

O texto é processado como UTF-8. Os navegadores convertem os fins de linha do Windows (CRLF) em LF no texto colado, e um único byte diferente estraga o hash: na dúvida, abre o próprio ficheiro.

Algoritmos

O URL só é escrito no snippet, nunca é pedido. Deixa-o vazio para usar o nome do ficheiro.

Como gerar um hash SRI

  1. Em Calcular hash de, escolhe Código colado ou Ficheiros.
  2. Cola o conteúdo exato do script ou da folha de estilos em Conteúdo do script ou da folha de estilos e clica em Gerar hash SRI, ou larga um ou mais ficheiros .js e .css na zona de largar. Os hashes atualizam-se enquanto escreves.
  3. Mantém SHA-384 (recomendado) marcado, ou acrescenta SHA-256 e SHA-512. Cada algoritmo marcado acrescenta um elemento ao valor.
  4. Escolhe a Etiqueta (automática pelo nome do ficheiro, <script>, <script type="module"> ou <link rel="stylesheet">), escreve o URL do recurso para o snippet (opcional) e escolhe o modo crossorigin.
  5. Copia o valor integrity ou a etiqueta completa.
  6. Para verificar uma etiqueta que já usas, cola o valor ou a etiqueta inteira em Verificar um valor integrity existente (opcional).

O que faz o Subresource Integrity

Quando uma página carrega um script de uma CDN, o navegador confia em tudo o que esse servidor devolver. Se a CDN for comprometida ou o ficheiro for alterado, o código modificado corre com acesso total à tua página. O Subresource Integrity (SRI do W3C) fecha essa brecha: publicas o hash esperado do ficheiro no atributo integrity, o navegador calcula o hash do que descarrega e recusa executar o script ou aplicar a folha de estilos se os dois forem diferentes.

<script src="https://cdn.example.com/lib.min.js"
        integrity="sha384-H8BRh8j48O9oYatfu5AZzq6A9RINhZO5H16dQZngK7T62em8MUt1FLm52t+eX6xO"
        crossorigin="anonymous"></script>

O valor é o nome do algoritmo, um hífen e o resumo (digest) em Base64 dos bytes do ficheiro. Esse exemplo é o hash de alert('Hello, world.'); tirado da especificação SRI. Quando são indicados vários hashes, os navegadores só olham para o algoritmo mais forte presente e aceitam o ficheiro se qualquer hash desse algoritmo corresponder. É assim que um site pode indicar duas versões de um ficheiro durante uma atualização.

Porque é que o crossorigin é obrigatório

Para um ficheiro noutra origem, o navegador só consegue verificar a integridade se a resposta for obtida em modo CORS, por isso a etiqueta precisa de um atributo crossorigin e o servidor tem de responder com um cabeçalho Access-Control-Allow-Origin. Usa anonymous (sem cookies) para CDNs públicas; use-credentials serve para os raros recursos privados. Sem CORS, o navegador bloqueia o ficheiro em vez de o carregar sem verificação.

Porque é que esta ferramenta não descarrega URLs

Esta ferramenta só calcula o hash do código que colas ou dos ficheiros que abres. Descarregar um script a partir do URL dentro da página só funcionaria se esse servidor permitisse leituras de outras origens, e contornar isso exigiria um servidor que fosse buscar o ficheiro por ti, que também veria aquilo de que calculas o hash. Aqui tudo corre no teu navegador. O método mais simples é descarregares o ficheiro exato que vais referenciar (a mesma versão e a mesma build minificada) e abri-lo aqui.

Perguntas frequentes

Que algoritmo devo usar?

O SHA-384 é a escolha habitual e o que a maioria das CDNs publica. O SHA-256 e o SHA-512 também são suportados por todos os navegadores modernos. O MD5 e o SHA-1 não são permitidos no SRI.

O meu hash está certo, mas o navegador continua a bloquear o ficheiro. Porquê?

Confirma que o servidor envia Access-Control-Allow-Origin e que a etiqueta tem crossorigin. Verifica também se a CDN serve exatamente os mesmos bytes: uma versão diferente, um minificador automático ou a falta de uma quebra de linha final alteram o hash.

Porque é que o código colado dá um hash diferente do ficheiro?

Os navegadores convertem os fins de linha do Windows (CRLF) em LF nos campos de texto, e um editor pode acrescentar ou retirar uma marca de ordem de bytes (BOM) ou uma quebra de linha final. Abre o próprio ficheiro para calcular o hash dos bytes exatos.

Preciso de SRI para ficheiros no meu próprio domínio?

O SRI protege contra alterações feitas depois de calculares o hash, por isso é mais importante para alojamentos de terceiros. Para os teus próprios ficheiros, um bundler que gera os hashes no momento da build costuma ser mais prático.

O SRI funciona com imagens ou tipos de letra?

O atributo integrity é suportado em <script> e <link rel="stylesheet"> (e em <link rel="preload"> ou modulepreload para estes recursos). As imagens e os tipos de letra não o podem usar.

Ferramentas relacionadas