HTML5桌面通知：notification api

1. 为什么需要HTML5的桌面通知

传统的桌面通知可以写一个div放到页面右下角自动弹出来，并通过轮询等等其他方式去获取消息并推送给用户。这种方式有个弊端就是：当我在使用京东 进行购物的时候，我是不知道人人网有消息推送过来给我的，而必须要等我把当前页面切到人人网才知道有消息推送了。这种方式的消息推送它是基于页面存活的， 但是我们需要这么一种策略：无论你在看哪个页面，只要有消息都应该能推送给我看到，这就是webkitNotification要解决的问题。 Notification生成的消息不依附于某个页面，仅仅依附于浏览器。

2. 一个桌面通知生成的正常流程

我们先来看看一个桌面通知是如何生成的：

3. notification api基础说明及代码示例

目前notification的实现有两种：一种是之前草案中的形式：webkitNotifications对象, 另一种就是未来标准化的形式:Notification对象。首先来说一下webkitNotifications所包含的内容：

3.1 webkitNotifications：

3.1.1. 静态方法

PS:调用以上方法都会存在安全异常，也就是当前页面的permission是否为0。

3.1.2. 实例方法

3.2 Notification:

在chrome26+ 终端里面输入window.Notification并键入回车键，会发现这东西它也是存在的，根据某些博客的说法，这个Notification会是 webkitNotifications的标准化形态（传说中的进化），这种方式的实现相对于webkitNotifications的实现更简洁，更面 向对象一些。 构造函数：

3.2.1. 属性

静态属性:
Notification.Permission:


Test:在chrome的地址栏里面输入http://www.baidu.com, 打开console，并在里面输入Notification.Permission 默认返回的是'default'.


实例属性：
以下属性都需要在Notification实例上才能访问，为只读属性，并且就是通过option来赋值

3.2.2 方法

静态方法
Notification.requestPermission() ``` //该方法将会询问用户是否允许显示通知 ``` 该方法不能由页面自主调用，必须由用户主动事件触发，还是以百度的页面为例，百度的搜索框的id为'kw'：

```Javascript //通过用户主动事件触发来调用 document.getElementById('kw').onclick=function(){ Notification.requestPermission(); }; //页面信息栏会弹出询问用户是否允许显示桌面通知

```



实例方法

3.3 代码示例

以下代码将展示如何使用webkitNotification和Notification来显示桌面通知

3.3.1 webkitNotification

3.3.2 Notification

4. 参考文档