[SignalR of Asp.net Development Series] Topic 6: Use SignalR for Message notification, asp. netsignalr

Source: Internet
Author: User
Tags inotify

[SignalR of Asp.net Development Series] Topic 6: Use SignalR for Message notification, asp. netsignalr
I. Introduction

In the previous article, I introduced how to use SignalR to transmit images. Then, message reminders are essential for instant messaging applications. Many websites now have the reminder feature for new messages. Naturally, this function is indispensable for the SignalR series. This article describes how to use the SignalR + iNotify library to implement the sound and pop-up notifications of new messages.

II. Implementation of message reminders

A message reminder is a pop-up notification in the lower right corner of the client when the customer has a new message. The idea for implementing this function is:

Iii. Specific implementation code

The specific implementation code here is based on the Code of the second article, on which the JS Code for message reminder is added.

Here, we need to first introduce the INotify library JS file on the Index. cshtml page. That is:

  <script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script>    <script src="~/Scripts/jquery.signalR-2.2.0.min.js"></script>    <script src="~/signalr/hubs"></script>    <script src="~/Scripts/layer/layer.min.js"></script>    <script src="~/Scripts/iNotify.js"></script>

Then add the following JS Code to the javaseprivatemessage method.

Var active = true; window. onfocus = window. onblur = function (e) {active = (e | event ). type = "focus" ;}; // receive the message systemHub. client. export eprivatemessage = function (fromUserId, userName, message) {// code iN Topic 2 // code of message reminder if (active = false) {var iN = new iNotify ({effect: 'flash', interval: 500, audio: {file: ['/Music/msg.mp3']}, notification: {title: "notification! ", Body: 'You have a new message'}); iN. setTitle (true ). player (); iN. setFavicon (true ). setTitle (true ). notify ();}};}

After the above two steps, the new message sound and pop-up reminder are complete, but this pop-up box function does not support IE browser, because the pop-up effect is implemented using the Html5 Notifination API, this feature is not supported in IE browser, so it cannot be implemented. As a result, we can see that Microsoft's IE browser is really a pitfall, So Microsoft decisively gave up it and launched Edge. I have not tried it myself, but many friends commented that it is still a pitfall.

Next, let's take a look at the specific running effect.

Iv. Summary

At this point, the content of this article is over. After this blog post, the SignalR series will come to an end. Next we may share some series or architecture design series related to Asp.net MVC. Please pay more attention and support.

Download all source code in this article: signalrmessagenoworkflow

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.