I link che rimandano a destinazioni multiorigine non sono sicuri

Quando colleghi una pagina su un altro sito utilizzando l'attributo target="_blank", puoi esporre il tuo sito a problemi di prestazioni e sicurezza:

  • L'altra pagina potrebbe essere eseguita nello stesso modo della tua. Se sull'altra pagina è in esecuzione molto JavaScript, il rendimento della pagina potrebbe risentirne.
  • L'altra pagina può accedere all'oggetto window con la proprietà window.opener. Ciò potrebbe consentire all'altra pagina di reindirizzare la tua pagina a un URL dannoso.

Aggiunta di rel="noopener" o rel="noreferrer" ai link target="_blank" evita questi problemi.

Come funziona il controllo della destinazione multiorigine di Lighthouse

Lighthouse segnala i link non sicuri verso destinazioni multiorigine:

Controllo Lighthouse che mostra link non sicuri a destinazioni multiorigine

Lighthouse utilizza il seguente processo per identificare i link come non sicuri:

  1. Raccogli tutti i tag <a> contenenti l'attributo target="_blank" ma non gli attributi rel="noopener" o rel="noreferrer".
  2. Escludi eventuali link dello stesso host.

Poiché Lighthouse filtra i link dello stesso host, c'è un caso limite di cui dovresti essere a conoscenza se stai lavorando su un sito di grandi dimensioni: se una pagina contiene un link target="_blank" a un'altra pagina del tuo sito senza utilizzare rel="noopener", le implicazioni sulle prestazioni di questo controllo continuano a essere applicate. Tuttavia, non vedrai questi link nei risultati di Lighthouse.

Come migliorare le prestazioni del tuo sito ed evitare vulnerabilità di sicurezza

Aggiungi rel="noopener" o rel="noreferrer" a ogni link identificato nel report Lighthouse. In generale, quando usi target="_blank", usa sempre aggiungi rel="noopener" o rel="noreferrer":

<a href="https://examplepetstore.com" target="_blank" rel="noopener">
  Example Pet Store
</a>
  • rel="noopener" impedisce che la nuova pagina possa per accedere alla proprietà window.opener e ne garantisce l'esecuzione in un processo separato.
  • rel="noreferrer" ha lo stesso effetto ma impedisce anche l'intestazione Referer vengano inviati alla nuova pagina. Vedi Tipo di link "noreferrer".

Consulta Condividere le risorse multiorigine in modo sicuro per ulteriori informazioni.

Risorse