How does Ajax achieve the effect of a progress bar?

Source: Internet
Author: User
The client initiates an AJAX request:
$ ("#data_container"). Load (server_url,{start_query_id:some_query_id});
Requires the server side to constantly return the current progress data and return to the client, for example, the client is constantly showing: the current query user_id is 5, the user information is Blahblahblah ...
At first I thought it was very simple, ob_flush did not solve it:
for ($i =0; $i <100; $i + +) {
echo $i. "
";
Flush ();
Ob_flush ();
Sleep (2);
}
As a result, it was a long time before PHP was all output at once. Want to ask where this is wrong?
If this does not work, can only be loaded with an IFRAME, IFRAME embedded page through Ob_flush () to resolve the current query output, but theoretically the browser's loading bar will always be in the loop state, inappropriate.
The rest can only be used in Ajax each return to the data will be re-submitted again query_id form, the page to keep requesting the server, request time also increased significantly, also increased the server burden.
With WebSocket, for the moment not to discuss his browser poor compatibility, PHP is not born to dry websocket material bar.
Then, do not know what to do, there is a relatively simple and friendly way to deal with this problem?

Reply content:

The client initiates an AJAX request:
$ ("#data_container"). Load (server_url,{start_query_id:some_query_id});
Requires the server side to constantly return the current progress data and return to the client, for example, the client is constantly showing: the current query user_id is 5, the user information is Blahblahblah ...
At first I thought it was very simple, ob_flush did not solve it:
for ($i =0; $i <100; $i + +) {
echo $i. "
";
Flush ();
Ob_flush ();
Sleep (2);
}
As a result, it was a long time before PHP was all output at once. Want to ask where this is wrong?
If this does not work, can only be loaded with an IFRAME, IFRAME embedded page through Ob_flush () to resolve the current query output, but theoretically the browser's loading bar will always be in the loop state, inappropriate.
The rest can only be used in Ajax each return to the data will be re-submitted again query_id form, the page to keep requesting the server, request time also increased significantly, also increased the server burden.
With WebSocket, for the moment not to discuss his browser poor compatibility, PHP is not born to dry websocket material bar.
Then, do not know what to do, there is a relatively simple and friendly way to deal with this problem?

Ob_flush () and Ajax are not the kind of effects you might imagine.

IFRAME Inline page through Ob_flush () can achieve what you want, but have you say "Turn circle".
The front-end set timer, constantly sending AJAX requests, this is the current practice.

To optimize Ajax, you can check the Commet.
Also, it is recommended that you consider whether you really want to output all the information for each user in a large batch of time-consuming operations.

False progress bar algorithm
Completion progress bar is 100%
0 ~ 25%: Random increment 3% ~ 6% per second
25% ~ 65%: Random increment 0.1% ~ 3% per second
65% ~ 90%: Random increment 0.1% ~ 2% per second
90% ~ 99%: Fixed increment 0.5% per second

Until the request is complete, it grows directly to 100%.

Agree with the false progress bar method, we used to do so. Just make sure that after processing is 100% on the line, the middle speed love how to.

Upstairs says the fake progress is good.

  • Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.