Wednesday, 25 August 2021

Service workers - testing on mobile with ngrok

I'm incorporating service workers into my meteor app; everything works fine on desktop browsers so I'm trying to test it out on mobiles.

So the app is running on localhost and I'm running ngrok so I can access on my phone. When the code tries to install the service worker, I get the following error:

SecurityError: Failed to register a ServiceWorker: the origin of the provided scriptURL (localhost:3000) does not match the current origin (https://abc123.ngrok.io)

Is there any way around this so I can play with service workers on my phone during development?

(Here is my setup in case it makes a difference - it's pretty standard)

try {
        navigator.serviceWorker.register(Meteor.absoluteUrl('sw.js')).then((registration) => {
          return registration.pushManager.getSubscription()
          .then((subscription) => {
            if(subscription) {
              return subscription;
            }
            const reg = registration.pushManager.subscribe({
              userVisibleOnly: true,
              applicationServerKey: urlBase64ToUint8Array(publicKey)
            });
            return reg;
          })
          .then((subscription) => {
            savePushRegistration.call({ pushSubscription: JSON.stringify(subscription) });
          });
        })
        .catch((error) => {
          console.info('Can\'t load SW', error); //This is where the error appears
        });
      } catch (e) {
        // We're good here
        // Just an old browser
      }
    });


from Service workers - testing on mobile with ngrok

No comments:

Post a Comment