如何在Chrome扩展程序中实现声音通知弹出窗口。
一样答案 0 :(得分:31)
我认为createHTMLNotification
已被弃用,因为已经接受了答案。对于现在发生在这个帖子上的任何人来说,这是一个自2014年1月开始工作的方法,假设你的清单中有notifications
个权限:
<强> background.js 强>
createNotification();
audioNotification();
function audioNotification(){
var yourSound = new Audio('yourSound.mp3');
yourSound.play();
}
function createNotification(){
var opt = {type: "basic",title: "Your Title",message: "Your message",iconUrl: "your_icon.png"}
chrome.notifications.create("notificationName",opt,function(){});
//include this line if you want to clear the notification after 5 seconds
setTimeout(function(){chrome.notifications.clear("notificationName",function(){});},5000);
}
这里的一般想法只是你会发出定期通知,然后在通知创建之后立即使用普通的JavaScript方法播放声音。当然还有其他方法可以做到并组织它,但我认为这很清楚,并且在大多数情况下很容易实现。
答案 1 :(得分:7)
您可以使用以下代码作为在桌面通知中播放声音的参考,它将<audio>
标记与Desktop Notifications
结合使用。
已注册的通知权限和包含清单文件的后台页面。
{
"name": "Notification with Audio",
"description": "http://stackoverflow.com/questions/14917531/how-to-implement-a-notification-popup-with-sound-in-chrome-extension",
"manifest_version": 2,
"version": "1",
"permissions": [
"notifications"
],
"background": {
"scripts": [
"background.js"
]
}
}
从后台应用程序创建了一个通知页面。
// create a HTML notification:
var notification = webkitNotifications.createHTMLNotification(
'notification.html' // html url - can be relative
);
// Then show the notification.
notification.show();
播放一些随机歌曲
<html>
<body>
<p>Some Nice Text While Playing Song.. </p>
<audio autoplay>
<source src="http://www.html5rocks.com/en/tutorials/audio/quick/test.mp3" type="audio/mpeg" />
<source src="http://www.html5rocks.com/en/tutorials/audio/quick/test.ogg" type="audio/ogg" />
</audio>
</body>
</html>