Сега се опитвам да накарам Push Notifications да работят с Node.js.
За целта последвах някои уроки и документи, които можах да намеря в мрежата и най-накрая имам нещо работещо, използвайки това, което се нарича Service Workers.
На този етап както Push Notifications на Node.js, така и Service Workers не са нещо, с което изобщо съм запознат.
Ето моят подходящ код:
.....
console.log("Registering ServiceWorker.");
const register = await navigator.serviceWorker.register('/worker.js', {
scope: "/"
});
console.log('ServiceWorker registered.');
console.log("Registering Push.");
const subscription = await register.pushManager.subscribe({
userVisibleOnly: true,
applicationServerKey: urlBase64ToUint8Array(publicVapIdKey)
});
console.log('Push registered.');
console.log("Sending Push.");
await fetch('/subscribe', {
method: 'POST',
body: JSON.stringify(subscription),
headers: {
'content-type': 'application/json'
}
});
console.log('Push sent.');
.....
и сервизния работник:
console.log('Service Worker Loaded.');
self.addEventListener('push', e => {
const data = e.data.json;
console.log('Push Received');
self.registration.showNotification(data.title, {
body: 'It is time to go for lunch.',
icon: 'MyLogo.png'
})
});
И също това, в моя файл index.js:
// Subscribe Route.
app.post('/subscribe',(req,res) => {
const subscription = req.body; // Get Push Subscription Object.
res.status(201).json({}); // Sen 201. Resource created.
// Create PayLoad.
const payload = JSON.stringify({title:'This is a payload-title'});
// Pass Object to sendNotification.
webPush.sendNotification(subscription,payload).catch(err => console.error(err));
});
Въпросът, който искам да задам, е относно използването на втория параметър на addEventListener. Това е параметърът на събитието. Струва ми се, че този параметър трябва да е много важен за прехвърляне на информация към Service Worker, но в моя пример той е напълно безполезен и не знам как да го използвам.
Когато стартирам този пример във FireFox или Chrome, мога да видя този вид известие:
Може да се види „недефиниран“, показан на екранната снимка. Това е, което идва от data.title (идва от параметъра e). Как трябва да променя кода, за да видя нещо различно от "undefined" показано? Искам да мога да направя промяната извън този блок, разбира се:
self.addEventListener('push', e => {...})
Вече се опитах да задам някакво поле "заглавие", където мислех, че може да е решение, но нищо не работи. Очевидно не постъпвам правилно.
С други думи, по-общо казано; това, което искам да знам, е „Как да използвам параметъра за събитие на addEventListener“. Дори много основен пример (как да променя кода си за това) би бил много оценен.
