Continuous Emergency Web Tracking

I have a working browser-based application that lets a user share their real-time location in an emergency. Everything functions perfectly while the tab is in the foreground, but the moment the browser is minimised or the phone screen locks, the geolocation updates stop. I want that gap closed.

Scope of the fix
• Target environments: Android phones using Chrome and iPhones using Safari – no native app, no desktop focus.
• Trigger: tracking begins only when the user presses the emergency button on the website.
• Duration: location updates must continue in the background until the user explicitly turns them off.

What I expect from you
I need the front-end and any supporting back-end tweaks that will keep the HTML5 Geolocation (or an alternative approach you propose) alive when the tab is backgrounded. Service Workers, Web App Manifest, PWA-style installation prompts, WebSockets, background fetch – I’m open to whatever combination is reliable, compliant with each browser’s policies, and does not require users to install a separate mobile app.

Acceptance criteria
• Live position is transmitted at the current 5-second interval even when the browser is minimised or the phone is locked.
• Works on the latest stable Chrome for Android and Safari for iOS (including iOS 17).
• The user sees a clear on-screen indicator that tracking is active and a single tap to stop it.
• Code is clean, documented, and delivered through Git with setup notes so I can reproduce the behaviour on my staging server.

If you’ve previously worked around mobile browser suspension limits or built progressive web apps with persistent geolocation, I’d love to see an example.