在第三方网站上推送html5通知时如何执行代码

Question

我有一个使用通知的网站（ gitter.im ），我想在推送通知时运行声音。 如何将此代码添加到通知中？

 (function() { var a = document.createElement('audio') a.setAttribute('autoplay', true) a.setAttribute('src', 'http://www.soundjay.com/button/beep-03.mp3') })(); 

Answer 1

您可以使用HTML5音频api，但在service worker中不起作用。

当浏览器收到通知时发出声音的唯一方法是通过postMessage（），您可以通知您的网页发出声音，但是只有在浏览器中打开了主站点页面时，它才起作用。

（ Chrome ServiceWorker postMessage ）

 var track = new Audio("http://oringz.com/oringz-uploads/sounds-874-gets-in-the-way.mp3"); track.play(); 

详细信息： http : //www.html5rocks.com/en/tutorials/webaudio/intro/

Answer 2

这似乎可行：

(function(Notif) {
  function play() {
    var a = document.createElement('audio')
    a.setAttribute('autoplay', true)
    a.setAttribute('src', 'http://www.soundjay.com/button/beep-03.mp3');
  }
  window.Notification = function(title, option) {
    var notif = new Notif(title, option);
    play();
    return notif;
  };
  for (var key in Notif) {
    if (Notif.hasOwnProperty(key)) {
      window.Notification[key] = Notif[key];
    }
  }
})(Notification);