Menghubungkan Peta ke Cloud: Sinkronisasi Lokasi Real-Time dan Autentikasi Firebase di Flutter
Halo Developer! Pada pembahasan sebelumnya, kita sudah berhasil menampilkan Google Maps dan menjinakkan sistem perizinan GPS di perangkat…
Menghubungkan Peta ke Cloud: Sinkronisasi Lokasi Real-Time dan Autentikasi Firebase di Flutter

Halo Developer! Pada pembahasan sebelumnya, kita sudah berhasil menampilkan Google Maps dan menjinakkan sistem perizinan GPS di perangkat lokal HP. Namun, aplikasi peta sosial seperti CircleSync baru akan terasa hidup jika koordinat kita bisa dikirim ke awan (cloud) dan dilihat oleh pengguna lain secara real-time.
Di artikel ini, kita bakal naik kelas dengan membangun infrastruktur backend-nya menggunakan Firebase. Kita akan membedah bagaimana mengamankan gerbang masuk pengguna menggunakan Firebase Auth dan menyalakan pipa pengiriman koordinat otomatis ke Cloud Firestore menggunakan sistem Stream.
Mari kita rakit komponen-komponen awan ini!
1. Gerbang Masuk: Autentikasi Bersih Lewat Provider
Sebelum melacak lokasi seseorang, aplikasi harus tahu dulu siapa yang sedang bergerak. Di sinilah peran AuthProvider. Melalui arsitektur yang sudah kita pisah dari data source, kita mengisolasi fungsi pendaftaran akun (register) dan masuk aplikasi (login).
Tantangan terbesar saat membuat halaman login dan register adalah memberikan umpan balik visual kepada pengguna saat jaringan sedang sibuk. Kita mengatasinya dengan memanfaatkan status reaktif _isLoading:
// Cuplikan reaktif di dalam AuthProvider
Future<User?> login(String email, String password) async {
_isLoading = true;
notifyListeners(); // UI langsung tahu dan mengubah tombol jadi loading spinner
try {
final user = await authRepository.login(email, password);
_isLoading = false;
notifyListeners();
return user;
} catch (e) {
_isLoading = false;
notifyListeners();
rethrow; // Lempar error ke UI untuk ditampilkan lewat SnackBar
}
}
Ketika fungsi ini dipicu di halaman LoginScreen atau RegisterScreen, tombol secara otomatis mengunci diri agar pengguna tidak menekan tombol masuk berkali-kali secara tidak sengaja saat koneksi internet sedang lambat.
2. Pipa Otomatis: Mengalirkan Koordinat Lewat Live Tracking Stream
Ini dia bagian paling krusial dari CircleSync: fungsi startLiveTracking() yang berada di dalam LocationProvider. Kita tidak ingin pengguna repot mengklik tombol "Perbarui Lokasi" setiap kali melangkah. Kita ingin sistem berjalan otomatis di latar belakang.
Untuk mewujudkannya, kita menggunakan Geolocator.getPositionStream. Fungsi ini bertindak seperti pipa air yang terus mengalirkan data koordinat baru setiap kali pengguna berpindah tempat sejauh minimal 5 meter.
// Mengaktifkan aliran koordinat real-time ke Firestore
_positionSubscription = Geolocator.getPositionStream(
locationSettings: const LocationSettings(
accuracy: LocationAccuracy.high,
distanceFilter: 5, // Mengirim data hanya jika bergerak sejauh 5 meter
),
).listen((Position position) async {
_currentPosition = position;
notifyListeners(); // Geser marker di peta lokal
final String? userEmail = _auth.currentUser?.email;
if (userEmail != null) {
// Tembak data langsung ke dokumen Cloud Firestore
await locationRepository.updateUserLocation(userEmail, position.latitude, position.longitude);
}
});
Setiap kali satelit GPS mendeteksi pergeseran posisi, koordinat latitude dan longitude terbaru langsung dikirim dan memperbarui dokumen pengguna di Firestore secara instan.
3. Struktur Data di Awan: Firestore SetOptions Merge
Di sisi database NoSQL Cloud Firestore, kita membuat skema penyimpanan yang sangat efisien di dalam LocationRemoteDataSourceImpl. Alih-alih membuat dokumen baru setiap detik yang bisa membuat tagihan Firebase membengkak, kita menggunakan trik SetOptions(merge: true).
await firestore.collection('users').doc(userId).set({
'latitude': latitude,
'longitude': longitude,
'lastUpdated': FieldValue.serverTimestamp(), // Timestamp server yang akurat
}, SetOptions(merge: true));
Dengan menggunakan merge: true, Firebase hanya akan memperbarui baris data lokasi dan waktu modifikasi terakhir tanpa menghapus data profil pengguna lainnya yang sudah ada (seperti nama atau foto). Penggunaan FieldValue.serverTimestamp() juga memastikan pencatatan waktu tetap akurat mengikuti jam server pusat, bukan jam di HP pengguna yang bisa dimanipulasi.
Kesimpulan
Sistem awan untuk CircleSync kita sekarang sudah terhubung penuh! Alurnya berjalan sangat mulus: pengguna masuk melalui pintu Firebase Auth, dan begitu mereka masuk ke dashboard utama, pipa Stream subscription langsung aktif berburu koordinat dan menyinkronkannya ke Cloud Firestore setiap beberapa meter mereka melangkah.
Arsitektur aplikasi kita pun tetap terjaga bersih karena semua instansiasi Firebase Auth dan Firestore ini telah dirangkai rapi di balik layar menggunakan pelayan Dependency Injection GetIt.
Happy coding, and see your markers move across the cloud! 🚀
메타데이터
- post_id
- bb8c08e71bb4
- slug
- menghubungkan-peta-ke-cloud-sinkronisasi-lokasi-real-time-dan-autentikasi-firebase-di-flutter-bb8c08e71bb4
- url
- https://medium.com/@rifaldiricky27/menghubungkan-peta-ke-cloud-sinkronisasi-lokasi-real-time-dan-autentikasi-firebase-di-flutter-bb8c08e71bb4
- canonical_url
- https://medium.com/@rifaldiricky27/menghubungkan-peta-ke-cloud-sinkronisasi-lokasi-real-time-dan-autentikasi-firebase-di-flutter-bb8c08e71bb4
- author_url
- https://medium.com/@rifaldiricky27
- status
- ok
- fetched_at
- 2026-08-07 03:23:15