Intro to SignalR in C# Part 1 - using Blazor, WPF, best practices, and more
Вставка
- Опубліковано 24 кві 2022
- SignalR is an excellent way to connect two or more clients together for real-time communication. The best part is that this library is just a wrapper around web-standard technologies such as Web Sockets and Long-Polling. It just makes them easier to use. That means we can even use SignalR with other clients such as Java or JavaScript. In this video, we are going to learn how to set up SignalR and how to connect to it using web clients and desktop clients. Throughout the video, we will cover best practices, as well as how to use this in the real world.
Full Training Courses: IAmTimCorey.com
Source Code: leadmagnets.app/?Resource=Int...
Mailing List: signup.iamtimcorey.com/
I wish I had this tutorial a year ago when i was banging my head against the wall to make it work. Thank you so much Tim. You are a precious asset for the entire dev community.
You are welcome.
One of the best tutorials I have ever come across - Tim has a super pleasant voice and manner and the whole thing moves at exactly the right pace
Thank you!
Thanks Tim! I've half understood signalR and this has really helps concreate my understanded. Perfectly delivered, perfect pace. I really appocate your hard work in creating this free content. You have, for sure been a sigificate part of my Software Developer journey.
Great to hear!
This is one of the best SignalR explanation that I have run across online. Thanks Tim and please keep on teaching us all the cool stuffs...
You are welcome.
Loved learning new stuff here in this channel. Great efforts. Thanks, Tim 🙏
You are welcome.
This is a great piece and it is still gold after I learned Signal R already. This gave me great perspective and it is in one piece all things considered. Thank you very much.
Excellent! I’m glad it was helpful.
Glad to see signalr getting some love. I've been using it for 5-6 years now and it has come a long way!
Great to hear!
Very well done. Good explanations of complex topic and especially good at showing the specific pieces that make things work. You really are pretty good at this.
Thank you!
Thank You Tim.. Finally SignalR Guide is here.. I have waited for this long time.
You are welcome.
Thanks I always wanted see a video from you about how to use SignalR. Thanks for all your content.
You are welcome.
Had the question on the interview "have you familiar with SignalR". Yeah, I have :)
Thanks for video! I'll wait for part two.
You are welcome.
I am looking forward to hearing some of your insight on SignalR security and authenticated user to user communication.
Good to know.
Already using signalR for one year , but I am so excited to see your video
Great!
Once again an excellent tutorial. Your tutorials can be long but for that they are detailed and very easy to follow. Some tend to talk way to fast and it can be a pain to follow along. Thank you. Now I can upgrade the multi user application I have created.
You are welcome.
Thank you for taking my earlier comment (11 months ago under your video "C# Async / Await - Make your app more responsive and faster with asynchronous programming") into consideration of explaining the logic before just writing code.
You are welcome.
Fantastic tutorial and very well explained. I'm just an amateur, self-taught coder who likes doing little projects here and there. Needed this for one and really wasn't looking forward to it... 😅 You made it an absolute walk in the park. Thank you. 🙏
You are welcome. I am glad it was helpful.
This SignalR video is very nice :) I would love to see more of this content.
Thanks for your work on this Tim.
Glad you enjoyed it!
Wao much awaited topic SignalR by Best Tutor. Thank you so much.
You are welcome.
Thank you Tim for this tutorial. It's amazing how easy is 'this days' to create very powerfull applications.
A big thanks to all people working to improve dotnet.
You are welcome.
Best ever SignalR explanation, Thanks for you time & Great efforts 🙏
You are welcome.
Thanks for the Signal R video Tim. Just wanted this from you🤯🤯🤯
My pleasure!
Finally....SIGNALR💪. Thanks Tim.
You are welcome.
Waiting for part two ✌️
It would be great if you add signalr based by authentication
Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/
+1 Upvoted on Tim's suggestion site
I agree. I tried this awhile ago using Azure B2C and ended up having to make the hub anonymous because I couldn't figure out how to get the token to signalR hub
@@IAmTimCorey I went there and registered and upvoted this suggestion. What do the Statuses mean? They're for the most part self explanatory, but what does "Watching' actually mean? I thought for a second you somehow knew what videos I was watching and had completed.
You get from me a well deserved like button! Explained everything so beautiful nice. I really like the way you do it.
Thank you!
Very clear explanation, thanks Tim.
You are welcome.
Awesome crash course Tim, thanks!
You are welcome.
Great video. Looking forward to more on the subject.
Thanks!
Thanks Tim! Great Video!
I used web sockets to rebroadcast messages from my syslog server back out to web clients .. after watching this I may spend some time moving that to SignalR!
I am glad it was so helpful.
Yeah, long time no see, WPF... WPF need more love 😍
Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/
Tim, great tutorial. Thank you.
You are welcome.
Awesome tutorial! Thanks Tim!
You are welcome.
Long awaited tutorial on SignalR.
I hope you enjoyed it.
Exactly what i needed. Thank you.
You are welcome.
Awesome course! Thanks for the video
You are welcome.
Done a few Azure Serverless SignalR and it's really smooth sailing and fun!
Great!
Very well explained.
Thank you!
you never disappoint 👌👌😉😉
Thanks!
Great content like always.
I'm stuck with something, Tim Corey is here to rescue.
Thanks a ton Tim.
Very much Appreciate your effort to make these wonderful informative videos.
I am glad it was helpful.
This is great! Thank you!
You are welcome.
Great content, in fact your tutorial was enough to create the "counter" page part!
Excellent!
That was great, thank you very much for your content.
You are welcome.
Thank you very much Tim!!!
You are welcome.
Always great an easy 2 follow
Great to hear!
I've been using SignalR for the last 5 years or so in production apps. I'd like to add a best practice...
If any of the data going back and forth between clients is to be stored in a database, DO NOT send this data to the Hub from the client. Send the data to a controller just like you would any other data. Store the data in your DB, then broadcast that data out using the Hub. You want your Hubs to just relay data. You do not want your hubs to be the consumption endpoints for data. This is because Hub connections are not always reliable. And Hub connections will close after a period of time they are unused.
To use your hub throughout your backend app, you can inject an IHubContext into your services using DI and access the hub methods just like any other service.
Thanks for sharing. I'm curious as to what circumstances led you to this conclusion. I agree that calling a controller is the better option, but in general, you can also use the SignalR connection without issue. For instance, that's what Blazor Server does for all of its data storage calls. Having a call timeout is something that shouldn't happen with an actively-used client. Plus with the auto-reconnect, it should jump right back up when you try to use it in a disconnected state.
@@IAmTimCorey there were several reasons I wanted to do this. 1. It made all of our application structure consistent (all POST data goes through controllers). 2. It fit our development process, we had a guy that worked on hubs and another guy that works with data storage, for example. 3. We had connection issues (although this was minor). 4. Authentication. Sending the posted data through our controllers meant we used our normal request authentication. Which is via JWT tokens passed in an HTTP header. 5. It allowed us to broadcast system generated data. For example, our chat had system messages, and using the HubContext, system chat messages were broadcasted the same way user chat messages were broadcasted.
@@IAmTimCorey I just highly suggest implementing it this way to save yourself in the future. It's just a lot cleaner and more flexible.
Thanks for sharing.
Thank you Tim for SignalR video it was great, hope you do streaming or video communication user to user by SignalR.
Streaming video isn't really something that should be done via SignalR. There are other technologies out there that will do a better job.
Great video on signal R, really interesting how good it is at moving messages around. I still hate WPF though.
wow thank you for this sir🤗
You are welcome.
100% perfect timing..
Excellent!
Thanks man !!
You are welcome.
Very clear and helpful for learning the basics of SignalR. It was also very nice to see it in action with the desktop app. One thing I noticed was the double message at 1:09:38, why did this happen?
I had double-subscribed to the event, which is why it came through twice.
Hi Tim, after completed the course of MongoDB, SignalR is next pazzle I need to build a more complex application. Thank you. I am looking for a tutorial of combining SignalR to receive data, store to MongoDB and revert to other client in real time.
Thanks!
You are welcome.
Hey Tim! Excellent walkthrough! I am curious if there was a reason for using OnInitializedAsync Vs OnParameterSetAsync for the initial signalR connection?
"Any asynchronous operations, which require the component to re-render once they complete, should be placed in the OnInitializedAsync method." - from the documentation. Since the results of the call may put something on the page, which would cause the the component to re-render, we use the OnInitializedAsync method.
Thank you!!!!
Note it is not Setup.cs but Startup.cs
You are welcome. And yep, just a slip of the tongue.
Thanks for the great videos!
I'm wondering if you have a video about how to handle images (and other files) which are not stored in Database, but on a (private) cloud storage, like azure blob, S3 or similar. For example, do you provide only pre-signed URLs to the client, or should you handle the downloading and serving yourself? What are best practices here?
That sounds like this suggestion: suggestions.iamtimcorey.com/Details/6253bf2a0b6906f2d6876be7
Hi Tim, thank you for the video. Could please make a video about SinalR pricing on Azure, and the best potential hosting environments for publishing an app using SignalR with about 100 concurrent users using SignalR connection. Thanks
Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/
Need this too for a project currently in development
Tim thanks.Awesome lesson on SignalR.
Question:
Is it possible to send/receive other than string types i.e. complex data objects?
Yes it is. The next video will send ints, but you can send more complex types too.
I send objects through in a little app I'm playing with so yes it's possible.
Hi @IAmTimCorey, great video-- the question I had while watching this-- how does this compare to using an API project? Any advice on when you should use an API vs SignalR?
SignalR is for maintaining a constant connection to a server. It is primarily for real-time data communication. While it can be used like an API as well, it isn't the ideal use case. An API is useful for when you need information or want to give information. You only open the connection long enough to perform the action and then you close it down again.
The Man
Thanks.
I really admire and appreciate your work! We're so you stand regarding blazor on vs code?
VSCode is a great editor. If you can use Visual Studio, you will have more help (Intellicode, quick actions and refactoring, etc.), but VSCode is light, fast, and does not get in the way.
Hi Tim! Are the Blazor and SignalR suitable for video streaming? I'm trying to make a project with this feature using Blazor. The Chat is similar with the one you are developing in the video, but I can't figure out how to do with the video without using the JS client
Short answer to this is no. You should use WebRTC for streaming video. There are frontend libraries for making this simpler to setup (although it's still not trivial). Remember, SignalR uses WebSockets, which means your server plays a middle-man role. Whereas, WebRTC connects two clients directly and streams data between the two (you can use SignalR to orchestrate the connection between the two clients but you won't use SignalR for streaming video/audio between the clients). I created a live meeting feature in one of my apps using WebRTC and it works really well. It's works identical to Zoom or Skype.
Thanks for sharing @Andy!
Thanks Tim, I really like your best practices. I am new using SignalR and I try to make an interaction in real time between two players in a game, and including chat too, but a have a doutb: can I use two hubs (one for the chat and other for the interaction multiplayer) or just one to achieve the result?.
You could do either, but it is probably better to have one signal that transmits all of your data rather than two connections per client.
Ok Tim, I will try it, thank you.
Thanks Tim for another great video, do you have any plans about MAUI? do we see anything about it from you anytime soon?
I do. I've been holding off until it gets closer to launch.
@@IAmTimCorey That would be great, thanks for your efforts.
Tim, thank you so much for putting content like this together. Question from an architecture standpoint. Would SignalR be a good solution within an API? Within our business, we have a web app, an API, and several dozen clients (console apps) running at customer sites. Right now, whenever we want something communicated to the client from the web, it is broadcasted to the API -> database where the client can then pick up requests. Would SignalR be a good solution from the API perspective to broadcast these requests directly to the client machines, or would you recommend a different approach.
That could be the right solution if you need that communication channel open for real-time events. Just note that your clients will need to be connected to the API all the time. That probably isn't a problem, but I just wanted to mention it.
@@IAmTimCorey thank you! I appreciate the response!
Hi Tim, at the beginning of your video, around minute 2:30. You say "don't use core version, use not core versio which is more complete". But the core version package is bigger in size. How the core (onlky the basics) version could be bigger than the full version ?
Hi Tim.I want to thank you again for your explanation. I created the project following your video step by step. If I execute the server and the client (even the WPF one) on the same pc they works correctly. If I launch the client app (after changing the URI from localhost to the to the IP server) the connection fail (I have disabled the firewall on both pc too). Can you help me. Thank yuo.
Leonardo.
👍👍👍
Hi Tim, great video. So anyone can connect to the hub if they have the URL? is there a way to secure it?
Yes, you can add authentication and authorization to a SignalR hub.
Great video as always, but Is WPF even still relevant outside of maintaining legacy applications?
Absolutely. It is the best desktop app choice Microsoft has. It deploys to the most Windows platforms and, if you use Uno, you can deploy it to Mac, Linux, iOS, Android, and the web.
Tim, I can't thank you enough. Is there a video that shows us how to deploy SignalR?
To non-azure?
SSMS
No, there isn't.
Hi Tim, is there a way to wrap singalr inside REST endpoints. please share any link or video.
You mentioned in the video about doing a que. Can you show a sample of how a que would work. Because that can be helpful sometimes too where if there is a message but its not connected. Also, can you show how a person can do the following:
there are 2 clients. It needs to send to one client that is not there. however, once that client gets connected, then send to that client. Is that possible?
I'll add that to my suggestion list. It is possible.
Hello Mr Corey, how can we add ( html5 , css3,js pages created on other editors) pages to BLAZOR projects as front end pages or integrate in Visual studio ?
Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/
Hello Tim, thanks for this tutorial, am building a chat application using azureSignalR but the trouble comes when i want to go serverless so that i host the server on azure, how can i do that?
Azure has a SignalR service you can use.
Thanks for all. I don't understand why when I start the server, it listens on port 5001, while instead it should always assume a random port in its range, or connect to the port indicated in the Launchsettings.json, which in this case should be 7181. Thanks if you go answer me.
Hi Tim, probably such a question was already asked, but can you explain why you have got a duplicate message just at the end of the video, when you tested the manual reconnect. I faced the same problem and want to get an explanation. Probably it is wpf issue, because it's not reproducible in the console app, but anyway
I forgot to unsubscribe from the SendMessage event when the server disconnected. When it reconnected, I subscribed for a second time. Thus, the two messages (one from each subscription to the event).
Tim, can a server push signalR to clients when on the server something happens? I mean which tipe of project would you use for serverside? and the clients only listen to the server. thanks
Yes, when a connection is open, the server can talk to the client or the client can talk to the server.
Very nice tool and tutorial. Unfortunately You can't add its Server Side to a class Library and use it in a Clean Architecture.
If the structure of your architecture is such that you cannot use SignalR, you need to rethink your structure. Your structure should work for you, not work against you.
Hi Tim! Amazing tutorial as always. I am trying to create a simple app that utilizes two pages. On one I click on a and on the second the same appears. The app works fine on visual studio iis express and even when I publish and launch it from a custom folder on port 5000. When I try to host it so it is available on my lan using nginx my main page crashes the app. Any tips on how I could debug something like that? I am guessing it has to do with the configuration of nginx and how it deals with forwarding the signalr "messages" but I cant find a place to start. I know this is an old video but I could really appreciate your help. Thanks for the excellent content!
Very good tutorial. Can you send image as well?
I would recommend not doing that. Use an API to send an image. You can send a message to get an image from the API through SignalR, though.
lol, I hate guids too. Great tutorial
Thanks!
I actually found that AutoReconnection usually did not work too great. I use signal r quite a bit and found most cases it would always fail to reconnect. In many of my situations (with tablets), it will disconnect and the only fix is a person has to turn off the wifi and turn it back on again. The solution I found that worked was having more complex code where if you get disconnected, then you have to manually go back in again. However, the code is smart enough to connect to the right places.
Trying to demo autoreconnect using a website that is being debugged by Visual Studio doesn't really work. You need an independent and external client to show that off. If you try it with the WPF client, though, it works great because the WPF client is totally independent.
@@IAmTimCorey The cases where autoreconnect did not work so well is in this case.
The server was always opened. However, the client disconnected because they got disconnected from wifi. In that case, there was many times, it would fail to send message to server but the closed event never got called. In many cases a person is forced to manually turn off wifi and turn back on.
I'm very interested in creating a chat program with a dedicated server and making it cross platform and I'm very willing to take the time and learn so any ideas help links or courses I would love to hear
Красавчик, тащер
Thanks, I think.
But we could use insead of "hubConnection is not null" in the if-statement, the IsConnected property?
No, because you can have a closed connection. That isn't the same thing as a null hubConnection.
Yéeeeeeeeees!
🎉🎉
Thanks for the video, really helpful for my goal ;) But, as a beginner in web / dev I'm wondering if it's possible to host signalR Hub in IIS without having to launch the index page ? Do the same blazor server app, but do not open any webpage to start the Hub. i don'k know if its comprehensive. Thanks for help all ;)
Yes, you can host a SignalR service without it being a web app. Azure even provides something like that.
@@IAmTimCorey thanks ;) I succeed using topshelf, I created a windows service (thanks to another video from this channel)
And how to keep messages and show them back whenever for new client is connected?
@IAmTimCorey I am trying to create the equivalent of the WPF client in a console app in regards to your SignalR videos but am stumbling over the dependency injection part in regards to SignalR.
This is the error: "No constructor for type 'Microsoft.AspNetCore.SignalR.Client.HubConnection' can be instantiated using services from the service container and default values". Any help would be appreciated.
Hi,
I have an application in .NET 6 : Console Server WPF Client
I want replace Websocket by SignalR but how to self hosting the server in a standard console (or wpf) application ?
will we have a signalR based on some UI framework like angular or react and have SignalR as a separate application.
The SignalR server is going to be C#. However, the client can be just about anything (JavaScript, C#, Java, etc.)
@@IAmTimCorey Yes sir you are right, I was simply saying it would have been nice to have an approach which is mostly used in industry, the one you have given is also classic and quite amazing. If possible have a small tutorial for Signal R with react or Angular 🙂
Do you know how to implement login authentication like whatapps web using blazor server and SignalR ? if yes, can you make a tutorial video about this thank you :)
Is it possible for the server/hub to send a message only to a particular client? Every example I've looked at today, show this filtering done on the client side, which seems both wasteful and insecure.
It is. You base it on authentication or on the client ID (which can change).
@@IAmTimCorey Thanks Tim... I put a breakpoint in the SendMessage() method to inspect the 'Clients' object. I observed the clientId and what appeared to be an integration with Identity (values were null w/o Identity being used)... I just need to block off some time to explore and play around-- although I would look forward to seeing that in your Part 3 or 4 videos ;)
@IAmTimCorey i realljy like your virds and i learn a lot as an advanced spring boot / Java developer i want to make a transition to NET i do not want to skip steps and i do not need to start from scratch like understand oop concepts or web api or how to write good code but in the same time i want to learn stuff about NET and the best practicies what do you recommend me to do and where should i start
I would recommend the C# Mastercourse ( www.iamtimcorey.com/p/c-mastercourse ). I know you don't need to start from scratch, but it will cover topics that you might otherwise miss at the earlier spots. It will cover a large swath of C#, plus when you purchase the course, you get three bonus courses. One, the Year of Coding, coaches you through the main course and adds additional practice (and solutions), quarterly evaluations of your progress, and expert advice. Another, the .NET Versions course, walks you through the changes to .NET over the past 20 years and what the implications of those changes are. The third, .NET Legacy, gives you the legacy .NET Framework training that has been replaced with .NET 6 training. That way, if you are working on a .NET Framework project, you still have access to the content that covers it.
How to make two desktop wpf apps communicate over the global network? What we should change?
Either they need to be able to directly talk to each other or you need to have a web server act as the middle piece.
Hello! i have this problem: i have two applications, the first one is in MAUI (Android/iOS) and the second one is in WPF. I need to be able to send in real time a string from the mobile app to the WPF one and i was wondering if SignalR can help me. I can adapt your solution to implement this idea? Thanks. I already attempted to use a "normal" webserver with the classic libraries, but i have to many problems while using it.
Directly? No, you can't do that. You need to go through a web server. The web server could host the SignalR server. The problem is that SignalR requires a constant connection. Just keep that in mind. It might be easier to send a message and process it right away on the other end.
hey how do you make sure the authentication
Hi everyone. I want to add a video collaboration feature for my blazor project. Is signalR support? Or how can I use webrtc?
SignalR isn't really for streaming video. It could stream information around the video (when the play button was clicked, etc.), though.
Hi. There's a way to create a server in WPF somehow or it needs to be web application ?
You can use this with any application type, not just web applications. It does need to communicate over the web (or at least to a web server, which can be internal to a network).
I thought the same, but the VS just couldn't find 'Hub' class. Am i missing something ? *edit: The solution for that is editing csproj file and change project sdk to "Microsoft.NET.Sdk.Web"
Please do a tutorial about signalR with azure
Thanks for the suggestion. Please add it to the list on the suggestion site so others can vote on it as well: suggestions.iamtimcorey.com/
Error: "websocket connection to localhost failed....." on VS Community Edition v17.1.0
Solution: update to v17.1.6 and it fixed it.
Thank Tim for the tutorial
Interesting. Thanks for sharing.