Pushpad
Articles › Integrations, Web Push Notifications

Web push notifications without a service worker in the root

  • # push-api
  • # service-worker

Let's see some workarounds to add web push notifications to a website if you cannot add a service worker to the root folder.

For web push it is usually recommended to use a service worker placed in the root of the website. For example:

example.com/service-worker.js

However some CMS and website builders have particular limitations and you can only place the scripts in a specific subfolder. For example:

example.com/assets/js/service-worker.js

The problem in this case is that the service worker scope is example.com/assets/js/, meaning that the script is activated only when the user visits a subfolder.

For example the user would need to visit a page example.com/assets/js/subscribe.html in order to subscribe to notifications, but this doesn't make sense.

So you probably need to find a better solution.

Change the service worker scope using the HTTP headers

Try to answer to these questions:

  1. Can you find a way to serve the service-worker.js file from a subdirectory on the main domain?

  2. Can you set some custom HTTP headers when you serve that file?

If the answer is "Yes" to both questions, that you can definitely add web push to your website.

Basically you will place the service-worker.js in a subfolder, but then you change the scope of the service worker.

You can also see a practical example using Wix (and take inspiration from there).

Use a subdomain

This is not an actual solution, but a workaround. If you cannot add a service worker to the main domain, you can probably do that on a subdomain (i.e. change the DNS and use a different service provider for the subdomain).

Basically you can create a subdomain like push.example.com or notifications.example.com and use that subdomain to host two static files:

  • the service worker file (e.g. push.example.com/service-worker.js)

  • a web page where the user can subscribe to notifications.

Finally, on the main domain, you simply add a link to the subdomain, where the user can enable the notifications.