Notification web 桌面消息推送
var NotificationHandler = {
isNotificationSupported: 'Notification' in window,
isPermissionGranted: function () {
return Notification.permission === 'granted';
},
requestPermission: function () {
if (!this.isNotificationSupported) {
console.log('当前浏览器不支持Notification API');
return;
}
Notification.requestPermission(function (status) {
var permission = Notification.permission;
});
},
showNotification: function (Title, ImgUrl, Content, Tag) {
if (!this.isNotificationSupported) {
console.log('当前浏览器不支持Notification API');
return;
}
if (!this.isPermissionGranted()) {
Notification.requestPermission(function (permission) {
// 如果用户同意,就可以向他们发送通知
if (permission === "granted") {
var n = new Notification(Title, {
icon: ImgUrl,
body: Content,
tag: Tag,
requireInteraction: true
});
n.onshow = function () {
};
//消息框被点击时被调用
//可以打开相关的视图,同时关闭该消息框等操作
n.onclick = function () {
alert(1);
//n.close();
};
//当有错误发生时会onerror函数会被调用
//如果没有granted授权,创建Notification对象实例时,也会执行onerror函数
n.onerror = function () {
//do something useful
};
//一个消息框关闭时onclose函数会被调用
n.onclose = function () {
stopSound();
UpdateIsRead(n.tag);
};
}
});
} else {
var n = new Notification(Title, {
icon: ImgUrl,
body: Content,
tag: Tag,
requireInteraction:true//设置为true 那么关闭就只有是用户来关闭 这样就可以保证是用户操作 (缺点 必须要用户去操作一次)
});
n.onshow = function () {
};
//消息框被点击时被调用
//可以打开相关的视图,同时关闭该消息框等操作
n.onclick = function () {
//alert(1);
//n.close();
};
//当有错误发生时会onerror函数会被调用
//如果没有granted授权,创建Notification对象实例时,也会执行onerror函数
n.onerror = function () {
//do something useful
};
//一个消息框关闭时onclose函数会被调用
n.onclose = function () {
stopSound();
UpdateIsRead(n.tag);
};
}
}
};
Notification web 桌面消息推送的更多相关文章
- 【Html5】Html5新特性Notification实现桌面消息推送(2016-05-25)
序:最近工作使用WorkTile,发现使用Chrome浏览器的时候如果有任务下发给我则会在桌面右下角提示(当前浏览器为最小化模式).感觉这个东西蛮有意思的,感觉可以给用户更好的体验,于是乎就查询了一下 ...
- Socket.io+Notification实现浏览器消息推送
前言 socket.io: 包含对websocket的封装,可实现服务端和客户端之前的通信.详情见官网(虽然是英文文档,但还是通俗易懂).Notification: Html5新特性,用于浏览器的桌面 ...
- SSE(Server-sent events)技术在web端消息推送和实时聊天中的使用
最近在公司闲着没事研究了几天,终于搞定了SSE从理论到实际应用,中间还是有一些坑的. 1.SSE简介 SSE(Server-sent events)翻译过来为:服务器发送事件.是基于http协议,和W ...
- 我有 7种 实现web实时消息推送的方案,7种!
技术交流,公众号:程序员小富 大家好,我是小富- 我有一个朋友- 做了一个小破站,现在要实现一个站内信web消息推送的功能,对,就是下图这个小红点,一个很常用的功能. 不过他还没想好用什么方式做,这里 ...
- VDN For PB Web实现消息推送
利用VesnData.Net(VDN)的互联网数据驱动功能我们实现了PB连接互联网数据库的功能.在互联网开发的过程中我们往往有些消息或者数据希望即时能够通知到各个客户端,现在比较流行的一种技术就是消息 ...
- Notification 浏览器的消息推送
Notification 对象,存在于window上,可以生成一个通知对象以推送推送浏览器消息通知. 这玩意兼容性不咋地,实不实用看场景.对外用户的应用,自然是鸡肋功能,因为你无法知道用户使用的是哪家 ...
- web消息推送-goesay
原文:http://www.upwqy.com/details/22.html 1 GoEasy简介: GoEasy - Web实时消息推送服务专家 最简单的方式将消息从服务器端推送至客户端 最简单的 ...
- IOS - 消息推送原理和实现
一.消息推送原理: 在实现消息推送之前先提及几个于推送相关概念,如下图1-1: 1.Provider:就是为指定IOS设备应用程序提供Push的服务器,(如果IOS设备的应用程序是客户端的话,那么Pr ...
- iOS 消息推送原理及实现Demo
一.消息推送原理: 在实现消息推送之前先提及几个于推送相关概念,如下图1-1: 1.Provider:就是为指定IOS设备应用程序提供Push的服务器,(如果IOS设备的应用程序是客户端的话,那么Pr ...
随机推荐
- SSM框架中常用的配置文件
学习框架,刚开始的时候最烦的就是一些配置文件,有很多需要配置的东西,今天把这些配置文件信息稍微整理一下,以后说不定会用的到. web.xml文件 <?xml version="1.0& ...
- yii2的csrf验证原理分析及token缓存解决方案
本文主要分三个部分,首先简单介绍csrf,接着对照源码重点分析一下yii框架的验证原理,最后针对页面缓存导致的token被缓存提出一种可行的方案.涉及的知识点会作为附录附于文末. 1.CSRF描述 C ...
- C - 树的统计Count - 树链剖分
思路 :树剖模板,线段树维护即可. #include<bits/stdc++.h> using namespace std; #define MID int m = (l+r)/2 #de ...
- flask + MySQL-python 创建 webapp 应用
0 - python 用自带的 wgsi 也可以创建 web 服务1)建立 hello.py 内容如下 # hello.pydef application(environ, start_respons ...
- Python学习笔记整理(python 3)
一.tuple(元组) tuple和list非常类似,但是tuple一旦初始化就不能修改,如: classmates = ('Michael', 'Bob', 'Tracy') 1 classmate ...
- 图片懒加载、selenium和PhantomJS
1.图片懒加载 1.1 概念及实现原理 图片懒加载是一种网页优化技术.图片作为一种网络资源,在被请求时也与普通静态资源一样,将占用网络资源,而一次性将整个页面的所有图片加载完, 将大大增加页面的首屏加 ...
- __x__(8)0906第三天__乱码问题
需要知道: 计算机只认 0 1 任何内容,计算机都会以 0 1 去存储 所以 0 1 与内容的编码方式/解码方式需要依照一定的规则,实现 0 1 与内容之间的转换. 字符集:一定的规则,由编码/解码采 ...
- Python基础之数据基本运算
一.核心数据类型(五种): 在Python中变量没有数据类型,但关联的对象有数据类型,可通过type函数查看数据类型 1.整型(Int): 包含正整数,负整数和零 二进制:逢二进一,书写格式为 a = ...
- 如何将两个PDF文件合并到一个页面中
在目前职场办公中,很多使用的文件格式是PDF文件格式,由于工作的需要,经常需要将PDF文件合并在一起,但由于PDF文件不能直接编辑修改,不能OFFICE,WPS那样,通过复制粘贴将两者合并,那如何解决 ...
- F#周报2019年第10期
新闻 .NET Core 3预览版3之宣告 .NET Core 3.0将在2019年下半年发布 .NET Standard 2.1的首个预览版 Docker与cgroup的内存限制 LambdAle ...