chrome 通知功能使用实践

/**
 * 提示启用通知功能
 */
function allowNotice() {
	if (window.webkitNotifications) {
		window.webkitNotifications.requestPermission();
	}else{
		alert('放弃');
	}
}

/**
 * 桌面通知
 * @param {Object} imgURL
 * @param {Object} audioURL
 * @param {Object} title
 * @param {Object} body
 */
function notify(imgURL, audioURL, title, body) {
	if (window.webkitNotifications) {
		if (window.webkitNotifications.checkPermission() == 0) {
			imgURL = imgURL || '/images/logo.jpg';
			audioURL = audioURL || '/images/beep.mp3';
			var img = new Image();
			img.src = imgURL;

			var msgWindow = window.webkitNotifications.createNotification(img.src, title, body);
			new Audio(audioURL).play();
			setTimeout(function(){
				msgWindow.cancel();  //这里也可以使用cancel方法
			}, 10000);
			msgWindow.show();
        } else {
			window.webkitNotifications.requestPermission();
			return;
		}
	}else{
		if(window.Notification) {
			if (!(!!window.Notification && window.Notification.permission === "denied")) {
				imgURL = imgURL || '/images/logo.jpg';
				audioURL = audioURL || '/images/beep.mp3';
				var img = new Image();
				img.src = imgURL;
				var notify = new Notification(
			            title,
			            {
			            	icon : imgURL,
			                //tag : title,
			                body : body
			            });
				new Audio(audioURL).play();
				//for (var i in notify) document.writeln(i + ' : ' + notify[i]);
				setTimeout(function(){
					notify.close();
				}, 10000);
				notify.onclick = function(event){
					//location.href = "/wxbackend/Order/orderList";
					//window.open('/wxbackend/Order/orderList');
			        notify.close();
			    };
			}else{
				alert("请启用浏览器的订单通知功能");
			}
		}else{
			alert("浏览器不支持订单通知");
		}
	}
}
/*if(img.complete) {
    alert('该图片已经存在于缓存之中,不会再去重新下载');
}else{
    alert('图片不存在缓存之中');
    img.onload = function() {
        alert('图片下载成功!');
    }
}
var msg = new Audio('/images/beep.mp3');
for(var i in msg) document.write(i + ' : ' + msg[i] + '<br>');*/

/**
 * 订单提醒
 * @param {Object} flag
 */
function orderNotice(flag, imgURL, audioURL){
	url = flag == 1 ? '/wxbackend/order/OrderNotice/flag/1' : '/wxbackend/order/OrderNotice';
	$.post(url,function(data){
		if(data != ''){
			var jsonData = JSON.parse(data);
			var body = '新订单' + jsonData.new_orders + ' 即将发货的订单' + jsonData.new_orders_ship;
			notify(imgURL, audioURL,'订单通知',body);
			/*var ship_order = jsonData.ship_order_id;
			for (var i = 0; i < ship_order.length; i++)
				document.getElementById('orderID'+ship_order[i]).setAttribute('class','danger');*/
		}
	}, 'text');
}

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-12 20:02:26

chrome 通知功能使用实践的相关文章

Keepalived高级使用(工作原理和状态通知功能)

1.介绍 Keeaplived主要有两种应用场景,一个是通过配置keepalived结合ipvs做到负载均衡(LVS+Keepalived),有此需求者可参考以往博文:http://lizhenliang.blog.51cto.com/7876557/1343734.另一个是通过自身健康检查.资源接管功能做高可用(双机热备),实现故障转移. 以下内容主要针对Keepalived+MySQL双主实现双机热备为根据,主要讲解keepalived的状态转换通知功能,利用此功能可有效加强对MySQL数据

意想不到的chrome调试功能

没想到chrome的功能如此强大,绝非仅能使用console.log而已,碰到如此好文必定收藏,感谢大神,本文原创地址为:http://www.cnblogs.com/Wayou/p/chrome-console-tips-and-tricks.html,记在此处鞭策自己努力进取! Chrome的开发者工具已经强大到没朋友的地步了,特别是其功能丰富界面友好的console,使用得当可以有如下功效: 更高「逼格」更快「开发调试」更强「进阶级的Frontender」 Bug无处遁形「Console大

配置 SQL Server 2008 Email 发送以及 Job 的 Notification通知功能

SQL Server 2008配置邮件的过程就不写了,网上的案例太多了. http://www.cnblogs.com/woodytu/p/5154526.html 这个案例就不错. 主要写下配置完后的错误处理: 数据库邮件故障微软官网: 1. sql server 2008 阻止了对组件‘Database Mail XPS’ 在 msdb 数据库中运行如下代码: EXEC sys.sp_configure N'show advanced options', 1 RECONFIGURE WITH

Zabbix的通知功能以及自定义脚本告警

本节内容: Zabbix的通知功能 定义接收告警的用户 定义Action Zabbix自定义脚本发送报警邮件 一.Zabbix的通知功能 在配置好监控项和触发器之后,一旦正常工作中的某触发器状态发生改变,一般意味着有异常情况发生,此时通常需要采取一定的动作(action),如告警或者执行远程命令. 实现zabbix的通知功能,一般需要两个步骤:定义所需的"媒介"和配置一个"动作". 媒介类型有:E-mail,SMS,Jabber和自定义的通知脚本.我这里就使用E-m

jenkins配置邮件通知功能以及破解管理员密码

笔记内容:jenkins配置邮件通知功能以及破解管理员密码笔记日期:2018-02-27 26.6 jenkins邮件设置 26.7 插件email-ext 26.8 破解jenkins管理员密码 26.6 jenkins邮件设置 打开Jenkins的web页面,点击 系统管理 -> 系统设置 -> Jenkins Location ,先设置系统管理员邮件地址,这里的系统管理员邮件地址需要和后续要设置的发送邮件的地址一致: 然后再往下拉,找到 "邮件通知" 那一栏,填写SM

[Tips] 禁止Chrome多功能栏Google搜索跳转至hk

Chrome浏览器很好用啊,就是在多功能栏里面用Google搜索总是跳转到hk有点不爽.禁止其跳转的方法如下: 打开设置,找到搜索引擎设置,自己添加一个搜索引擎,名称啥的都随便写,主要是最后一个地址: 使用google hk 请填写:https://www.google.com.hk/#safe=strict&q=%s 使用google en 请填写:https://www.google.com/ncr#safe=strict&q=%s 当然,其它国家也是可以的,如日本:https://w

Android N 多窗口布局 省电模式 全新通知功能

今年google 16 i/o 强势推出 android n 迄今为止还没有给他命名.有兴趣的可以登录网站 https://www.android.com/versions/name-n/ 会中提到android N 运行环境有很大提升,30%到600%提升.应用安装提速75%. AndroidN 新增Vulkan 现代3D图形API.实现高帧率游戏,即时应用 OK.好东西用了才知道.那么如何运行Android N呢 会学到什么 多窗口布局互动 确保后台服务继续工作,而打盹模式激活 更新通知,以

WordPress添加评论回复邮件提醒通知功能

评论回复后,自动发一封邮件提醒评论人,是提高用户体验的一大举措.倡萌一直都在使用Willin Kan大师的评论回复邮件提醒通知代码,相信很多人也在使用,如果你还没有使用,不妨试试. 根据自己的需要,选择一种自己需要的代码,添加在主题的 functions.php 或者 pluggable.php(推荐) 文件的 最后一个 ?> 前面即可: 方法一:所有回复都发送邮件通知 默认所有填写了邮箱的评论都将发邮件提醒评论人,没有任何勾选设置. /* comment_mail_notify v1.0 by

关于chorme 通知功能

1.先判断当前的浏览器是否支持开启桌面通知 window.webkitNotifications: 2.响应用户操作,如果用户之前已经允许本站的桌面通知,则window.webkitNotifications.checkPermission()会返回0: 3.如果用户之前拒绝或是未允许开启桌面通知,可使用window.webkitNotifications.requestPermission(callback);再次弹出询问用户的提示,否则当用户之前拒绝过,按钮点击了也是不会有响应操作的. 注: