Browser desktop notifications)

Recently, I am working on the background management system of the company. When there is a task, I need to notify the client, but the client may be doing something else, and the browser may be minimized, this makes it difficult to see notifications. It is found that some browsers can use noitfications. You can display a prompt box in the notification area of the desktop and display it at the beginning of the desktop, which is easy to see. I simply encapsulate it to conform to common application scenarios.
The function is similar to webQQ Message notification.

Project address: https://github.com/rentiansheng/notification

Introduction to chrome desktop notifications

Used for Network Office reminders in other B/S.
Send notifications when the page is minimized
The content is still displayed in the lower right corner of the screen.

Dependency

1. PC chrome browser.
2. Mobile android dolphin Browser

Notes

The notification permission is based on the website (or domain name). Only one permission is required for the page under the same website.
If not. Will not show pass

Set-> privacy settings select the following content settings-> notification

You cannot obtain the permission again.
You can view permissions in the same menu as that in the browser.

Set-> privacy settings select the following content settings-> notification

If you close or refresh the page. The previous notifications cannot be controlled.

Use

1. Reference the notify. js File

   
   
   

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

2. Browser configuration

   Check whether the browser supports the desktop notification function

   
   
   

   Notifier.HasSupport();

   
   
   

   Get desktop notification permission

   
   
   

   Notifier.RequestPermission();

3. Set the notification display mode (optional. If this parameter is not set, the default mode is used)

   
   
   

   Notifier. ModelAll (); // default mode. All are displayed. In linux, there are generally three. The window is displayed in the notification area. Notifier. modelUpdate (); // update mode, where the last notification is located, Notifier. modelCount (c); // limit the number of notifications displayed on the current page. The default value is three (you can change the number through the c parameter ). When the limit is exceeded, the earliest notification is disabled. NOtifier. ModelTimeout (ct); // The timeout mode disappears. Automatically disappears after a certain period of time.

4. Send notification

   
   
   

   Notifier. Y (icon, title, message); // display desktop notifications. icon: Image address title: Notification title message: Notification content

5. Closing Method

   
   
   

   Notifier. clse (type); // type = 1 close the previous Notifier that was first opened with another value. closePre (); // close the Notifier of the last opened notification. closeLast (); // close the NOtifier of the earliest display notification. closeAll (); // close all notifications

6. Other methods

   
   
   

   Notifier. getPermission (); // obtain the permission to use the notification. The value 0 indicates that permission 1 has been obtained. You must obtain permission 2. Notifier is forbidden. isGetPermission (); // whether the user permission for the notification has been obtained Notifier. disable (); // whether to Disable notifications