Service Worker Scope Issue with Backend Admin Access in Vite PWA Plugin

[mustermannalex]

I’m working on a project where I have a backend with an admin area that is accessible under a specific URL path, let’s call it the Backend-Prefix. I also have a frontend built with Vite that includes a Service Worker generated by the Vite PWA Plugin.

Here’s the issue:
When the Service Worker is active, I cannot access the backend’s admin area. The Service Worker seems to block the request to the admin URL, possibly because it doesn’t recognize it, and therefore does not proxy the request correctly to the backend. As a result, I only see a blank page.
What I’ve Tried:

If I manually modify the Service Worker’s scope in the registration script, setting it to cover only the App-Prefix (i.e., /app/), it works fine. The Service Worker no longer interferes with the backend admin, and I can access the admin panel as expected.

However, my problem is that the Vite PWA Plugin automatically regenerates the Service Worker when building the project, and I want to avoid manually modifying the scope every time I build the project. I need a more automated or persistent way to configure the Service Worker to handle the scope correctly without manual intervention after each build.
My Current Setup:

Frontend: Vite with Vite PWA Plugin
Backend: Django (with an admin area under /api/admin/)
The frontend and backend are served under different prefixes (App-Prefix and Backend-Prefix).

Any ideas or best practices on how to configure the Service Worker for this setup would be much appreciated!

[userquin]

Try adding scope: '/app/' to the pwa options. If I understand you correctly, you've 2 apps served under /app/ and /admin-app/ (or root /) contexts.