Hook in register-service-worker update and display Notification in App



  • I hook in register-service-worker.js and want to display a Notification on update. Whats the best way to display a message to the user by notify?

    // register-service-worker.js
    ...
    updated (registration) {
     // how to trigger $q.notify('You have an update') on my App?
     },
    

    Can i get access to $q from within the updated method. Or should i dispatch an event e.g. on the windows object that i have to capture in some component?



  • @iklemm

    here’s service worker code:

    import { register } from "register-service-worker";
    import { Notify } from "quasar";
    
    
    
    register(process.env.SERVICE_WORKER_FILE, {
          registrationOptions: { scope: "./" },
    
        updated(/*registration*/) {
             Notify.create({
                // message: i18n.t('messages.update_available'),
                message: "Update my app",
                icon: "announcement",
                onDismiss() {
                    location.reload(true);
                }
            });
       }
    });
    

    But beware someone has reported problems with chrome:
    https://forum.quasar-framework.org/topic/6959/solved-chrome-but-not-ff-nor-safari-randomly-fails-pwa-update/39?_=1605376523099



  • Great, Notify works for me this way. - Thank You!

    I just needed the notification at this point.

    And yes, updating the app did not work for me either by just doing a forced reloading.

    I do have to unregister the serviceworker and afterwards reload the app for a new installation to have all data updated.

    Like this:

    navigator.serviceWorker.getRegistrations().then(function (registrations) {
          for (let registration of registrations) {
            registration.unregister();
          }
          window.location.reload(true);
        });
    

    Of course there might be more elegeant ways, but this worked for me.


Log in to reply