Angular - Service Worker：如何从路由获取动态 ID 到“Notificationclick”事件中？

Question

I have put some push notifications in my code, in order to someone to be notified when an action is made. I made the back end with lib.net.webpush 3.1.0 with .net 4.5.2 in C#. So far, the notification system is working very well, but there is something I can't succeed: Within my service worker file (sw.js), using Angular 9, i want, when someone received the notification, that when a user click on it, he is redirect to the page from which it was sent.

first i made it like it (as i read in the doc):

self.addEventListener('notificationclick', function (event) {
const urlToOpen = new URL(event.notification.data, self.location.origin).href;

event.notification.close();

event.waitUntil(clients.openWindow(urlToOpen));
 });

But i was always redirect to the "localhost://4200" and not to the complete url.

In order to test, i made this:

self.addEventListener('notificationclick', function (event) {
const urlToOpen = new URL(self.location.origin + "/#/rdc/rapports/2015");

event.notification.close();

event.waitUntil(clients.openWindow(urlToOpen));
});

and it worked. But i can't get the dynamic URL. Does anyone knows how to get a dynamic URL within this file? Or how to be redirect to the page that sent the notification? I also tried something like this here: notificationclick event service worker But i really dont understand. Thanks.

Answer 1

I just succeed in doing it. So, for anyone in the same case as I was: within the service worker, you can't access the DOM, i wasn't able to get any ID or any path I was trying to aim in my code. The solution was to, in my C# code, to add a "URL" property and parameter to my "SendNotification" funtion. Then, when i got a user, i can target his ID because it's already here. Then, in my Angular code (within the service worker file), I just had to to this (i am storing my url in "data" here):

self.addEventListener('notificationclick', function (event) {   console.log("notif click event", event);

    const urlToOpen = new URL(self.location.origin + event.notification.data);

    event.notification.close();

    event.waitUntil(clients.openWindow(urlToOpen)); });

An then, when i click on the notification, I am redirected to the desired URL.