HTML5实现浏览器的桌面通知 (兼容性多个浏览器)

HTML5实现浏览器的桌面通知 (兼容性多个浏览器)

提示:需要在服务器上运行才会有效果,直接运行代码是没有效果的

代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<script type="text/javascript">
/*
* 桌面通知
* strNewsContent:通知的内容
*/
function windowsNotify(strNewsContent) {
if (!("Notification" in window) && !window.webkitNotifications && window.webkitNotifications.checkPermission() != 0)
return;

if (Notification.permission == null || Notification.permission == undefined)
windowsNotify360(strNewsContent);
else if (Notification.permission === "granted")
windowsNotifyFFAndGE(strNewsContent);
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
if (!('permission' in Notification))
Notification.permission = permission;

if (permission === "granted")
windowsNotifyFFAndGE(strNewsContent);
});
}
}

//桌面通知(兼容360)
function windowsNotify360(strNewsContent) {
if (window.webkitNotifications && window.webkitNotifications.checkPermission() == 0) {
var notify = window.webkitNotifications.createNotification(
"http://www.fx678.com/corp/images/aboutus/htw.jpg",
'汇通-新闻中心',
strNewsContent
);

//设置定时撤销机制,防止通知长时间显示不被关闭
notify.ondisplay = function (event) {
setTimeout(function () {
event.currentTarget.cancel();
}, 10000);
};
//下面是定义点击事件,类似地还可定义其它事件
notify.onclick = function () {
window.focus();
this.cancel();
};
//弹出
notify.show();
} else if (window.webkitNotifications) {
window.webkitNotifications.requestPermission(windowsNotify360);
}
}


//桌面通知(兼容火狐、谷歌)
function windowsNotifyFFAndGE(strNewsContent) {
var notification = new Notification('汇通-新闻中心',
{
body: strNewsContent,
icon: "http://www.fx678.com/corp/images/aboutus/htw.jpg"
});

//设置定时撤销机制,防止通知长时间显示不被关闭
notification.ondisplay = function (event) {
setTimeout(function () {
event.currentTarget.cancel();
}, 10000);
};

//下面是定义点击事件,类似地还可定义其它事件
notification.onclick = function () {
window.focus();
this.cancel();
};
console.log(notification);
}
windowsNotify('asdsd');

</script>