chrome 通过 Service Worker 接收的通知是批量的还是实时的?
Are chrome notifications received via service workers batched or real time?
我正在尝试为我的网站实施浏览器推送通知。我注意到即使浏览器收到通知,有时也不会显示通知。
var showNotification = function (event, data) {
var notificationData = data['data'];
var title = notificationData['title'];
var body = notificationData['body'];
var icon = notificationData['icon'];
var notificationActionsData = notificationData["actions"];
var actions = [];
if(notificationActionsData) {
for(var i=0; i < notificationActionsData.length; i++) {
var action = {
action: "action" + i,
title: notificationActionsData[i].title,
};
actions.push(action);
}
}
var campaignId = notificationData["id"];
self.registration.showNotification(title, {
body: body,
icon: icon,
data: notificationData,
tag: notificationData.id,
actions: actions
});
pushowlReporting.tickle(campaignId, "delivery");
};
function processNotification(event) {
if (event.data) {
var data = event.data.json();
showNotification(event, data);
}
else {
fetch("https://" + hostname + "/api/v1/subdomain/" + subdomain + "/campaign/", {'mode': 'no-cors'}).then(
function (response) {
if (response.status !== 200) {
console.log('Looks like there was a problem. Status Code: ', response.status);
return;
}
// Examine the text in the response
response.text().then(function (responseText) {
var data = JSON.parse(responseText);
showNotification(event, data);
});
}
).catch(function (err) {
console.log('Fetch Error :', err);
}
);
}
}
self.addEventListener('push', function (event) {
event.waitUntil(processNotification(event));
});
我的报告 API 显示通知已发送,但浏览器间歇性地显示通知。
通知显示非常不稳定。有时通知会立即显示,而有时它会暂时不显示,然后突然间所有过去的通知都会批量出现。有时一些通知根本不会显示。
如果我做错了什么,请告诉我?
传递给 event.waituntil 的函数应该 return 一个承诺。否则范围将被搞乱,因为事件的生命周期不会得到延长。
https://developer.mozilla.org/en-US/docs/Web/API/ExtendableEvent/waitUntil
var showNotification = function (event, data) {
var notificationData = data['data'];
var title = notificationData['title'];
var body = notificationData['body'];
var icon = notificationData['icon'];
var notificationActionsData = notificationData["actions"];
var actions = [];
if(notificationActionsData) {
for(var i=0; i < notificationActionsData.length; i++) {
var action = {
action: "action" + i,
title: notificationActionsData[i].title,
};
actions.push(action);
}
}
var campaignId = notificationData["id"];
return self.registration.showNotification(title, {
body: body,
icon: icon,
data: notificationData,
tag: notificationData.id,
actions: actions
}).then(function (succ) {
pushowlReporting.tickle(campaignId, "delivery");
});
};
function processNotification(event) {
if (event.data) {
var data = event.data.json();
return showNotification(event, data);
}
else {
return fetch("https://" + hostname + "/api/v1/subdomain/" + subdomain + "/campaign/", {'mode': 'no-cors'}).then(
function (response) {
if (response.status !== 200) {
console.log('Looks like there was a problem. Status Code: ', response.status);
return;
}
// Examine the text in the response
response.text().then(function (responseText) {
var data = JSON.parse(responseText);
showNotification(event, data);
});
}
).catch(function (err) {
console.log('Fetch Error :', err);
}
);
}
}
我刚刚在您的代码中添加了 return 语句。试试这个。
我正在尝试为我的网站实施浏览器推送通知。我注意到即使浏览器收到通知,有时也不会显示通知。
var showNotification = function (event, data) {
var notificationData = data['data'];
var title = notificationData['title'];
var body = notificationData['body'];
var icon = notificationData['icon'];
var notificationActionsData = notificationData["actions"];
var actions = [];
if(notificationActionsData) {
for(var i=0; i < notificationActionsData.length; i++) {
var action = {
action: "action" + i,
title: notificationActionsData[i].title,
};
actions.push(action);
}
}
var campaignId = notificationData["id"];
self.registration.showNotification(title, {
body: body,
icon: icon,
data: notificationData,
tag: notificationData.id,
actions: actions
});
pushowlReporting.tickle(campaignId, "delivery");
};
function processNotification(event) {
if (event.data) {
var data = event.data.json();
showNotification(event, data);
}
else {
fetch("https://" + hostname + "/api/v1/subdomain/" + subdomain + "/campaign/", {'mode': 'no-cors'}).then(
function (response) {
if (response.status !== 200) {
console.log('Looks like there was a problem. Status Code: ', response.status);
return;
}
// Examine the text in the response
response.text().then(function (responseText) {
var data = JSON.parse(responseText);
showNotification(event, data);
});
}
).catch(function (err) {
console.log('Fetch Error :', err);
}
);
}
}
self.addEventListener('push', function (event) {
event.waitUntil(processNotification(event));
});
我的报告 API 显示通知已发送,但浏览器间歇性地显示通知。
通知显示非常不稳定。有时通知会立即显示,而有时它会暂时不显示,然后突然间所有过去的通知都会批量出现。有时一些通知根本不会显示。
如果我做错了什么,请告诉我?
传递给 event.waituntil 的函数应该 return 一个承诺。否则范围将被搞乱,因为事件的生命周期不会得到延长。 https://developer.mozilla.org/en-US/docs/Web/API/ExtendableEvent/waitUntil
var showNotification = function (event, data) {
var notificationData = data['data'];
var title = notificationData['title'];
var body = notificationData['body'];
var icon = notificationData['icon'];
var notificationActionsData = notificationData["actions"];
var actions = [];
if(notificationActionsData) {
for(var i=0; i < notificationActionsData.length; i++) {
var action = {
action: "action" + i,
title: notificationActionsData[i].title,
};
actions.push(action);
}
}
var campaignId = notificationData["id"];
return self.registration.showNotification(title, {
body: body,
icon: icon,
data: notificationData,
tag: notificationData.id,
actions: actions
}).then(function (succ) {
pushowlReporting.tickle(campaignId, "delivery");
});
};
function processNotification(event) {
if (event.data) {
var data = event.data.json();
return showNotification(event, data);
}
else {
return fetch("https://" + hostname + "/api/v1/subdomain/" + subdomain + "/campaign/", {'mode': 'no-cors'}).then(
function (response) {
if (response.status !== 200) {
console.log('Looks like there was a problem. Status Code: ', response.status);
return;
}
// Examine the text in the response
response.text().then(function (responseText) {
var data = JSON.parse(responseText);
showNotification(event, data);
});
}
).catch(function (err) {
console.log('Fetch Error :', err);
}
);
}
}
我刚刚在您的代码中添加了 return 语句。试试这个。