1. Apa itu noreferrer
?
noreferrer
adalah nilai atribut rel
yang bisa digunakan pada elemen
<a>
, <area>
, atau <form>
.
Tujuannya adalah supaya ketika pengguna mengklik link, browser tidak mengirimkan HTTP Referer
(yakni URL asal halaman) ke server tujuan.
Jadi, kalau link dari example.com/page.html menuju other.com, server other.com tidak tahu bahwa pengunjung datang dari example.com.
2. Fungsi Utama
- Menyembunyikan referer → privasi lebih terjaga.
- Efek tambahan → di banyak browser modern,
noreferrer
juga otomatis menonaktifkan akseswindow.opener
(efek miripnoopener
).
3. Perbedaan dengan noopener
noopener
→ mencegah halaman baru mengakseswindow.opener
untuk alasan keamanan (misalnya mencegah serangan phishing yang mengganti halaman asal).noreferrer
→ menyembunyikan referer + efek keamanan sepertinoopener
pada mayoritas browser.
4. Dampak Jika noreferrer
Tanpa target="_blank"
Jika sebuah link menggunakan rel="noreferrer"
tanpa target="_blank"
, maka:
- Referer tetap disembunyikan → server tujuan tidak tahu dari mana visitor datang.
- Tidak ada efek
window.opener
→ karena halaman dibuka di tab yang sama, tidak ada relasi opener.
Kesimpulannya: noreferrer
masih berguna untuk privasi meski tanpa target="_blank"
,
tapi perlindungan dari serangan opener memang tidak relevan di situ.
5. Tabel Perbandingan
Atribut | Menyembunyikan Referer | Putus window.opener |
Tujuan Utama |
---|---|---|---|
noopener |
❌ Tidak | ✅ Ya | Keamanan |
noreferrer |
✅ Ya | ✅ Ya (di mayoritas browser) | Privasi + Keamanan |
6. Tabel Keputusan Cepat
Kondisi Link | Atribut yang Disarankan |
---|---|
Link internal (domain sama) | Tidak perlu / noopener |
Eksternal aman (Google, GitHub, Wikipedia) | noopener |
Eksternal tidak tepercaya | noopener noreferrer |
Privasi penting (situs sensitif, kompetitor) | noreferrer |
Kalau ragu | noopener noreferrer (best practice) |
7. Flowchart Tekstual
Apakah link ke domain sendiri? └─ Ya → Tidak perlu rel khusus └─ Tidak → Apakah pakai target="_blank"? └─ Ya → Minimal pakai noopener └─ Tidak → noreferrer opsional (jika butuh privasi) Apakah butuh privasi? └─ Ya → pakai noreferrer (atau noopener noreferrer) └─ Tidak → cukup noopener