Utilia
Categories ▾
Idioma: ca ▾

Generador de hash SRI

Genera hashes sha384 de Subresource Integrity (SRI) per a un fitxer JavaScript o CSS i copia els atributs integrity i crossorigin ja preparats, en local.

Enganxa el contingut del fitxer o obre el fitxer mateix: aquesta eina no baixa adreces URL. Llegir un script d'un altre lloc requeriria que aquell servidor ho permetés (CORS) o un servidor nostre que el baixés per tu, i res del que calcules aquí no surt mai del teu navegador. Calcula el hash del fitxer exacte que publicaràs.

Calcula el hash de

El text es calcula com a UTF-8. Els navegadors converteixen els salts de línia de Windows (CRLF) en LF al text enganxat, i un sol byte canviat trenca el hash: en cas de dubte, obre el fitxer mateix.

Algorismes

L'URL només s'escriu al fragment, mai no se sol·licita. Deixa-la buida per fer servir el nom del fitxer.

Com generar un hash SRI

  1. A Calcula el hash de, tria Codi enganxat o Fitxers.
  2. Enganxa el contingut exacte de l’script o del full d’estils a Contingut de l’script o del full d’estils i prem Genera el hash SRI, o deixa anar un o diversos fitxers .js i .css a la zona de càrrega. Els hashes s’actualitzen mentre escrius.
  3. Deixa marcat SHA-384 (recomanat), o afegeix-hi SHA-256 i SHA-512. Cada algorisme marcat afegeix un element al valor.
  4. Tria l’Etiqueta (automàtica segons el nom del fitxer, <script>, <script type="module"> o <link rel="stylesheet">), escriu l’URL del recurs per al fragment (opcional) i tria el mode de crossorigin.
  5. Copia el valor integrity o l’etiqueta completa.
  6. Per comprovar una etiqueta que ja fas servir, enganxa el seu valor o l’etiqueta sencera a Comprova un valor integrity existent (opcional).

Què fa Subresource Integrity

Quan una pàgina carrega un script des d’una CDN, el navegador es fia de tot el que aquell servidor retorna. Si la CDN es veu compromesa o el fitxer es modifica, el codi alterat s’executa amb accés total a la teva pàgina. Subresource Integrity (SRI, del W3C) tanca aquest forat: publiques el hash esperat del fitxer a l’atribut integrity, el navegador calcula el hash del que baixa, i es nega a executar l’script o aplicar el full d’estils si els dos no coincideixen.

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

El valor és el nom de l’algorisme, un guió i el resum del fitxer codificat en Base64. Aquest exemple és el hash de alert('Hello, world.'); de l’especificació SRI. Quan hi ha diversos hashes a la llista, els navegadors només miren l’algorisme més fort que hi és present i accepten el fitxer si qualsevol hash d’aquest algorisme coincideix. Així és com un lloc pot llistar dues versions d’un fitxer durant una migració.

Per què cal crossorigin

Per a un fitxer d’un altre origen, el navegador només en pot comprovar la integritat si la resposta s’obté en mode CORS; per tant, l’etiqueta necessita un atribut crossorigin i el servidor ha de respondre amb una capçalera Access-Control-Allow-Origin. Fes servir anonymous (sense galetes) per a les CDN públiques; use-credentials és per a recursos privats poc habituals. Sense CORS, el navegador bloqueja el fitxer en lloc de carregar-lo sense comprovar.

Per què aquesta eina no baixa adreces URL

Aquesta eina només calcula hashes de codi que enganxes o de fitxers que obres. Baixar un script des de la seva URL dins de la pàgina només funcionaria si aquell servidor permet lectures d’origen creuat, i per evitar-ho caldria un servidor que baixés el fitxer per tu, que també veuria el que calcules. Tot el que es fa aquí s’executa al teu navegador. El mètode més senzill és baixar el fitxer exacte al qual faràs referència (la mateixa versió i la mateixa compilació minificada) i obrir-lo aquí.

Preguntes freqüents

Quin algorisme he d'utilitzar?

SHA-384 és l’opció habitual i el que publiquen la majoria de CDN. SHA-256 i SHA-512 també són compatibles amb tots els navegadors moderns. MD5 i SHA-1 no es permeten a SRI.

El meu hash és correcte però el navegador bloqueja el fitxer. Per què?

Comprova que el servidor envia Access-Control-Allow-Origin i que l’etiqueta té crossorigin. Assegura’t també que la CDN serveix els mateixos bytes: una versió diferent, un minificador automàtic o un salt de línia final que falta canvien el hash.

Per què el codi enganxat dona un hash diferent del del fitxer?

Els navegadors converteixen els salts de línia de Windows (CRLF) en LF als camps de text, i un editor pot afegir o treure una marca d’ordre de bytes o un salt de línia final. Obre el fitxer mateix per calcular el hash dels seus bytes exactes.

Necessito SRI per als fitxers del meu propi domini?

Protegeix dels canvis fets després d’haver calculat el hash, de manera que importa sobretot per als amfitrions de tercers. Per als teus propis fitxers, un empaquetador que generi els hashes durant la compilació sol ser més fàcil.

SRI funciona amb imatges o tipus de lletra?

L’atribut integrity és compatible amb <script> i <link rel="stylesheet"> (i amb <link rel="preload"> o modulepreload per a aquests recursos). Les imatges i els tipus de lletra no el poden utilitzar.

Eines relacionades