Google Maps Flutter Cross-Platform (Web, Android, iOS)

Dans ce tutoriel, je vais vous guider point par point pour activer et connecter Google Maps avec votre application cross-plateforme. Nous aborderons l'activation des API sur votre Google Cloud Console, la sécurisation de vos clés API pour éviter toute usurpation, et en bonus la recherche d'adresse avec l'API Geolocator pour la géolocalisation.

✅ Activer les API sur Google Cloud Console
✅ Sécuriser vos clés API pour éviter toute usurpation
✅ Ajouter Google Maps à votres projet Fluttes
✅ Utiliser l'API Geolocator pour la géolocalisation d'adresses

GitHub :

J'ai inclus une version de démonstration pour vous aider à visualiser le résultat attendu.

00:00 Créer votre application
00:30 Activer les API Google Maps
02:00 Sécuriser les clés API
09:30 Ajouter les packages
13:40 Configurer les permissions
14:20 Code
18:00 Les markers
20:20 Bonus Geolocator
26:10 Conclusion

Source video;

# Étape 1 : Créer votre application sur la Google Cloud Console


# Étape 2 : Activer les API Google Maps pour chaque plateforme

Maps JavaScript API
Maps SDK for Android
Maps SDK for iOS
Geocoding API

# Étape 3 : Sécuriser les clés API
Il est primordial de protéger vos clés API en limitant leur utilisation pour éviter toute usurpation. Renommez-les pour les distinguer facilement :

+ Web : Limitez à votre domaine.

+ Android : Limitez au certificat de la clé de signature d'application SHA1.
Vous le trouverez sur votre Google Play Console.

F6:A8:7C:95:9F:B0:37:79:A4:F0:7F:9B:86:9A:66:3B:7A:B4:69:D9

+ iOS : Restreignez la clé aux identifiants de l'application (Bundle Identifier).

+ localhost : Mettez à jour le port à chaque lancement de votre console de développement.

+ GEOCODING : IP de votre serveur.

google_maps_flutter: ^2.9.0
google_maps_flutter_web: ^0.5.10
geolocator: ^13.0.1

# Étape 5 : Configurer les permissions

-----------------------------------

AyliDev:

AYLICRÉA