Chrome 桌面通知不显示消息
Chrome Desktop Notification doesn't display the message
我正在开发一个支持桌面通知的网站。我正在利用 GCM 和 Azure 通知中心向最终用户发送推送消息。我遵循了这个 codelab 教程。测试时我发现推送通知确实显示在屏幕上,但我在有效负载中写入的消息没有显示在通知中。所以我再次浏览了代码实验室,他们在 showNotification
方法中提到了一个 body
键。
代码
self.addEventListener('push', function(event) {
console.log('Push message', event);
var title = 'Push message';
event.waitUntil(
self.registration.showNotification(title, {
body: 'The Message',
icon: 'images/icon.png',
tag: 'my-tag'
}));
});
他们在 showNotification
函数中硬编码了 "The Message"。我不想在函数中对我的消息进行硬编码,因为我的消息不会始终相同并且会不时变化。我想知道如何使该函数获取有效负载中的消息并显示它。提前致谢!
Chrome 尚不支持推送负载,目前您只能在 Firefox 中使用它们。
解决方案是在收到通知后从服务器请求负载(使用 fetch
)。
像这样:
self.addEventListener('push', function(event) {
event.waitUntil(
fetch('./getPayload?someUniqueID=' + someUniqueID)
.then(function(response) {
return response.text();
})
.then(function(payload) {
self.registration.showNotification('Title', {
body: payload,
});
})
);
});
显然,响应也可以在 JSON 中,这样您就可以指定所有内容(标题、body、图标等)。
您可以在此处查看示例:https://serviceworke.rs/push-get-payload.html。
另一种可能的解决方案是在有效负载可用时使用它,否则使用 fetch
。通过这种方式,您可以利用 Firefox 中的功能(以及 Chrome 一旦可用),并为尚不支持有效负载的浏览器提供回退。
Mercurius.
中有一个示例
我正在开发一个支持桌面通知的网站。我正在利用 GCM 和 Azure 通知中心向最终用户发送推送消息。我遵循了这个 codelab 教程。测试时我发现推送通知确实显示在屏幕上,但我在有效负载中写入的消息没有显示在通知中。所以我再次浏览了代码实验室,他们在 showNotification
方法中提到了一个 body
键。
代码
self.addEventListener('push', function(event) {
console.log('Push message', event);
var title = 'Push message';
event.waitUntil(
self.registration.showNotification(title, {
body: 'The Message',
icon: 'images/icon.png',
tag: 'my-tag'
}));
});
他们在 showNotification
函数中硬编码了 "The Message"。我不想在函数中对我的消息进行硬编码,因为我的消息不会始终相同并且会不时变化。我想知道如何使该函数获取有效负载中的消息并显示它。提前致谢!
Chrome 尚不支持推送负载,目前您只能在 Firefox 中使用它们。
解决方案是在收到通知后从服务器请求负载(使用 fetch
)。
像这样:
self.addEventListener('push', function(event) {
event.waitUntil(
fetch('./getPayload?someUniqueID=' + someUniqueID)
.then(function(response) {
return response.text();
})
.then(function(payload) {
self.registration.showNotification('Title', {
body: payload,
});
})
);
});
显然,响应也可以在 JSON 中,这样您就可以指定所有内容(标题、body、图标等)。
您可以在此处查看示例:https://serviceworke.rs/push-get-payload.html。
另一种可能的解决方案是在有效负载可用时使用它,否则使用 fetch
。通过这种方式,您可以利用 Firefox 中的功能(以及 Chrome 一旦可用),并为尚不支持有效负载的浏览器提供回退。
Mercurius.