アイコンとオーディオ付きのデスクトップ通知をMeteor Web Appliationに追加

Meteor Webアプリケーションに簡単なHTML5デスクトップ通知を追加しようとしています。ここにコードは、アイコンとオーディオ付きのデスクトップ通知をMeteor Web Appliationに追加

if (!("Notification" in window)) { 
     alert("This browser does not support desktop notification"); 
     } 

     // Let's check whether notification permissions have already been granted 
     else if (Notification.permission === "granted") { 
      var date = new Date(); 
      var audio = new Audio(); 
      audio.src = "../../../universal/bells.wav"; 
      audio.load(); 
      audio.play(); 
      var notification = new Notification("Allow Notifications!", { 
           dir: "auto", 
           lang: "hi", 
           tag: "testTag"+date.getTime(), 
           icon: "../../../assets/notification.png", 
           }); 
      } 

     // Otherwise, we need to ask the user for permission 
     else if (Notification.permission !== 'denied') { 
      Notification.requestPermission(function (permission) { 
      if (permission === "granted") { 
      var notification = new Notification("Granted Permission for Notifications"); 
      } 
     }); 
     }

しかし、オーディオと画像の両方が表示されていません。これは、私がオーディオファイルのために受け取るエラーメッセージです。

"未知の（約束された）DOMException：サポートされていないソースが見つからなかったためロードできませんでした。 IMG-SRC：私は、コードの音声部分をコメントアウトした場合、画像のアイコンがエラーを投げている

、

は、「それは、次のコンテンツセキュリティポリシーの指示に違反しているため、画像『http://placekitten.com.s3.amazonaws.com/homepage-samples/96/139.jpg』をロードすることを拒否します」データ： '自己' http：// .googleapis.com https：// .googleapis.com http：// .gstatic.com https：// .gstatic.com http：// .bootstrapcdn.com https：// .bootstrapcdn.com "。"

画像が表示されません。

Meteor Appにデスクトップ通知を実装する方法はありますか？また、通知をページの中央に表示する方法はありますか？これを一晩中苦労しました。どうもありがとう！

出典

2016-11-25 user3082806