如何在 Web 推送中向特定用户发送推送通知？

Question

我有一个现有的网站，我只需要将通知推送到该网站，因为我正在使用 Nodejs 网络推送包，我可以接收通知，但我需要将其更改为 User Specific,

例如，我想根据国家/地区为用户发送通知

这是我的代码

client.js

const publicVapidKey = 'xxxxxx';

if ('serviceWorker' in navigator) {
  console.log('Registering service worker');

  run().catch(error => console.error(error));
}
function urlBase64ToUint8Array(base64String) {
  const padding = '='.repeat((4 - base64String.length % 4) % 4);
  const base64 = (base64String + padding)
    .replace(/-/g, '+')
    .replace(/_/g, '/');

  const rawData = window.atob(base64);
  const outputArray = new Uint8Array(rawData.length);

  for (let i = 0; i < rawData.length; ++i) {
    outputArray[i] = rawData.charCodeAt(i);
  }
  return outputArray;
}

async function run() {
  console.log('Registering service worker');
  const registration = await navigator.serviceWorker.
    register('worker.js');
  console.log('Registered service worker');

  console.log('Registering push');
  const subscription = await registration.pushManager.
    subscribe({
      userVisibleOnly: true,
      // The `urlBase64ToUint8Array()` function is the same as in
      // https://www.npmjs.com/package/web-push#using-vapid-key-for-applicationserverkey
      applicationServerKey: urlBase64ToUint8Array(publicVapidKey)
    });
    // subscription.user = $('.header-user-name').find('span').text();
  console.log('Registered push');

  console.log('Sending push');
  await fetch('http://localhost:3000/subscribe?user='+$('.header-user-name').find('span').text(), {
    method: 'POST',
    body: JSON.stringify(subscription),
    headers: {
      'content-type': 'application/json'
    }
  });
  console.log('Sent push');
}

Worker.js

console.log('Loaded service worker!');

self.addEventListener('push', ev => {
  const data = ev.data.json();
  console.log('Got push', data);

  ev.waitUntil(self.registration.showNotification(data.title, {
    body: 'Hello, World!',
    registration_ids: [$('.header-user-name').find('span').text()]
    icon: 'http://mongoosejs.com/docs/images/mongoose5_62x30_transparent.png'
  }));

});

服务器代码 (localhost:3000/push)

app.get('/push',function(req,res) {

  const payload = JSON.stringify({ title: 'Hello '+ user.name +' ' + req.query.title,  });

  console.log(req.query);
  console.log("yahooooooooooooooooooooooooooooooooo");

  webpush.sendNotification(newSubscription, payload).catch(error => {
    console.error(error.stack);
  });
  res.send({result : 'Success'});
});

Answer 1

您可以使用 ip-api.com 等服务，使用用户的 IP 查询他们的国家/地区。获取国家/地区信息后，您可以将其与推送订阅对象一起包含在请求正文中并发送到后端。因此，您将有机会细分您的订阅者并向他们发送具有不同内容的推送通知。

Answer 2

经过长时间的gap，我找到了解决这个问题的方法。

要遵循的步骤：

创建 ExpressJs api 以将用户订阅存储到数据库中。
从数据库中获取基于国家的用户（你可以使用你自己的后端语言，我选择了 Nodejs）。
创建一个 api 可以使用给定参数（如（国家/地区、用户等））发送推送通知。

编码愉快。

如何在 Web 推送中向特定用户发送推送通知？

How to send push notification to Specific user in Web-push?

push-notification

node.js

web-push