Search code examples
flutterdartgeolocationflutter-web

Get user's location for Flutter Web


I'm currently using the Flutter Geolocator Plugin to access user's location (latitude/longitude), but it seems like it does not work for the web yet. I tried to find something to retrieve the user's location in Flutter for web, but I couldn't find it.

Has anyone already tried/found something to do the job?


Solution

  • To be able to retrieve the position for the web part I had to use https://pub.dev/packages/js to expose the JavaScript API and combine it with https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API.

    So here how it looks like :

    1. First create a file (ex: locationJs.dart) to expose the JS function :

       @JS('navigator.geolocation') // navigator.geolocation namespace
       library jslocation; // library name can be whatever you want
      
       import "package:js/js.dart";
      
      @JS('getCurrentPosition') // Accessing method getCurrentPosition 
      from       Geolocation API
      external void getCurrentPosition(Function success(GeolocationPosition pos));
      
      @JS()
      @anonymous
      class GeolocationCoordinates {
        external double get latitude;
        external double get longitude;
        external double get altitude;
        external double get accuracy;
        external double get altitudeAccuracy;
        external double get heading;
        external double get speed;
      
      external factory GeolocationCoordinates(
        {double latitude,
        double longitude,
        double altitude,
        double accuracy,
        double altitudeAccuracy,
        double heading,
        double speed});
        }
      
      @JS()
      @anonymous
      class GeolocationPosition {
      external GeolocationCoordinates get coords;
      
      external factory GeolocationPosition({GeolocationCoordinates 
      coords});
      }
      
    2. Call the newly created file

       import 'package:Shared/locationJs.dart';
      
        success(pos) {
           try {
             print(pos.coords.latitude);
             print(pos.coords.longitude);
             } catch (ex) {
              print("Exception thrown : " + ex.toString());
               }
           }
      
        _getCurrentLocation() {
            if (kIsWeb) {
              getCurrentPosition(allowInterop((pos) => success(pos)));
                      }
            }