Сейчас я пытаюсь заставить Push-уведомления работать с Node.js.
Для этого я следовал некоторым учебным пособиям и документам, которые я мог найти в сети, и у меня наконец-то есть что-то работающее с использованием того, что называется Service Workers.
На данный момент я совсем не знаком с push-уведомлениями на 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, я вижу такое уведомление:
На скриншоте видно «undefined». Это то, что исходит из data.title (из параметра e). Как мне изменить код, чтобы увидеть что-то еще, кроме «неопределенного»? Я хочу иметь возможность внести изменения вне этого блока, конечно:
self.addEventListener('push', e => {...})
Я уже пытался установить какое-то поле «заголовок», где, как я думал, может быть решение, но ничего не сработало. Я явно что-то не так делаю.
Другими словами, в более общем смысле; то, что я хочу знать, это «Как использовать параметр события addEventListener». Даже очень простой пример (как изменить мой код для этого) был бы очень признателен.