L'attributo rel noopener e noreferrer in HTML5. La sicurezza al primo posto.
L'attributo "rel" viene utilizzato nei i tags <a>, e <link>, e serve a descrivere il tipo di relazione presente tra la risorsa attuale (la pagina in cui l'utente si trova) e quella linkata.
"rel=noopener" viene utilizzato nei tag <a> per motivi di sicurezza, assieme a noreferrer.
<a href='http://www.ilsito.it' rel='noopener noreferrer' target='_blank'>Sito XYZ</a>I link <a> che prevedono l'apertura del link in una nuova finestra, o in un nuovo tab, attraverso l'utilizzo del targer "_blank", espongono gli utenti ad un rischio di sicurezza: stiamo parlando del phishing.
Il phishing uno stratagemma per indurre gli utenti a rivelare, con l'inganno, informazioni personali o finanziarie, ad esempio attraverso l'uso una pagina che in apparenza sembra in tutto e per tutta una pagina del sito che stiamo pensando di navigare... mentre invece è una pagina creata ad arte da un hacker per catturare dati sensibili (per esempio la carta di credito).
Perchè siamo a rischio phishing? Perchè la pagina aperta utilizzando il "target_blank", ha una relazione con la pagina di provenienza (la pagina dove è inserito il link), e questa relazione può essere sfruttata tramite l'utilizzo javascript per avere parziale accesso a quest’ultima. Ad un programmatore di sito web, che lavora in javascript, capita spesso, di dover inserire link a una nuova finestra e poi da questa nuova finestra richiamare una funzione presente nella finestra che l'ha generata: questo in javascript è possibile utilizzando un "window.opener".
Questa possibilità potrebbe essere utilzzata anche da un hacker utilizzando una tecnica di "Reverse Tabnabbing".
Nella pagina aperta potrebbe inserire uno script come questo: lo script dice di sostituire alla pagina che conteneva il link la pagina di google!
<script>window.opener.location = 'https://www.nuovosito.it';</script>Un hacker potrebbe utilizzare questa nota vulnerabilità del "target_blank" per sostituire la tua pagina con una sua pagina identica alla tua: l'utente non se ne accorgebbe e potrebbe inserire in questa pagina suoi dati sensibili: il pishing è avvenuto!
Utilizziamo quindi noopener quando vogliamo impedire alla pagina aperta di utilizzare via javascript il "window.opener".
In abbinamento ad "noopener", sempre per ragioni di sicurezza, e per ragioni di privacy di navigazione, si utilizza "noreferrer"
"noreferrer" Impedisce il passaggio alla nuova pagina dei "referral data", cioè di informazioni relative al sito di origine, come la url di provenienza, eventuali termini di ricerca utilizzati per arrivare in questa pagina, ora e data....
In questo modo molti tool di analisi dati dei siti web, utilizzati dai webmaster, non possono tracciare in maniera completa il traffico dei siti stessi.
Potrebbe interessarti
- Il nuovo significato dell'attributo rel = nofollow. Cosa cambia per Google dal primo marzo 2020.
- I nuovi attributi rel=ugc e rel=sponsored: a cosa servono e come usarli
- I principali fattori di posizionamento per il 2018
- L'attributo rel author in HTML5. Indicizziamo l'autore di un articolo.
- L'attributo rel canonical in HTML5. Contenuti duplicati e pagine originali da indicizzare.
- L'attributo rel nofollow in HTML5. Introduzione al link builing
- L'attributo rel alternate hreflang in HTML5. Come utilizzarlo correttamente nei siti multilingua e gli errori da non commettere.
