W3C Geolocation API menstandarkan cara peramban web mengakses perangkat keras lokasi di ponsel, tablet, dan komputer desktop.
Tersedia melalui objek global JavaScript navigator.geolocation, antarmuka ini memungkinkan aplikasi web—termasuk GPS Coordinates Finder dan alat Where Am I kami—meminta koordinat geografis secara aman dengan persetujuan pengguna. Panduan ini menyajikan gambaran teknis lengkap bagi pengembang web maupun pengguna umum.
Periksa Data Geolocation Peramban Anda
Jalankan panggilan navigator.geolocation secara langsung untuk melihat objek koordinat, kecepatan, arah, elevasi, dan stempel waktu GeolocationPosition secara lengkap.
1. Arsitektur Inti & Metode API
Spesifikasi Geolocation W3C menyediakan tiga metode utama:
navigator.geolocation.getCurrentPosition(success, error, options)
Meminta sekali ambil posisi geografis pengguna saat ini. Mengembalikan objek GeolocationPosition jika berhasil atau GeolocationPositionError jika gagal.
navigator.geolocation.watchPosition(success, error, options)
Mendaftarkan fungsi handler yang otomatis dipanggil setiap kali lokasi perangkat berubah. Mengembalikan watchId berupa bilangan bulat untuk melacak pergerakan dan kecepatan secara waktu nyata.
navigator.geolocation.clearWatch(watchId)
Membatalkan pemantauan posisi aktif yang didaftarkan dengan watchPosition(), sehingga menghemat baterai dan menghentikan polling sensor.
2. Implementasi JavaScript Siap Produksi
Berikut cuplikan kode yang tangguh dan siap produksi dengan penanganan timeout, logika fallback, dan pengaturan akurasi yang ketat:
// Check browser support
if ('geolocation' in navigator) {
const options = {
enableHighAccuracy: true, // Request GPS hardware rather than IP lookup
timeout: 10000, // Maximum wait time of 10 seconds
maximumAge: 0 // Do not return cached coordinates
};
function successCallback(position) {
const { latitude, longitude, accuracy, altitude, heading, speed } = position.coords;
console.log(`Latitude: ${latitude}, Longitude: ${longitude}`);
console.log(`Accuracy radius: ${accuracy} meters`);
}
function errorCallback(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
console.error("User denied Geolocation permission.");
break;
case error.POSITION_UNAVAILABLE:
console.error("Location information is unavailable (weak GPS/Wi-Fi signal).");
break;
case error.TIMEOUT:
console.error("The request to get user location timed out.");
break;
}
}
navigator.geolocation.getCurrentPosition(successCallback, errorCallback, options);
} else {
console.warn("Geolocation API is not supported in this browser.");
}3. Opsi Konfigurasi Utama: PositionOptions
| Properti Opsi | Tipe | Bawaan | Perilaku & Dampak Teknis |
|---|---|---|---|
enableHighAccuracy | Boolean | false | Jika true, browser diperintahkan menyalakan chip penerima GPS/GNSS internal sehingga akurasi di bawah 3–5 meter. Jika false, digunakan triangulasi Wi-Fi/seluler hemat daya atau pencarian IP. |
timeout | Positive integer (ms) | Infinity | Waktu maksimum (dalam milidetik) yang boleh dipakai browser sebelum mengembalikan kode error TIMEOUT. Direkomendasikan: 8.000 sampai 12.000 ms. |
maximumAge | Positive integer (ms) | 0 | Usia maksimum posisi cache yang masih dapat diterima. Nilai 0 memaksa perangkat mengambil fix satelit/Wi-Fi yang baru. |
4. Persyaratan Keamanan & Kebijakan Izin
- Secure Context (HTTPS Wajib): Sejak Chrome 50 dan iOS 10, Geolocation API sepenuhnya dinonaktifkan pada koneksi HTTP yang tidak aman. Aplikasi web harus disajikan lewat HTTPS yang valid.
- Perlu Gestur Pengguna: Memanggil geolocation lewat klik tombol (mis. 'Get My Location') memberi tingkat persetujuan pengguna lebih baik dibanding memunculkan prompt tanpa diminta saat halaman dimuat.
- Permissions-Policy Iframe: Jika menyematkan alat geolocation di dalam <iframe>, Anda wajib mendeklarasikan atribut allow='geolocation' pada tag iframe.
Konversi Derajat Desimal dari Geolocation API
Ubah keluaran desimal navigator.geolocation menjadi Derajat, Menit, Detik (DMS) atau Universal Transverse Mercator (UTM) dengan mudah.