html5__Notifications API 桌面通知

MDN地址

google 文档 https://developers.google.cn/web/fundamentals/push-notifications/

const koa2 = require(`koa2`);
const Router = require(`koa-router`);
const router = new Router();
const app = new koa2();
const Index = router.get(`/`, async (ctx, next) => {
  await next()
  ctx.status = 200;
  ctx.type = `html`;
  ctx.body = `
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script>
    function good(){
    var notification = new Notification("hello to..", {
      dir: 'ltr',
      body: '测试 web Notification API',
      tag: 'test',
      icon: 'https://pic.cnblogs.com/avatar/1053296/20171128213246.png'
    });
    notification.onclick = function(e) {
      console.log( e);
      console.log('每当用户点击通知时被触发');
      this.close();
      window.open('http://www.cnblogs.com/ajanuw/')
    }
    notification.onshow = function() {
      console.log('通知显示的时候被触发');
    }
    notification.onerror = function() {
      console.log('当通知遇到错误时被触发');
    }
    notification.onclose = function() {
      console.log('用户关闭通知时被触发');
    }
}
  function run() {
    if ('Notification' in window) {
      // 查看是否有权限
      if (Notification.permission == 'granted') {
        good()
      } else if(Notification.permission == 'denied' || Notification.permission == 'default') {
        // 主动提出需要权限
        Notification.requestPermission(permission => {
          if (permission == 'granted') {
            good()
          }
        })
      }
    }
  }
  run();
</script>
    `
}).routes();
app.use(Index);
app.listen(1995);