Real-time communication

Source: Internet
Author: User

After the last long vacation in 2018, see the beginning of the year to their flag, silently found the sense of distance is very strong ....

First of all, in the project recently encountered the need for real-time communication, looked at a lot of information, the final selection of SIGNALR.

Attached link HTTPS://WWW.ASP.NET/SIGNALR

The project is based on the ANGULAR4, and the backend uses the ABP framework, which comes with a notification architecture. (Https://aspnetboilerplate.com/Pages/Documents/Notification-System)

First of all, how to introduce SIGNALR into the project.

1. NPM I signalr

Introduced in the Angular-cli.json file: ". /node_modules/signalr/jquery.signalr.js "

2. Establish the connection

var connection = $.hubconnection ();
var contosochathubproxy = Connection.createhubproxy (' Contosochathub ');
Contosochathubproxy.on (' Addcontosochatmessagetopage ',functionName, message) {
Console.log (name +"+ message);
});
Connection.start (). Done (function () {
     //wire up Send button to call Newcontosochatmessage on the server.
    $ ( ' #newContosoChatMessage '). Click (< Span class= "Hljs-keyword" >function () {
         Contosochathubproxy.invoke ( ' Newcontosochatmessage ', $ ( Span class= "hljs-string" > ' #displayname '). Val (), $ ( ' #message '). Val ());
        $ ( ' #message '). Val (                });
   });

3. Back-end mates

The backend is primarily cross-domain, and Microsoft's official documentation also says how to solve it (https://docs.microsoft.com/en-us/aspnet/signalr/overview/guide-to-the-api/ Hubs-api-guide-javascript-client#how-to-establish-a-cross-domain-connection)

4. Basic code:Using Microsoft.AspNet.SignalR;
Using Microsoft.Owin.Cors;
Using Owin;
NamespaceMyWebApplication
{
PublicClassStartup
{
PublicvoidConfiguration (Iappbuilder app)
{
Branch the pipeline here for requests so start with "/SIGNALR"
App. Map ("/SIGNALR", map =
{
Setup the CORS middleware to run before SignalR.
By default this would allow all origins. You can
Configure the set of Origins and/or HTTP verbs by
Providing a cors options with a different policy. Map. Usecors (Corsoptions.allowall);var hubconfiguration =New Hubconfiguration
{
You can enable the JSONP by Uncommenting line below.
JSONP Requests is insecure but some older browsers (and some
Versions of IE) require JSONP to work cross domain
Enablejsonp = True
};
//Run the SignalR pipeline. We ' re not using MAPSIGNALR
//Since this branch already runs under the "/SIGNALR"
//path.
Map. RUNSIGNALR (hubconfiguration);
});
}
}
}

The basic part is very simple and transparent

In the message processing this piece, the ABP has already handled very well, as long as the corresponding method can be adjusted. Distinguish the timeliness of a message (a temporary message or a permanent message).

Real-time communication

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.