In this post i will be talking how we can use signalR for real time web application with a demo chat application.
If you are reading this post and don't know about installing the required files please have a look at my previous post.
http://mesushil.blogspot.com/2013/04/introducing-signalr.html
here i am modifying the default asp.net template about.aspx page for the demo.
Firstly include the script in the .aspx page .
the second js i have included here is the js downloaded by the nuget.
the third file is generated at run time including the hubs declared in the server.
check the browser to ensure these files are loaded in the browser.
the image above is the part of hubs.js generated dynamically.
now lets create hub in the server.for this lets include a class file to the solution.
To create the hubs in server add the namespace as the first two lines above.
hubName in line 9 is what we will be referring in client side js to communicate with the server.
and the next is the method which i will invoke from client side to notify all the users connected to the hub.
now moving to the client side.
referring the image above:
firstly we need bind the hub we have created in the server(line 31).
then to communicate with the server hub we need to establish connection(line 35).
after we have connected with the hub we are ready to communicate with the server.
(line 46) invokes the BroadCast message in the server and here i have passed two parameters.
similarly ,the server can also invoke the method in the client .
(line 49) is invokable by the server.
If you refer to the second image the client method is invoked from the server side.
i.e when an event occurs in the sever side the server is able to push messege to the client.
but remember don't have the same methods in client and server.
That's all we need to achieve the real time functionality using signalR.
I haven't described the different terms in signalR and the transportation available
but hope this helps you go with a functional start.
The demo project is hosted in github and you can download it from here:
https://github.com/zeewons/SignalRDemo
Reference:
https://github.com/SignalR/SignalR/
This post is based on my knowledge and may not be the accurate solution or may change over time.
comments are welcome
Thanks for your time.
Regards,
sushil
Comments
Post a Comment