Javascript HTML 5桌面通知在IE中不起作用
我从桌面通知中获得了这段代码，并试图在我的应用程序中构建相同的代码Javascript HTML 5桌面通知在IE中不起作用,javascript,html,google-chrome,internet-explorer,notifications,Javascript,Html,Google Chrome,Internet Explorer,Notifications,我从桌面通知中获得了这段代码，并试图在我的应用程序中构建相同的代码 <!DOCTYPE html> <html lang=en> <head> <style> html, body { width: 100%; height: 100%; margin: 0%; font-family: "helvetica"
<!DOCTYPE html>
<html lang=en>
<head>
<style>
html, body {
width: 100%;
height: 100%;
margin: 0%;
font-family: "helvetica","verdana","calibri", "san serif";
overflow: visible;
padding: 0%;
border: 0%;
}
</style>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
<title>
Html5 Notification API Example
</title>
</head>
<body>
<script>
(function () {
var PERMISSION_DEFAULT = "default";
var PERMISSION_GRANTED = "granted";
var PERMISSION_DENIED = "denied";
var PERMISSION_NOTSUPPORTED = "notsupported";
var PERMISSIONS = [PERMISSION_GRANTED, PERMISSION_DEFAULT, PERMISSION_DENIED, PERMISSION_NOTSUPPORTED];
var DIRESCTIONS = ["auto", "ltr", "rtl"];
var IENotificationIndex = -1;
var IECloseNotificationEvents = ["click", "scroll", "focus"];
var getIco = function (icon) {
var lastIndex = icon.lastIndexOf(".");
return (lastIndex !== -1 ? icon.substr(0, lastIndex) : icon) + ".ico";
};
var _Notification = window.Notification || /* Opera Mobile/Android Browser */
window.webkitNotifications && WebKitNotification || /* IE9+ pinned site */
"external" in window && "msIsSiteMode" in window.external && window.external.msIsSiteMode() !== undefined && IENotification || /* Notifications Not supported. Return dummy constructor */
DummyNotification;
/**
* @constructor DummyNotification
*/
function DummyNotification() {
var dummyElement = document.createElement("div");
this.addEventListener = function (eventName, callback) {
dummyElement.addEventListener(eventName, callback.bind(this));
};
this.removeEventListener = function (eventName, callback) {
dummyElement.removeEventListener(eventName, callback.bind(this));
};
this.dispatchEvent = function (eventName) {
if (typeof eventName !== "string") {
return;
}
try {
dummyElement.dispatchEvent(new Event(eventName));
} catch (e) {
var event = document.createEvent("Event");
event.initEvent(eventName, false, true);
dummyElement.dispatchEvent(event);
}
};
}
Object.defineProperty(DummyNotification, "permission", {
enumerable: true,
get: function () {
return PERMISSION_NOTSUPPORTED;
}
});
Object.defineProperty(DummyNotification, "requestPermission", {
enumerable: true,
writable: true,
value: function (callback) {
callback(this.permission);
}
});
/**
* @constructor IENotification
*/
function IENotification(title, options) {
DummyNotification.call(this);
var notificationIndex = IENotificationIndex;
Object.defineProperties(this, {
close: {
value: function (event) {
if (notificationIndex === IENotificationIndex) {
window.external.msSiteModeClearIconOverlay();
// Remove close events
IECloseNotificationEvents.forEach(function (event) {
window.removeEventListener(event, this.close);
}.bind(this));
this.dispatchEvent("click");
this.dispatchEvent("close");
notificationIndex = null;
}
}.bind(this)
}
});
// Clear any previous icon overlay
this.close();
// Set icon
if (this.icon) {
window.external.msSiteModeSetIconOverlay(getIco(this.icon), this.description || this.title);
}
// Blink icon
window.external.msSiteModeActivate();
// Trigger show event
this.dispatchEvent("show");
// Attach close event to window
IECloseNotificationEvents.forEach(function (event) {
window.addEventListener(event, this.close);
}.bind(this));
// Increment notification index
notificationIndex = ++IENotificationIndex;
}
Object.defineProperty(IENotification, "permission", {
enumerable: true,
get: function () {
var isTabPinned = true;
return isTabPinned ? PERMISSION_GRANTED : PERMISSION_DENIED;
}
});
Object.defineProperty(IENotification, "requestPermission", {
enumerable: true,
writable: true,
value: function (callback) {
return new Promise(function (resolve, reject) {
if (this.permission === PERMISSION_DENIED) {
alert(this.PERMISSION_REQUEST_MESSAGE);
}
resolve(this.permission);
}.bind(this));
}
});
Object.defineProperty(IENotification, "PERMISSION_REQUEST_MESSAGE", {
writable: true,
value: "IE supports notifications in pinned mode only. Pin this page on your taskbar to receive notifications."
});
/**
* @constructor WebKitNotification
*/
function WebKitNotification() { }
Object.defineProperty(WebKitNotification, "permission", {
enumerable: true,
get: function () {
return PERMISSIONS[window.webkitNotifications.checkPermission()];
}
});
Object.defineProperty(WebKitNotification, "requestPermission", {
enumerable: true,
writable: true,
value: function (callback) {
return new Promise(function (resolve, reject) {
window.webkitNotifications.requestPermission(function (permission) {
resolve(permission);
});
});
}
});
if (!_Notification.permission) {
Object.defineProperty(_Notification, "permission", {
enumerable: true,
get: function () {
return _Notification.permissionLevel && _Notification.permissionLevel();
}
});
}
/**
* @constructor Notification
*/
function Notification(title, options) {
var dir;
var notification;
if (!arguments.length) {
throw TypeError('Failed to construct "Notification": 1 argument required, but only 0 present.');
}
if (title === "") {
title = "\b";
}
if (arguments.length > 1 && "object" !== typeof options) {
throw TypeError('Failed to construct "Notification": parameter 2 ("options") is not an object.');
}
dir = Object(options).dir;
if (dir !== undefined && DIRESCTIONS.indexOf(dir) === -1) {
throw TypeError('Failed to construct "Notification": The provided value "' + dir + '" is not a valid enum value of type NotificationDirection.');
}
options = Object(options);
notification = new _Notification(title, options);
if (!notification.body) {
Object.defineProperty(notification, "body", {
value: String(options.body || "")
});
}
if (!notification.data) {
Object.defineProperty(notification, "data", {
value: options.data || null
});
}
if (!notification.dir) {
Object.defineProperty(notification, "dir", {
value: dir || DIRESCTIONS[0]
});
}
if (!notification.icon) {
Object.defineProperty(notification, "icon", {
value: String(options.icon || "")
});
}
if (!notification.lang) {
Object.defineProperty(notification, "lang", {
value: String(options.lang || "")
});
}
/* TODO: noscreen property */
/* TODO: renotify property */
if (!notification.requireInteraction) {
Object.defineProperty(notification, "requireInteraction", {
value: Boolean(options.requireInteraction)
});
}
/* TODO: sound property */
if (!notification.silent) {
Object.defineProperty(notification, "silent", {
value: Boolean(options.silent)
});
}
if (!notification.tag) {
Object.defineProperty(notification, "tag", {
value: String(options.tag || "")
});
}
if (!notification.title) {
Object.defineProperty(notification, "title", {
value: String(title)
});
}
if (!notification.timestamp) {
Object.defineProperty(notification, "timestamp", {
value: new Date().getTime()
});
}
/* TODO: vibrate property */
return notification;
}
Object.defineProperty(Notification, "permission", {
enumerable: true,
get: function () {
return _Notification.permission;
}
});
Object.defineProperty(Notification, "requestPermission", {
enumerable: true,
value: function () {
return new Promise(function (resolve, reject) {
var promise = _Notification.requestPermission(function (permission) {
resolve(permission);
});
if (!(promise instanceof Promise)) {
return;
}
resolve(promise);
});
}
});
window.Notification = Notification;
})();
window.addEventListener("load", c);// register an eventlistener for web page onload
function init() {
var b = document.getElementById("but");//get the button object
b.addEventListener("click", noti, false);//register an eventlistener for when user clicks the button
}
// function called when the web page has loaded
function c() {
init();
if (window.Notification && Notification.permission !== "granted") {//check to see if notification is granted and notification is supported
//if it is not supported request permission
Notification.requestPermission(function (status) {
if (Notification.permission !== status) {
Notification.permission = status;
}
})
}
}
//function called when button is clicked and shows notification
function noti() {
if (Notification.permission == "granted") {//check if we have notification permission
var title = "Just Testing This App";//title for notification
var options = {//options for notification
body: "it is just a test"
}
noti = new Notification(title, options);
}
else {
alert("permission not granted");//alert error message : permission is not granted
}
}
</script>
<button id=but>
Send Notification Now
</button>
</body>
</html>
html，正文{
宽度：100%；
身高：100%；
利润率：0%；
字体系列：“helvetica”、“verdana”、“calibri”、“san serif”；
溢出：可见；
填充：0%；
边界：0%；
}
Html5通知API示例
（功能（）{
var权限\u DEFAULT=“DEFAULT”；
var权限\u已授予=“已授予”；
var权限\u DENIED=“DENIED”；
var权限\u NOTSUPPORTED=“NOTSUPPORTED”；
var PERMISSIONS=[授予权限，默认权限，拒绝权限，不支持权限]；
var方向=[“自动”、“ltr”、“rtl”]；
变量IENotificationIndex=-1；
var IECloseNotificationEvents=[“单击”、“滚动”、“聚焦”]；
var getIco=函数（图标）{
var lastIndex=icon.lastIndexOf（“.”）；
return（lastIndex！=-1？icon.substr（0，lastIndex）：icon）+“.ico”；
};
var|u Notification=window.Notification | |/*Opera Mobile/Android浏览器*/
window.webkitNotifications&&WebKitNotification | |/*IE9+固定站点*/
窗口中的“外部”&&window.external&&window.external.msIsSiteMode（）中的“msIsSiteMode”！==不支持未定义和IENotification | |/*通知。返回虚拟构造函数*/
Dummy通知；
/**
*@constructor dummy通知
*/
函数DummyNotification（）{
var dummeyelement=document.createElement（“div”）；
this.addEventListener=函数（eventName，回调）{
addEventListener（eventName，callback.bind（this））；
};
this.removeEventListener=函数（eventName，回调）{
removeEventListener（eventName，callback.bind（this））；
};
this.dispatchEvent=函数（eventName）{
if（eventName的类型！=“字符串”）{
返回；
}
试一试{
dispatchEvent（新事件（eventName））；
}捕获（e）{
var event=document.createEvent（“事件”）；
initEvent（eventName，false，true）；
DummeyElement.dispatchEvent（事件）；
}
};
}
Object.defineProperty（DummyNotification，“权限”{
可枚举：正确，
get:function（）{
不支持返回权限；
}
});
Object.defineProperty（DummyNotification，“requestPermission”{
可枚举：正确，
可写：对，
值：函数（回调）{
回调（this.permission）；
}
});
/**
*@iNotification
*/
功能IENotification（标题、选项）{
DummyNotification.call（this）；
var notificationIndex=IENotificationIndex；
对象。定义属性（此{
关闭：{
值：函数（事件）{
if（notificationIndex==IENotificationIndex）{
window.external.msSiteModeClearIconOverlay（）；
//删除关闭事件
IECloseNotificationEvents.forEach（函数（事件）{
window.removeEventListener（事件，this.close）；
}.约束（这个）；
此。dispatchEvent（“单击”）；
本次发布事件（“关闭”）；
notificationIndex=null；
}
}.绑定（此）
}
});
//清除任何以前的图标覆盖
这个。关闭（）；
//设置图标
如果（此.icon）{
window.external.mssiteModesectionOverlay（getIco（this.icon）、this.description | | this.title）；
}
//闪烁图标
window.external.msSiteModeActivate（）；
//触发显示事件
本次派遣活动（“展会”）；
//将关闭事件附加到窗口
IECloseNotificationEvents.forEach（函数（事件）{
window.addEventListener（事件，this.close）；
}.约束（这个）；
//增量通知索引
notificationIndex=++IENotificationIndex；
}
Object.defineProperty（IENotification，“权限”{
可枚举：正确，
get:function（）{
var isTabPinned=true；
返回isTabPinned？已授予权限：权限被拒绝；
}
});
Object.defineProperty（IENotification，“requestPermission”{
可枚举：正确，
可写：对，
值：函数（回调）{
返回新承诺（功能（解决、拒绝）{
if（this.permission===权限被拒绝）{
警报（此.PERMISSION\u REQUEST\u消息）；
}
解决（本许可）；
}.约束（这个）；
}
});
Object.defineProperty（IENotification，“权限\请求\消息”{
可写