Share your location with everyone in a session and see them all on one map, in real time. Try it on PubNub's website, or follow the tutorial.
The demo runs in the browser with the PubNub JavaScript SDK and these PubNub features:
- Messages: every position goes to the session channel in real time.
- Presence: the number of active users in the session.
- Message Persistence: the last known position of everyone in the session when you join.
- Functions (optional):
functions/location-facts.jsasks the OpenAI API for facts about your location and sends them back to you.
The map uses Leaflet with OpenStreetMap tiles, so it needs no API key. OpenStreetMap's tile servers aren't meant for heavy use (tile usage policy); in production, use a tile provider.
Tested with the PubNub JavaScript SDK 13.1.2 (October 2026).
-
Create a PubNub keyset in the Admin Portal (free account). Under Presence, choose All channels; Message Persistence is on by default. Or create it from your AI coding tool with the PubNub MCP Server.
-
Clone the repository and put your publish and subscribe keys into
js/app.jsin place ofYOUR_PUBLISH_KEYandYOUR_SUBSCRIBE_KEY:git clone https://github.com/PubNubDevelopers/Geolocation-Demo.git cd Geolocation-Demo -
Serve the folder on localhost, for example with
npx serve .orpython3 -m http.server 8000, and open it in your browser. Browsers only share your location with pages onhttps://orlocalhost. -
Allow location access. Use Copy invite link to open the same session in another browser or on your phone.
For the location facts, deploy functions/location-facts.js as an After Publish Function on the channel pattern facts-request.*, with your OpenAI API key in the Function secret OPENAI_API_KEY. The tutorial has the steps.
For more geolocation use cases and strategies, such as geofencing, our solution architect and support teams can help. Contact sales@pubnub.com