DISKON Hosting dan VPS Black Friday, Klik Disini!

Pengertian Noopener and Noreferrer

Noopener dan Noreferrer adalah atribut yang digunakan di HTML untuk mengontrol tab terbuka dari tautan yang dibuka di browser. Mereka berfokus pada keamanan dan privasi pengguna.

Noopener

Noopener adalah sebuah atribut yang digunakan dalam elemen tautan HTML untuk mencegah tab baru yang dibuka dari mengakses konten asli dari tab yang mengarahkan tautan tersebut. Ini mencegah serangan yang dikenal sebagai “tab nabbing”, di mana tautan yang dibuka di tab baru dapat memanipulasi atau mencuri informasi dari tab yang mengarahkan.

Noreferrer

Noreferrer adalah atribut yang digunakan dalam elemen tautan HTML untuk mencegah browser untuk mengirim header HTTP “Referer” ke halaman yang ditautkan. Referer adalah informasi yang mengidentifikasi halaman sumber dari tautan. Dalam konteks keamanan dan privasi, menggunakan atribut noreferrer membantu mencegah halaman yang ditautkan untuk melacak informasi tentang halaman sumber.

Keamanan Pengguna

Noopener dan noreferrer bertujuan untuk melindungi pengguna dari serangan atau pelacakan yang tidak diinginkan. Dengan menggunakan atribut ini, pengguna dapat merasa lebih aman saat membuka tautan baru atau berpindah ke halaman yang ditautkan.

Perlindungan terhadap Tab Nabbing

Noopener mencegah tab yang baru dibuka untuk mengakses atau memanipulasi konten dari tab yang mengarahkan. Hal ini berguna untuk melindungi pengguna dari serangan yang mencoba mencuri informasi atau mengarahkan mereka ke halaman phishing.

Mencegah Pelacakan

Noreferrer membantu mencegah pelacakan dengan mencegah browser mengirim header HTTP “Referer” ke halaman yang ditautkan. Dengan tidak mengirim informasi ini, halaman yang ditautkan tidak dapat melacak halaman sumber atau informasi lain yang mungkin sensitif.

Penggunaan Noopener dan Noreferrer

Noopener Noreferrer
Menggunakan atribut “noopener” di elemen tautan: Menggunakan atribut “noreferrer” di elemen tautan:
<a href="https://example.com" target="_blank" rel="noopener">Tautan ke Example</a> <a href="https://example.com" target="_blank" rel="noreferrer">Tautan ke Example</a>

Contoh Serangan Tab Nabbing

Sebagai contoh, jika seseorang membuka tautan dengan target “_blank” yang tidak menggunakan atribut noopener, halaman yang ditautkan dapat menggunakan JavaScript untuk mengganti konten dari halaman sumber, yang dapat digunakan untuk mencuri informasi seperti kata sandi atau data pribadi.

Penggunaan Atribut Noopener dan Noreferrer secara Bersamaan

Untuk meningkatkan keamanan dan privasi pengguna, kedua atribut dapat digunakan bersama-sama di elemen tautan:

  • <a href="https://example.com" target="_blank" rel="noopener noreferrer">Tautan ke Example</a>

Kompatibilitas

Atribut noopener dan noreferrer didukung oleh mayoritas browser modern seperti Chrome, Firefox, dan Safari. Namun, perlu diingat bahwa atribut tersebut mungkin tidak didukung oleh browser yang lebih lama, sehingga penting untuk memastikan kompatibilitas dengan target pengguna yang diinginkan.