Background Location

Overview

This guide explains how to implement native background location tracking in your WeWeb mobile application using the Despia background location SDK. This feature allows your app to track location even when the application is closed or in the background.

Prerequisites

  • A WeWeb application (new or existing project)

  • Published WeWeb project

  • Despia editor with your project URL configured

  • Background Location add-on enabled in Despia

Setup Instructions

1

Enable Background Location in Despia

  1. Open your project in the Despia editor

  2. Navigate to Add-ons

  3. Find Background Location Tracking and enable it

  4. Build your application with the add-on enabled

Important: Only enable this feature if you actually need background location tracking. Unnecessary location permissions may cause issues with App Store or Google Play Store approval.

2

Create the Location Tracking Workflow

In your WeWeb application:

  1. Add a button or trigger element for starting location tracking

  2. Create a new workflow called "Track Location"

  3. Add two custom JavaScript actions:

Action 1: Initialize Despia SDK

Name: Despia SDK Background Location

window.despia = "backgroundlocationon://"

Action 2: Monitor Background Location

Name: Monitor Background Location + Events

const options = {
    enableHighAccuracy: true,  // Use GPS for better accuracy (uses more battery)
    timeout: 5000,             // How long to wait for a reading (milliseconds)
    maximumAge: 5000           // Accept cached positions up to this age (milliseconds)
};

const watchId = navigator.geolocation.watchPosition(
    (position) => {
        // Call your WeWeb workflow with location data
        wwLib.wwWorkflow.executeGlobal('YOUR_WEWEB_WORKFLOW_ID', {
            latitude: position.coords.latitude,
            longitude: position.coords.longitude,
            accuracy: position.coords.accuracy,
            altitude: position.coords.altitude,
            altitudeAccuracy: position.coords.altitudeAccuracy,
            heading: position.coords.heading,
            speed: position.coords.speed,
            timestamp: position.timestamp,
            watchId: watchId
        });
    },
    (error) => {
        console.error("Error:", error.message);
        // Optional error handling
    }, 
    options
);

3

Create the Catch Location Workflow

This workflow receives location updates:

  1. Create a new global workflow called "Catch Background Location"

  2. Add the following parameters (all type number):

    • latitude - Example: 33.66366814600508

    • longitude - Example: -117.82504144897301

    • accuracy - Example: 3.529386594010958

    • altitude - Example: 26.780719757080078

    • altitudeAccuracy - Example: 3

    • heading - Example: 243.5

    • speed - Example: 4.8

    • timestamp - Example: 1745861487040

    • watchId - Example: 513

4

Get the Workflow ID

  1. Open WeWeb's Dev Editor: More → Development → Open Dev Editor

Navigate to Logic → Catch Background Location

  1. Copy the workflow ID

  2. Replace YOUR_WEWEB_WORKFLOW_ID in the monitoring code with this ID

5

Store Location Data

Create a variable to store the location data:

  1. Create a new variable called location (type: object)

  2. Set initial value with all properties as null:

{
    "latitude": null,
    "longitude": null,
    "accuracy": null,
    "altitude": null,
    "altitudeAccuracy": null,
    "heading": null,
    "speed": null,
    "timestamp": null,
    "watchId": null
}
  1. In the "Catch Background Location" workflow, add an action to update this variable with the incoming parameters

6

Stop Location Tracking

Create a stop tracking workflow:

  1. Add a "Stop Location Tracking" button

  2. Create workflow with two custom JavaScript actions:

Action 1: Disable Despia Background Location

window.despia = "backgroundlocationoff://"

Action 2: Stop Watching Location

const watchId = // Get from WeWeb variable
navigator.geolocation.clearWatch(watchId);

  1. Add an action to reset the location variable to its initial null values

Important Notes

  • This hybrid approach works on both web and native applications

  • Background tracking only works in the native app with Despia runtime

  • Location updates trigger the catch workflow every time the device moves

  • Consider implementing debouncing for API calls to avoid server overload

  • To restart tracking, run the entire tracking workflow again

Use Cases

With this setup, you can:

  • Send real-time location updates to your backend

  • Update maps with current user position

  • Track delivery routes or employee movements

  • Create location-based features even when the app is closed

  • Implement geofencing or location-based notifications

Best Practices

  1. Always request location permissions appropriately

  2. Implement error handling for denied permissions

  3. Consider battery usage - high accuracy GPS drains battery faster

  4. Add debouncing for frequent location updates

  5. Clear location data when stopping tracking

  6. Test thoroughly on both iOS and Android devices

Need Help?

For additional support or questions, please contact our support team at support@despia.com

Updated on