Closed nvitaterna closed 3 years ago
Hey @nvitaterna
I like the idea, a simple way to add additional code to the service-worker while keeping the basic functionality.
And to keep things separated and be able to write the code in plain javascript, one could do the following:
// nuxt.config.js
const fs = require('fs')
...
inject: fs.readFileSync('./fileWithCodeToBeInjected.js', 'utf8'),
...
I think for a start this is good, I'll add this as a feature to the module and if needed, one can always supply a PR to make this functionality more solid. However, in more complex cases I would just advise to load the service worker yourself instead of via this option.
Just out of curiosity, since I haven't encountered more I wanna do with the messaging service worker - what would be the use case to extend the service worker with more functionality? Any example?
@nvitaterna Released with v7.3.0
Thanks a lot for the PR - appreciate it!
Hey @nvitaterna
I like the idea, a simple way to add additional code to the service-worker while keeping the basic functionality.
And to keep things separated and be able to write the code in plain javascript, one could do the following:
// nuxt.config.js const fs = require('fs') ... inject: fs.readFileSync('./fileWithCodeToBeInjected.js', 'utf8'), ...
I think for a start this is good, I'll add this as a feature to the module and if needed, one can always supply a PR to make this functionality more solid. However, in more complex cases I would just advise to load the service worker yourself instead of via this option.
Just out of curiosity, since I haven't encountered more I wanna do with the messaging service worker - what would be the use case to extend the service worker with more functionality? Any example?
Yep, that's actually the way I'm using it right now :). I've got a couple uses for adding more functionality. I'd like to just replace the sw.js with my own - but I need separate firebase configurations for dev/prod when testing and building.
First one is to be able to customize notifications. Instead of making a list of pre-defined actions, I like to generate them on the fly with custom JSON data:
messaging.setBackgroundMessageHandler(function (payload) {
const notificationData = JSON.parse(payload.data.jsonData);
const title = payload.data.title;
return self.registration.showNotification(title, {
...notificationData,
icon: `${self.location.origin}/icon.png`
});
});
Second reason is to handle notification clicks on those actions:
self.onnotificationclick = function (event) {
const action = event.action;
const data = event.notification.data;
if (data && data.actions) {
if (data.actions[action]) {
clients.openWindow(data.actions[action]);
}
}
};
Makes both sense, and I guess we could also build functionality for these use-cases into the module. However, at some point it gets easier to write the service worker yourself and
We could also provide an "empty" service-worker template with the module (-> i.e., only loading the config and importing the firebase module) and let the user handle all the rest with his/her "injected" javascript.
That would keep it quite simple and flexible..
This is a very basic implementation, but it would be nice to have something like this setup.