This content originally appeared on DEV Community and was authored by Nandan Ramdani
Pernah kepikiran gimana cara mengenali apakah seseorang membuka website kamu dari perangkat yang sama atau berbeda tanpa harus login dulu?
Nah, di dunia web, hal ini bisa dilakukan dengan browser fingerprinting.
Apa Itu Browser Fingerprint?
Setiap browser dan perangkat punya kombinasi karakteristik yang unik, misalnya:
- Jenis browser (Chrome, Firefox, Edge, dll)
- Sistem operasi
- Resolusi layar
- Bahasa dan zona waktu
- Font dan plugin yang terpasang
- Renderer GPU (melalui WebGL)
Kombinasi semua informasi itu bisa dijadikan “sidik jari digital” (browser fingerprint).
Tujuannya sederhana: membedakan satu perangkat dari perangkat lain — tanpa bergantung pada cookie atau localStorage.
Menggunakan FingerprintJS
Salah satu library paling populer untuk melakukan ini adalah FingerprintJS.
Library ini mudah digunakan dan hasilnya cukup stabil, bahkan setelah pengguna menghapus cache atau cookie.
Berikut contoh implementasi paling sederhana untuk menampilkan visitorId (fingerprint unik) di halaman web kamu:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Demo FingerprintJS</title>
</head>
<body>
<h1>Demo FingerprintJS</h1>
<p>Fingerprint unik browser kamu:</p>
<p id="p" style="font-family: monospace; color: blue;"></p>
<script type="module">
const fingerprint = await import('https://openfpcdn.io/fingerprintjs/v4')
const fp = await fingerprint.load()
const result = await fp.get()
console.log(result.visitorId) // fingerprint unik di console
document.getElementById('p').innerText = result.visitorId
</script>
</body>
</html>
Jika kamu buka halaman ini di dua browser berbeda (misalnya Chrome dan Firefox), kamu akan melihat visitorId yang berbeda.
Tapi jika kamu buka berulang kali di browser yang sama, biasanya visitorId-nya tetap — itulah kekuatan fingerprinting.
Kapan FingerprintJS Berguna?
Fingerprint seperti ini bisa berguna untuk berbagai keperluan, misalnya:
- Deteksi multi-login (misal satu akun dipakai di banyak device)
- Validasi keamanan pada sistem presensi online atau e-voting
- Mendeteksi bot / spammer yang berpura-pura jadi user baru
- Menandai perangkat terpercaya tanpa harus simpan cookie
Kelebihan dan Keterbatasan
| Kelebihan | Keterbatasan |
|---|---|
| Tidak perlu cookie / localStorage | Tidak 100% akurat |
| Cukup konsisten antar sesi | Bisa berubah kalau update browser besar |
| Mudah diimplementasikan | Ada pertimbangan privasi (tracking) |
Kesimpulan
FingerprintJS memberikan cara cepat dan sederhana untuk mengenali browser atau perangkat pengguna lewat kombinasi atribut teknisnya.
Nilai result.visitorId bisa kamu perlakukan sebagai ID unik perangkat, dan bisa dikombinasikan dengan sistem login atau token lokal untuk keamanan tambahan.
Dengan sedikit kreativitas, kamu bisa manfaatkan teknik ini untuk:
- mendeteksi login mencurigakan,
- memperkuat sistem absensi berbasis web,
- atau bahkan membangun sistem “trusted device” tanpa instal aplikasi.
This content originally appeared on DEV Community and was authored by Nandan Ramdani
Nandan Ramdani | Sciencx (2025-10-18T15:00:57+00:00) Cara Mendeteksi Device Unik Pengguna di Browser dengan FingerprintJS. Retrieved from https://www.scien.cx/2025/10/18/cara-mendeteksi-device-unik-pengguna-di-browser-dengan-fingerprintjs/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.