桌面通知功能能够让浏览器即使是最小化状态也能将信息通知给用户,这和WebIM是最为天然的结合。
1.先判断浏览器支持情况
alert(Boolean(window.Notification)); //返回true即支持,经测试目前IE不支持
2.判断是否开启权限
if (Notification.permission==='granted') {
...... //支持则执行代码
} else {
Notification.requestPermission(); //否则弹出开启权限提示框
}
3.设置提示内容
var notify = new Notification( 'title' , config );
//config是一个对象,有5个属相,可以设置显示内容
var config = {
body :'正文内容',
dir : '文本显示方向,auto, ltr, rtl',
lang : '文本语言',
tag : '为通知栏分配一个id,方便对提示操作,检索,替换,移除等',
icon : '图片url'
}
4.可设置其他功能,如提示框消息点击事件(notify是实例化出来的对象)
notify.onclick //点击提示框时触发
notify.onshow //显示提示框时触发
notify.onerror //显示提示框出错时触发
notify.onclose //关闭提示框时触发
5.关闭通知实例的方法
setTimeout(notify.close(),5000);