javascript - 如何以及使用什么在前端推送通知而无需重新加载

Question

这个问题已经有答案了:

How can I do push notifications in an HTML5 Web application? (2 个回答)

已关闭 4 年前。

我有一个Python程序，可以将数据插入数据库(xampp)，我想监听数据库中的任何更改并接收对前端的请求，而不使用任何点击事件。类似于ajax，但只监听和通知，并且会自动在前端推送通知。

Answer 1

使用 Javascript serviceworkers Check this out

例如

  self.addEventListener('push', function(event) {
  console.log('[Service Worker] Push Received.');
  console.log(`[Service Worker] Push had this data: 
  "${event.data.text()}"`);

  const title = 'Push Codelab';
  const options = {
    body: 'Yay it works.',
    icon: 'images/icon.png',
    badge: 'images/badge.png'
  };

  event.waitUntil(self.registration.showNotification(title, options));
});

但是你必须先注册服务 worker ，例如

if ('serviceWorker' in navigator && 'PushManager' in window) {
  console.log('Service Worker and Push is supported');

  navigator.serviceWorker.register('sw.js')
  .then(function(swReg) {
     console.log('Service Worker is registered', swReg);

     swRegistration = swReg;
  })
  .catch(function(error) {
     console.error('Service Worker Error', error);
  });
} else {
  console.warn('Push messaging is not supported');
}