处理传入通知:Web

Question

我是push的新手。到目前为止，我可以收到通知，但我想在通知到达用户时处理自定义操作。我应该把PusherPushNotifications.onNotificationReceived放在我的项目的哪里?我在控制台日志中没有得到"123"。我正在使用push的service worker (push service worker)。

推杆式文档

<script src="https://js.pusher.com/beams/1.0/push-notifications-cdn.js"></script>
<script>
PusherPushNotifications.onNotificationReceived = ({
pushEvent,
payload
}) => {
// NOTE: Overriding this method will disable the default notification
// handling logic offered by Pusher Beams. You MUST display a notification
// in this callback unless your site is currently in focus
// https://developers.google.com/web/fundamentals/push-notifications/subscribing-a-user#uservisibleonly_options
// Your custom notification handling logic here 🛠️
console.log('123');
// https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification
pushEvent.waitUntil(
self.registration.showNotification(payload.notification.title, {
body: payload.notification.body,
icon: payload.notification.icon,
data: payload.data,
}),
);
};
const tokenProvider = new PusherPushNotifications.TokenProvider({
url: 'http://localhost/tutorial/auth.php',
});
const beamsClient = new PusherPushNotifications.Client({
instanceId: 'instanceId',
});
beamsClient
.start()
.then(() => beamsClient.setUserId('userId', tokenProvider))
.catch(console.error);
// beamsClient.getUserId()
//    .then(userId => {
//        console.log(userId);
//    })
//    .catch(console.error);
// beamsClient
//     .stop()
//     .catch(console.error);
</script>

Answer 1

PusherPushNotifications.onNotificationReceived函数应该驻留在service-worker.js文件中。然后，您应该会看到控制台日志，并可以自定义通知和接收行为。