Suppose that the user is on a supported browser, you can get your PWA to detect the user’s location pretty easily by using the Geolocation API, or to be more specific, by using the navigator.geolocation object within it. Here’s how you do it right in your PWA:
Contents
- Prerequisites
- Geolocation in action
- How to integrate geolocation into your PWA
- The basics
- Using getCurrentPosition() to get the user’s position
- watchPosition() — periodical retrieving of the user’s position
- Error handling
- Beyond the basics
- A timeout when looking up coordinates
- Displaying user position on Google Maps
- Alternatively, use react-geolocated for your React-based PWA
- Conclusion
Prerequisites
- Solid JavaScript & HTML knowledge
- A working** PWA** served over HTTPS (in case you don’t yet have a PWA for practicing purposes, we’ve written a guide which should walk you through the whole process of creating your first PWA).
Geolocation in action
You’re probably no stranger to geolocation by now. With your permission, a website that has geolocation integrated can access your location, using which it can display relevant information in your area, or simply show your location on the map.
#progressive web apps #progressive web app
3.05 GEEK