I am writing web app in angular, using Nancy as my backend. I have setup signalR websockets as my primary communication mechanism. It works great, with one exception. I can't figure out how to attach state to my socket connection and make it easily available to my code. To be more specific, I can create and maintain state, I am finding it difficult to make that state available to everything on the back end that needs it, without passing a state data object around through every call.
I was hoping to tie to Nancy's IoC, but that is based off of the session, not off of a websocket. I looked at other IoC systems, but I cannot grok how to tie them to the socket.
Does anyone have any insight on how to maintain state non-obtrusively with signalR?
EDIT: This may explain it. When the user connects via signalR, I want to create an IGame instance with a life cycle that is tied to the signalR session and inject it throughout my code as needed. for that particular user.
Is that any clearer?
Related
I added a WebSocket API through AWS API Gateway on my React app.
I originally added it to build a chat messaging section, however, I soon realized how useful it could be for other things in the app that might need real-time updates.
I had an idea, and that is to store the socket in a React context so it's accessible from all the components of the app and that should work fine, without re-establishing a connection every time a component mounts.
Now, the question is, is there a better way to do what I'm trying to do? Hence, create a socket connection that I can then take advantage of for multiple functions? Say for instance, "is online" status.
The alternative is to create yet another socket API but is that really necessary?
Keep in mind I'm using a serverless framework (API) with lambda functions on AWS.
This is going to depend on the applications planned scale, keeping in mind that as the app usage grows you may want to refine the endpoint architecture and code.
Remember that an auth endpoint/api for example may only need to be accessed a few times over a chat interaction endpoint/api. For scalability (and cost per endpoint call too) id be looking at keeping them separate.
My friend and I are currently building a web-based chat app with WebSocket. I'm in charge of client side (React + Redux). Golang is used for the server side (I don't know whether this is a good combination, but I do this just for fun).
Basically my problem is that I don't know what to do after the successful re-connection to the WebSocket server.
More concretely:
The client side tries to reconnect to the server when the connection is lost. My questions are
When the re-connection is successful, what should I do with the data that were supposed to be sent to the server, but actually weren't sent because of the lost connection? Is it better to have something like a buffer to store all the data that are not yet transmitted to the server?
Currently, a React component do the initial fetch of all the necessary data ( rooms, friends, chat history, etc.) on componentDidMount. For the app to be in sync with the server on successful re-connection, the app should perform actions similar to the initial fetch. But calling componentDidMount deliberately does not seem to be a good idea, because it is not supposed to be called in this way. Is it good to perform initial fetching in componentDidMount in the first place?
Since this is is a general question, I will answer in general terms:
You need some kind of buffer between the application and the unreliable stream. Since you're reactive, you can implement this using an observable. The service that is responsible for the actual communication over WebSocket will subscribe to this feed.
Separate the initialization of the component from initialization of the data. If you're communicating over WebSocket, you can reinitialize data every time the socket connects.
Go is certainly a good choice for the chat server because of the way it handles concurrency. The other common option for chat servers is Erlang. React is a matter of personal preference.
You probably don't want to buffer it all. You just want to buffer the messages but not, for instance, typing indicators because they make no sense if not sent immediately. Something as simple as an array with push() and shift() would do.
Move data fetching to a separate function, then call it both from componentDidMount and from the callback or whatever place where you reconnect.
Using both HTTP and websocket in one app is a matter of design. It does seem to complicate things though.
Couple of questions:
I have list of components on the client app which has some near real time info e.g. status, which I want to display.
I have server app, which can pull the status info from a third party REST endpoint.
My question is, should I cycle through all the components in the client app and request the server app for the status?
Or should I have a server worker thread, which pulls the status info and publishes on the websocket, which the client can then update the state of the component.
Or is there background thread which I can run on the client app, which will update the status and the state. How will this conflict with the dispatch/queuing of events from user interactions.
I think I might be asking some of the architectural questions and the answers might be "it depends" ambiguous, but anyone who has done this before and any guidance is appreciated.
Thanks, Rajesh
It depends :) But it's safe to go with server-side approach since with client-side you would have to deal with CORS and cross-domain ajax calls in general. Most of the 3rd party API do not allow to make arbitrary AJAX calls from other domains. Those that do allow that usually have API quota which is again easier to manage since you can keep your keys secret on the server and throttle and cache requests.
Server side approach requires more effort though. So it's a prototype and 3rd party API allows cross-domain requests – go for it, it's easier, for production app, consider doing this on the server.
For client-side approach if 3rd party API doesn't offer subscriptions, yes you would have to poll, but you don't have to cycle through components. You can abstract this polling in one, root component and then just pass props down.
You are right, the answer is "it depends".
Basically, you have two options:
Poll the server for the current status.
I believe you do not have to cycle through all the components and query their status. You could just have an API that provides the server the timestamp when you last queried the status, and the server will respond with just the information that has changed since the last query.
This is simple and will work fine if the updates are not huge, and you can afford to be a little late.
You could have a dedicated websocket connection with the server
In this case, the server will push any new updates to your front-end whenever any new update is available. This is a little cumbersome to implement, but is the right approach if the updates are near real-time.
To answer your question about having a background-thread on the front-end: no, you cannot have background-threads on the front-end. Javascript doesn't work that way. What you do have are callbacks. Whenever the server pushes you any new information, a callback, that you define, will be called and you can do whatever UI changes you need from here.
My question is, should I cycle through all the components in the client app and request the server app for the status?
No, this sounds very inefficient to me.
However, if you decide to poll from the client, it should be done only from a single component that is parent to all children that need the information. The parent then passes its state to the children and they update on each poll.
Or should I have a server worker thread, which pulls the status info and publishes on the websocket, which the client can then update the state of the component.
Absolutely. Let this socket be in your top-level application component which holds the real-time info in its state and passes down to its children. Whenever information gets published to the socket, update the top-level application state with the new real-time info and all children will rerender displaying the most current information.
I am starting to work with angular and am fascinated by the bi-directional data-binding capabilities and by its $http method, which lets me save changes in to my mysql database, without refreshing the page.
Another thing I am currently fascinated by is the real time capability across multiple clients using firebase. Here all clients are updated in REAL TIME, when the database receives any changes. I'd probably like to use firebase, but I would have to drop Laravel and MySql as a persistence layer entirely, which I would like to keep for the moment, since my application is already working in Laravel, just not in real time.
How would I go about having a Real Time application, which updates every client, without refreshing the view, in Laravel using MySQL and Angular?
If I am not mistaken, Pusher and PubNub, are providing this necessary open connection with the server using websockets, so when the server has something to share, angular will now and render it.
Since I would like to use Laravel and MySQL as a persistence layer, I am not sure, what the best way would be. I am not even sure, if I understood everything correctly, which I wrote above, since I am new to angular and real-time applications.
What would be the next necessary steps, to get some Real-Time capability into a PHP/MySQL application?
The solution for your problem is:
1º - open websocket connection with the websocket-server and subscribe a channel, after this send the data to your serve using ajax
tutorial angular pusher
2º - In server side, you get the data, saves to your database and send a 'PUBLISH' to the respective channel into websocket server
lib useful for this
3º - Through the subscribe gets the data in real time
Pusher.subscribe('channel', 'event', function (item) {
// code
});
I had a similar problem recently and I finally ended up using Redis publish/subscribe Redis. You can store data in the channel and then subscribe to any changes. When something changes you can send it to Pusher which will send it then to the clients.
I also recommend considering Node.js and Socket.io since you can achieve very good performance without third party service, and even if you don't have experience with node you can find very good examples on Socket.IO how to write an application.
For Redis there is a good library for PHP called Predis and there is Redis Node client as well, so you can mix it all together.
I have a Linux/c client app that connects to a WCF web service over HTTP/SOAP (BasicHTTPBinding). I am using gSOAP. Can I implement the calls to the web-service using callback? I want to get the data asynchronously as call back.
Update: I have updated the question title.
WCF does support Duplex services, or those that have the ability to call back to the requesting client. Duplex services can be very complicated, as they are not only stateful, but they impose an contract implementation requirement on their clients.
Duplex services require the use of the WSDuplexHttpBinding. You will need to make use of the OperationContext to get a reference to the callback channel. Your clients MUST implement the callback contract in some class, and provide an InstanceContext that contains an instance of the callback class to the client proxy. Communications in both directions must be supported, and if the client is behind its own firewall or across the internet, this can be a complicated matter to resolve. Take care when writing duplex services...they are often more trouble than they are worth...so make sure you really need it. ;-)
The following page might be helpful:
http://msdn.microsoft.com/en-us/library/ms731064.aspx
The basicHttpBinding does not support callbacks. Another approach might be to have another method that the client can poll on for the response.
I am facing the same issue and the approach I am trying is to have a pair of gsoap servers/clients. Basically each process will listen on a port for soap calls and make its client calls to the other server. This way I avoid the polling or other complex approaches. The code has to be obviously thread safe for whatever business logic is implemented but the client/server combo pair is the simplest solution i have thought of so far.
Obviously one needs to be in control of both sides of the solutions the mentioned server and the mentioned client.