webhintio.github.io icon indicating copy to clipboard operation
webhintio.github.io copied to clipboard

Notifications and custom Service Worker

Open molant opened this issue 8 years ago • 3 comments

Right now we are using an Hexo package that provides a Service Worker out of the box, but we've had some bad experiences with it. We should write our own that will enable also to receive notifications once the scan has finished if the user decides to.

molant avatar Oct 17 '17 23:10 molant

Research and my thoughts about the things that need to be done here:

  1. Register service worker in index.html, preferentially using sw-precache since it takes care of adding hash to the assets , updating the hash if there are changes, and also the cache first logic. This will be registered as a filter in hexo so that the list of cached files is generated automatically. This is very similar to what hexo-offline does, but some changes are needed because we need access to the registered service worker in scanner-submit.js to register for push notifications.

  2. Then in scanner-submit.js, We ask for users' consent and then subscribe to pushManager. The registration information returned is then submitted to the backend and saved along the scan's id. The registration info includes an endpoint which will be used to identify to which service worker the notification should be pushed to.

  3. On the server side, once a scan is finished, we use web-push to trigger a push with a payload (containing the scan id). Not sure about the details in the server side: Can we push directly from online-service once a job is done?

  4. In service-worker.js, we register handlers for push (when a new notification is received) and notificationclick (when a notification is clicked by a user). We can custom the url opened on click with the scan id available to us in the payload. https://stackoverflow.com/a/44025413

In addition, I find the following posts helpful:

  • https://developers.google.com/web/ilt/pwa/introduction-to-push-notifications#what_are_push_notifications
  • https://developers.google.com/web/fundamentals/codelabs/push-notifications/
  • https://serviceworke.rs/push-get-payload_service-worker_doc.html (with examples)
  • To add additional handlers in sw-precache's service worker : https://stackoverflow.com/a/44524987

qzhou1607-zz avatar Oct 27 '17 18:10 qzhou1607-zz

It looks good! I think I'd work first on 1 without push notifications, PR that, and then continue with the rest.

Not sure about the details in the server side: Can we push directly from online-service once a job is done?

We probably will have to register in the DB the notifications we need to send and check periodically if any of those jobs have finished, and if so notify. @sarvaje, thoughts about this?

molant avatar Oct 27 '17 20:10 molant

We probably will have to register in the DB the notifications we need to send and check periodically if any of those jobs have finished, and if so notify. @sarvaje, thoughts about this?

After register the notification in the DB, I think the sync service can send the notification if needed.

sarvaje avatar Oct 27 '17 20:10 sarvaje