How do you handle the refresh of the clients when used in production environment? What I'm looking for to achieve is to force the production client to reload with the new source code when pushing an update to the servers
On local, I'm using hot reload but it doesn't seem to be recommended in production.
To actually force a reload, you have a couple of options.
In broad strokes:
Your client script could poll your server via setInterval using a XHR request (fetch or XMLHTTPRequest object); then conditionally invoke a location.reload() if an update is available.
Alternatively, you could use a persistent connection like socket.io to push a reload command to your client in the background, invoking already-present reload-code in your client.
You might also consider keeping local application state in local storage so that the updated version can pick-up where the previous left-off.
Related
i am update my data from database like delete or change to updated data. now page is need to reload to see my data in current component. how i can see my updated data without reload my website .
You are likely looking for a "push" mechanism. They can take the form of publish/subscribe technologies like WebSockets, or ones that emulate them like Long polling, interval polling (repeated web requests to the HTTP server).
Depending on your framework, you'll likely be using WebSockets API ("WS") to send a signal from the server. They're often used for 'push events' by web developers, an example of how it works:
The backend server will run a WS server
The client's browser will connect to WS when they load their page, "subscribing"
The backend server "publishes" / "emits" / "pushes" messages
e.g. "STORE_UPDATED" with an object of updated properties, e.g. {"apples": 2} of updated properties
What this looks like depends on if you're using WebSockets API directly or a higher level wrapper.
For an idea see Writing WebSocket client applications on MDN.
In your case with React, react-use-websocket and its sandbox demo may be of service.
The client handles them. In your case, your react component would update its local state or a higher level component will place them into child props for them to be updated.
Where you proceed next depends on your backend technology:
Cloud-based: Google's Firebase
Python: Channels for django, Flask-SocketIO for Flask.
Node.JS: Socket.IO
For more WS libraries / frameworks across languages: awesome-websockets
I'm trying to figure out how to create an offline / online approch to use within a huge application.
Right now, each part of the application has its own model and datalayer, who directly read / write data from / to SQL. My boss is asking me to create a kind of buffer that, in case of connectivity failure, might be used to store data until the connection to SQL return active.
What I'm trying to create is something like this: move all datalayers into a servicestack service. Each "GET" method should query the database and store the result into a cache to be reused once the connection to SQL is not available. Each "POST" and "PUT" method must execute their actions or store the request into a cache if the connection fail. this cache must be cleared once the connection to SQL is restored.
How can I achieve this? Mine is a WPF application running on Windows 10.
Best regards
Enrico
Maintaining caches on the server is not going to help create an offline Application given the client wouldn't have access to the server in order to retrieve those caches. What you'd need instead is to maintain state on the client so in the event that network access is lost the client is loading from its own local caches.
Architecturally this is easiest achieved with a Web App using a Single Page App framework like Vue (+ Vuex) or React (+ Redux or MobX). The ServiceStack TechStacks and Gistlyn Apps are good (well documented) examples of this where they store client state in a Vuex store (for TechStacks created in Vue) or Redux Store (for Gistlyn created in React), or the Old TechStacks (created with AngularJS).
For good examples of this checkout Gistlyn's snapshots feature where the entire client state can be restored from a single serialized JSON object or approach used the Real Time Network Traveler example where an initial client state and delta's can be serialized across the network to enable real-time remote control of multiple connected clients.
They weren't developed with offline in mind, but their architecture naturally leads to being offline capable, courtesy of each page being first loaded from its local store then it fires off a Request to update its local cache which thanks to the reactivity of JS SPA fx's, the page is automatically updated with the latest version of the server.
Messaging APIs
HTTP has synchronous tight coupling which isn't ideal for offline communication, what you want instead is to design your write APIs so they're One Way/Asynchronous so you can implement a message queue on the client which queues up Request DTOs and sends them reliably to the server by resending them (using an exponential backoff) until the succeed without error. Then for cases where the client needs to be notified that their request has been processed they can either be done via Server Events or via the client long-polling the server checking to see if their request has been processed.
How can I deploy and Angularjs app and ensure that all my users get the update when it happens? I have a breaking change that needs to be deployed and would cause some downstream issues should a user continue using the old version. Are there any tools or best practices on how to handle this?
Like in the comments says you cant do it with session expires, one alternative you can do, its handle in the backend to check if an update was release and with push notifications cand inform to client. Forcing to reload the app.
An intrusive will do the same thing but without notification, only if response tell there is an update reload page, according api response.
When I make a change to my Backbone web application code on my server, how can I make user's browsers update so they see those changes.
Being a SPA the page rarely if ever refreshes. So even if place hashes/timestamps on my script tags it still wont be adequate enough, ie, this isn't ideal IMO:
...
<script src="js/main.js?t=SOME_HASH"></script>
Does Backbone have a way to handle this?
Backbone being a JS framework that merely gives structure to your applications, it doesn't handle stuff like this. This is something that involves configuration of server and you need to tackle it yourself.
Since you said you have an SPA that rarely refreshes - Your app is probably contacting the server via lots of AJAX requests. You can add an interceptor to these requests on the server that checks if stuff changed on server and sends a shouldReload: true with the response.
You should also have an AJAX interceptor client side that checks for this in response and reloads the page/lets users know about updates on server and give option to reload/restart.
Another option is to implement websockets/polling so that server can push notification about changes to clients. socket.io is a plugin that uses web sockets and falls back to polling.
P.S: You also need to bust the cache as you mentioned in question
I am using ratchet websockets to connect to a WAMP Autobahn front-end.
Everything works perfectly however when I change the topic code, the responses do not change!
i am running this in docker, when I restart the containers the updates responses get sent but then if I change this again nothing happens!
Your questions doesn't have many details but I think what is happening is your are running the PHP WebSocket server. Then changing the PHP code and expect the server to automatically update. That isn't how it works, you have to restart the websocket for code changes to take effect.
If you want to have a dynamic response without restarting the socket I suggest using a database or other data store that you can dynamically change and PHP can fetch from