| title | Geolocation API |
|---|---|
| page-title | How to use the Geolocation API in Vaadin |
| description | Using the Geolocation API to access device location from the server. |
| meta-description | Learn how to access device geolocation in Vaadin applications using the server-side Geolocation API. |
| order | 115 |
The Geolocation API allows you to access the browser Geolocation API from server-side Java code. It provides two modes: one-shot position requests with callbacks, and continuous position tracking with reactive Signals.
|
Note
|
The browser prompts the user for permission to share their location. Geolocation requires a secure context (HTTPS), except on localhost during development.
|
Use the static Geolocation.get() method to request the device’s current position. The callback runs on the UI thread.
Geolocation.get(position -> {
double lat = position.coords().latitude();
double lon = position.coords().longitude();
Notification.show("Location: " + lat + ", " + lon);
});To handle errors, pass a second callback:
Geolocation.get(
position -> {
double lat = position.coords().latitude();
double lon = position.coords().longitude();
map.setCenter(lat, lon);
},
error -> Notification.show("Location error: " + error)
);You can configure the position request with GeolocationOptions:
- enableHighAccuracy
-
Requests GPS-level accuracy. Uses more power and may take longer. Default:
false. - timeout
-
Maximum time in milliseconds to wait for a position. Default: no limit.
- maximumAge
-
Maximum age in milliseconds of a cached position that’s acceptable to return. Default:
0(always request a fresh position).
var options = new GeolocationOptions(true, 5000, null);
Geolocation.get(options, position -> {
map.setCenter(position.coords().latitude(), position.coords().longitude());
});Pass null for any option to use the browser default.
Use Geolocation.track() to continuously monitor position changes. It returns a Geolocation instance with reactive Signals that update whenever the device’s position changes.
Geolocation geo = Geolocation.track(this);Read the position in a ComponentEffect to reactively update the UI:
Geolocation geo = Geolocation.track(this);
ComponentEffect.effect(this, () -> {
GeolocationPosition pos = geo.value().get();
if (pos != null) {
map.setCenter(pos.coords().latitude(), pos.coords().longitude());
}
});Tracking stops automatically when the owner component detaches. You can also pass GeolocationOptions to control accuracy and caching:
Geolocation geo = Geolocation.track(this, new GeolocationOptions(true, null, null));Error handling differs between the two modes.
With get(), the error callback receives a String message:
Geolocation.get(
position -> showOnMap(position),
error -> Notification.show("Error: " + error)
);With track(), errors are available as a Signal<GeolocationError> with a numeric code and a message. The error signal is cleared to null whenever a successful position update arrives.
Geolocation geo = Geolocation.track(this);
ComponentEffect.effect(this, () -> {
GeolocationError err = geo.error().get();
if (err != null) {
if (err.code() == GeolocationError.PERMISSION_DENIED) {
Notification.show("Please allow location access");
}
}
});The error codes are:
| Code | Description |
|---|---|
|
The user denied the location permission request. |
|
The device couldn’t determine its position. |
|
The request exceeded the configured timeout. |
A GeolocationPosition contains GeolocationCoordinates and a timestamp (milliseconds since Unix epoch).
The coordinates include:
| Field | Type | Description |
|---|---|---|
|
|
Latitude in decimal degrees. |
|
|
Longitude in decimal degrees. |
|
|
Accuracy of latitude and longitude in meters. |
|
|
Altitude in meters above the WGS84 ellipsoid, or |
|
|
Accuracy of the altitude in meters, or |
|
|
Direction of travel in degrees (0-360), or |
|
|
Speed in meters per second, or |
Fields that return Double (boxed) may be null when the device doesn’t provide that data.