Make field data change in real time without refresh.. How on a Website? [closed] - real-time

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I have two numeric fields that contain the following information:
(1) Users Registered
(2) Money Raised
Is it possible to make the data change in real time (EVERY SECOND) while someone is viewing the page with the fields? I don't want the viewer to refresh manually to see the updated number, but have the fields change automically while the page is viewed. I want it to be similar to like a text clock that actually shows the seconds counting, etc.
The fields are connected to a database that is constantly changing every second.
Does anyone know if this is possible? Any examples? or Suggestions?
I really appreciate it.
Erik

I guess this is a web application. In this case you would make a request to your server with XMLHttpRequest every second. The field can then be updated with the response.
You might also use websockets which open a permanent connection to the server. Unfortunately they are only supported by newer browsers.
An example for my first proposal with jQuery:
// This function starts the request and calls success on response.
var refresh = function() {
$.ajax({
url: "/some/path",
cache: false,
success: success
});
}
// Replaces the contents of the field with your response and
// triggers refresh() after 1000ms.
var success = function(data) {
$(".field").html(data);
setTimeout(refresh, 1000);
}
// Starts processing when document is ready.
$(function() {
refresh();
}

You have 2 options:
You can use the setTimeout feature to make an ajax request every second and update the web page.
If you can limit your self to the most current web browsers, you could use WebSocket to maintain an persistant connection to the server, allowing the server to send out updates whenever necessary.
EDIT
There is also Comet, but that might be overkill.

This you can also do using WebSockets where you don't need anything to refresh the webpage. WebSockets automatically pushes data to webpage as soon as your server receives the data. example of real time web application without refreshing the webpage is given below.
Source:
http://www.bytesofgigabytes.com/mqtt/how-to-make-real-time-web-application/

Related

How to sync a mobile app offline state with a remote database? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
I am building a mobile app using Flutter. All user's data is stored online in a MySQL database, so the app needs an internet connection for almost every user interaction (there is a backend REST API).
Users have to be able to create some lists of tasks, update and delete every task and list, and so on. But from the user's perspective, the need for an internet connection for every simple operation like adding or deleting a task is a bad experience. I need a way to support these operations even without connection with the backend and to apply these changes later when it is possible. But what is the best practice to handle this case?
How to keep the app behaving like normal even without an internet connection and sync all changes that the user has done with the backend when the internet is available again?
For example, if the user creates a new list the app expects to receive the new list's object (with id) from the backend. Later this id is used for every backend call about this list like adding a task in it.
What you can do is use a state management approaches like
Providers, Bloc etc and have a local state of your database or the needed list inside them and apply all the changes on them when offline and implement all these on to the server when connected to internet.
Read here about flutter state Management
also you can check when the device is connected to internet with this connectivity and data_connection_checker packages

RESTFul pattern url for enable and disable [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
What's the RESTFul pattern for enabling and disabling a system user.
Example:
a DELETE request to /users/123
and PATCH/UPDATE request to /users/123
Or should I use /user/enable/123 using PUT and /user/disable/123 using DELETE?
First of all: DELETE always removes a resource. So it cannot be used to change a value. Read more about the different Http methods and how they are supposed to used here: https://www.rfc-editor.org/rfc/rfc7231
You can solve this in three different ways. Whatever fits you best.
Update user object
Another approach would be by updating the User resource.
In this case you could send a PUT /users/123 with a body that contains the full updated user object.
Partial update of user object
If you define that you are allowed to do partial updates (partial means you only need to send the changed values which will be merged in to the existing user object) you can send a PATCH /users/123 containing a json with {enabled:true}. This is usually a bit trickier to handle on the backend.
Directly set enabled property (not recommended)
enabled is a property of a User. There for you can address this property directly in your URL.
You can use PUT /users/123/enabled with a body that contains true or false. To this approach, also see #Roman Vottner comment below
What's the RESTFul pattern for enabling and disabling a system user.
How would you do it with pages on a web site?
It might be that you would load a page that describes the system user, and from there navigate to a form with affordances for changing the users state; you would set the values on the form you want, and submit the form to the URL provided. The server would process the request, and either give you a status page, or redirect you back to an updated copy of the user, or whatever.
Notice: throughout the entire process, the client is following links provided by the server; no guessing URI, no guessing which http methods to use; the client follows the instructions embedded in the hypermedia
Repeat that same process in a machine readable way, and you've got a REST api.
REST, keep in mind, is about manipulating "resources" by passing messages around; the changes made to your domain model are side effects of the resource manipulation. In other words, the resources are part of your integration domain. See Jim Webber - REST: DDD in the Large

What are HTTP methods (verbs) for? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I have read several sources about HTTP methods, but I still don't understand clearly the simplest thing: what are they for?
Each source I've seen points out when particular methods should be used, but what does it change in practice? Is there any difference how the request is being handled between, let's say, GET and POST?
Or maybe those methods are there to allow us to handle multiple behaviors on one URL?
And finally, what about the browsers? Forms can only make GET and POST requests and they handle them in different way. POST form sends data "in the background", while GET passes them in the URL. Does it have anything to do with the protocol or is it just browsers' convention?
Thank you in advance for clarifying it for me. :)
Fundamentally, yes, methods are there to allow different "interactions" with every "entity". HTTP is designed so you can think of each URL as one entity.
/users represents all users
/users/dave represents one specific user
POST /users lets you create a new user
PUT /users/dave lets you modify a specific user
GET /users gets you a list of users
GET /users?name=dave lets you query for a list of users named "dave"
and so on...
That's the way HTTP was designed to be used, each verb has a specific implied meaning. You can use those verbs any way you want really, but GET implies "passive" information retrieval, while POST, PUT and DELETE imply destructive changes.
Browsers and other clients do handle these differently. It's expected that anything GET can be requested at any time any number of times, can be cached, can be pre-fetched, can be queried mostly out of order. More destructive actions should be performed only once when requested and not cached, pre-fetched or anything else. A browser will explicitly ask for confirmation if you're "reloading" a page requested via POST.
POST form sends data "in the background", while GET passes them in the URL. Does it have anything to do with the protocol or is it just browsers' convention?
"In the background" is the wrong way of thinking. The difference is between the URL and the request body. A GET request should not/must not have anything in its request body. Again, it's only passive information retrieval and must solely consist of HTTP headers. A POST request can have a request body. A request can have "data" both in its URL and in its body. Again, an assumption is that GET URLs can be shared and passed around, since it just links to information. POST requests on the other hand need to be very deliberate, so its information should not and doesn't need to be in the URL.

Get and post form method uses scenario [duplicate]

This question already has answers here:
When should I use GET or POST method? What's the difference between them?
(15 answers)
Closed 9 years ago.
What is the difference between the GET and POST form method except one(GET) send data from URL and post send directly ?
And if i use SSL then should i choose only post since get wont work ?
There really is nothing different between GET and POST. While GET uses URL visibly, you should not think that POST data is hidden in anyway, as this could create false sense of security. While POST indeed hides data from URL, it's still there, exposing slightly less data to a casual observer.
Even if HTTPS is used, preventing the data from being intercepted in transit, the browser history and the web server's logs will likely contain the full URL in plaintext, which may be exposed if either system is hacked. In these cases, HTTP POST should be used.
GET is used to read data. It's mostly used in search strings and in actions, where you get data from end point and where you don't modify anything. Because it's visible in URL, you can bookmark it for later use, that's not possible with POST.
POST is used to create, update and delete data in end point. For example form data is supposed to be sent as POST.

How to build realtime push notification feature like facebook does? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I'm going to build realtime push notification feature for my web application ( a small social network) and I don't know where to start.
This is what I want to build: there are like buttons, comment forms, ... Users click like, write their comments and (relatively) immediately, on the owner's browser shows the number of new likes and comments, ... Something like that.
I've read about socketIo on nodeJs, MeteorJS but unfortunately, they need WebSocket supported by mordern browsers. I've just read about Comet technic and find it pretty easy to apply. But i'm not sure it will performs well because Comet relies on long-polling connection (correct me if I'm wrong).
In addition, I think facebook is using Comet for its push notification feature. Through console tab on firebug plugin I can see there's alway a holding connection to facebook.
So can anybody show me a technic, a model to develop a feature like that?
A promising idea is to work with the HTML5 notification API; it's perfect if you want notifications to pop on the user screen as long as his browser is running (even if you're surfing another website or if all windows are closed).
http://www.paulund.co.uk/html5-notifications
However, if what you want is to update different parts of your page asynchronously (without refreshing or pushing a button), you should use together :
Ajax calls;
Listeners and observers.
When you Ajax calls retrieve particular types of json data (for example), it can trigger appearance of a badge (listener) with a number of new notifications, or so...
With JQuery installed, you should be fine...
Even though it's often not the case, sometimes, for simple tweaks, it's easier to code the job done...
You can start here :
How implement a "observer" in Jquery without plugins? (it's old, but interesting)
Or see this page :
browser instant updates with ajax/jquery
(incredible how often google queries return stacko' pages)
You should check out MQTT. It basically works on the Publish-Subscribe model and is very easy to use. This protocol has a small footprint and consumes less bandwidth. Facebook's Messenger uses MQTT too.
you can use an ajax call coming into (for example) a php script on the server, which keeps the connection open and only replies if and when something needs to be displayed to the user. should nothing happen within a certain time, the connection gets closed and the client fires a new ajax call.
note that this only addresses the client/server communication, you would still need a notification method inside the server to wake up the php script if you want to avoid having a script constantly polling the database, but there are quite a lot of soultuions to this and they depend on what language you use on the server.
I have got an idea, it is simple but it may work. Why don't you hide notification bar as Div tag and design it with css to make it look like notification bar. Then whenever some user likes or comments about the page, write php or js function and connect it to like or comment submit button that will reveal page owners invisible div to visible. And I believe , depending on what you use, I would probably prefer php session() to Identify if page owner is online and can get notifications. moreover, if you need to track statistics of the page, you may create a small database that holds, page id and user comments. You can use this database to push multiple notifications on that hidden Div. you can use Jquery to make it move like Facebook if you want to. I m not %100 percent sure if this is the most optimized way to do that but it is possible. By the way, I surfed some to see what people use to do that. surprisingly I couldn't find something as well.