近期在做公司后臺管理系統，當有任務到來時，須要通知當事人，可是 當事人有可能在做別的，瀏覽器有可能會被最小化，這樣就非常難看到通知了。經過查找發現有些瀏覽器能夠使用noitfications。能夠在桌面的通知區域內顯示一個提示框，而且顯示在桌面的最前面，非常方便就能看到了。我就將它簡單的封裝一下，使其符合經常使用的使用場景。
功能效果類似webQQ的消息提示通知。

項目地址：https://github.com/rentiansheng/notification

chrome
瀏覽器桌面通知

簡單介紹

用于其余B/S下的網絡辦公提醒功能。
頁面最小化的狀態下發送通知
依舊顯示在屏幕的右下角，立即能夠看到內容

依賴

PC chrome瀏覽器。
手機android 海豚瀏覽器

注意事項

通知權限是基于站點（或者域名），同一個站點以下的頁面僅僅須要獲取一次權限就可以。
假設別禁用了。將不會顯示通

設置-》隱私設選以下的 “內容設置”-》通知

知的，也無法再次獲取權限了。
能夠同瀏覽器的菜單查看權限。

設置-》隱私設選以下的 “內容設置”-》通知

假設你關閉或者刷新頁面了。之前的通知就沒法控制了 。

使用

引用notify.js文件

<script src="notifiy.js"></script>

瀏覽器配置

檢查瀏覽器是否支持桌面通知功能

Notifier.HasSupport();

獲取同意桌面通知權限

Notifier.RequestPermission();

設置通知顯示方式（可選。不設置採用默認模式）

 Notifier.ModelAll();       //默認方式，顯示全部的。在linux一般為三個。在window顯示在通知區域。
 Notifier.ModelUpdate();    //更新模式，顯示在上一個通知的位置，
 Notifier.ModelCount(c);    //限制當前頁面顯示的通知個數，默覺得三個(能夠通過參數c改變個數)。超出限制時關閉最早的通知，
 NOtifier.ModelTimeout(ct); //超時消失模式。顯示一定時間自己主動消失。

發送通知

Notifier.Notify(icon, title, message); //顯示桌面通知，icon：圖片的地址  title:通知的標題 message：通知的內容

關閉的方法

 Notifier.Clse(type);    //type=1 關閉上一個 其它值 關閉最早打開的
 Notifier.ClosePre();    //關閉近期個打開的通知
 Notifier.CloseLast();   //關閉最早顯示的通知
 NOtifier.CloseAll();    //關閉全部通知

其它方法

Notifier.GetPermission();   //獲取關于通知使用權限，0，已經得到權限 1，須要獲取權限 2，禁止使用
Notifier.IsGetPermission(); //是否已經獲取通知的使用權限
Notifier.Disable();         //是否禁用通知

總結

以上是生活随笔為你收集整理的浏览器桌面通知（notifications）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。