Track GPS location with PWA?

Hi @EosFleet.com and welcome to the community!

Here’s some custom code that will get the user’s current geolocation and display it in a JavaScript alert popup, assuming they answer “yes” to the permission prompt. I tested it on Mac/Chrome and iOS/Safari. The code is shamelessly cribbed from this answer on Stack Overflow.

<script>
if ( navigator.permissions && navigator.permissions.query) {
  //try permissions APIs first
  navigator.permissions.query({ name: 'geolocation' }).then(function(result) {
      // Will return ['granted', 'prompt', 'denied']
      const permission = result.state;
      if ( permission === 'granted' || permission === 'prompt' ) {
          _onGetCurrentLocation();
      }
  });
} else if (navigator.geolocation) {
  //then Navigation APIs
  _onGetCurrentLocation();
}

function _onGetCurrentLocation () {
    const options = {
            enableHighAccuracy: true,
            timeout: 5000,
            maximumAge: 0
    };
    navigator.geolocation.getCurrentPosition( function (position) {
        //use coordinates
        const marker = { 
          lat: position.coords.latitude, 
          lng: position.coords.longitude 
        };
        alert(`Lat: ${marker.lat} lng: ${marker.lng}`);
    }, function (error) {
      //error handler here
    }, options)
}
</script>

Just out of curiosity, when you were imagining this feature being natively supported in Softr, how were you picturing it would work?

2 Likes