Develop Reference

How to notify the front-end of a website of the status of a back-end processing job?

I currently face the following issue:
After a user has uploaded his images, all images are processed through a script that optimizes every image (compresses it and removes EXIF-data).
I got everything working, the only problem is that the proces takes quite some time. I want to notify the user of the job status, e.g. a percentage of the processed images.
Currently, the user has to wait without knowing what's up in the back-end. What is the best way to accomplish this? I've thought about AJAX-calls, but I honestly have no idea where to start with implementing this, also because it looks like I need multiple calls (kinda like a heartbeat call on the processing job).
The application I am developing in is a Laravel application, I've made an API controller which handles incoming files via AJAX calls.
Any help is appreciated, thanks.

Laravel has Broadcasting for this. It uses websockets, redis or pusher to send events to the client.
This way you can send the client a message when the processing is done without them having to refresh a webpage all the time.

You'd be better off reading about the principle of how it's done, for example: Progress bar AJAX and PHP
Essentially the way it's done is that the job (processing images in your case) happens on the server through PHP. Your script will need to produce some sort of output to show how far through it is, e.g. echo some value for the percentage progress. The PHP script itself is responsible for producing this output, so you must work out how to calculate it and then code that in. It could be that it takes the number of images to be processed into account, and when each one is successfully processed, it adds 1 to a counter. When the counter equals the number of images, 100% done, or possibly some error messages if something went wrong.
On the frontend you could have an ajax script which reads the output from the PHP script. This in turn could update a progress bar, or div with some sort of percentage message - the value used coming from your PHP script.
Laravel - and other frameworks - have built-in methods to help. But you'd be better understanding the principles of how it works, such as on the link I posted.

How to add a javascript value into my SQL table? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I'm kind of new to javascript but I'm currently working on my website:
When I press a button, javascript generates a random number (for example: Your Coins: 25) and then I need to connect to my 'members' table and add 25 to the 'coins' field. (I'm already connected with mysql in the php code if this matters.)
Could anyone help me?

If it's "coins" then you probably won't want it to generate client side, otherwise someone would be able to call your java script function with any number they like and add in millions of coins!
The other way is to have PHP generate the number for you.
You can use something like jQuery's $.get function to call your php script with the action of "adding a random number of coins" and the php script can return the random number to java script via JSON for it to be displayed.

First the browser sends a request to the server, which, on its turn parses it. This is the time when your HTML is generated and your PHP runs. When the HTML is generated and ready, it is being sent to the web-browser. The HTML might contain script tags which are pointing to js files via the src attribute, or script tags which contain Javascript code, but before the server sends the response, the Javascript files are not loaded, Javascript code inside the scripts will not be executed. When the response arrives to the web-browser, it parses the HTML, loads the external js, css files and pictures and executes the Javascript code.
So, when your Javascript generates the value, it is running on the user's web-browser, remote from the server. Therefore, from this point the Javascript code should send an AJAX request to the server. This will post a request to the server, which, on its turn will receive and parse it. You can post parameters when you send an AJAX request. jQuery has an easy-to-use variation. Your server will receive the request with your parameters and you will be able to read the parameters via $_GET or $_POST, which are associative arrays containing parameters with their names used as indexes. You can use those to write your query.
All this is well-documented, if you watch a few tutorials, you should be able to solve the problem. On the other hand the commenters and the other answerer are right when they tell you that you should never trust the browser to generate sensitive data, as hackers could easily see what requests are being sent from the web-browser and would send similar posts where they would be "lucky".

Prevent fake looping ajax requests to PHP

On my website, I have created a comment section for blog posts. Users can write comments, click a button, and an AJAX request will be sent to PHP containing the data in JSON. The PHP will process & validate the data and then insert it into the database. On success, all comments are retrieved from the database and, using JQuery, all of the page's comments are reloaded.
The problem is that anyone can come along and, using their browser's console, forge an AJAX request, fill in their own JSON, and send the request to PHP. If done like this, all that happens is my client-side validation is useless. The server-side validation would still work. However, there's a bigger problem.
for(var i = 0; i < 10000; i++) {
//ajax request
}
The user can very easily insert thousands and thousands of records into my database instantly.
Does anybody have any suggestions on how I can prevent something like this from happening? It must involve creating something on the server side that can't be guessed by a user, and somehow checking against that during an AJAX request. I'm just not sure how exactly to go about this.
Thanks for the help.

The only way for you to be safe in this respect is to add a CAPTCHA.
This will prevent mass / automated posts. One possible library to use is Securimage . It is simple to use and integrate. You can have it running in 10 minutes with your AJAX stuff.
Relying on other means such as cookies or client side validation of some sort is risky, if possible at all. For instnace KA_lin 's solution can be compromised in 5 minutes: a malicious user can be sending forged cookies that will always have a page count of 0 and thus will always be allowed to post. Or even worse, he could create a small program that will post to your page without sending any cookie at all. The above code will create a new cookie and accept his post, every time ...

I would add a session variable containing the number of posts a user makes, given many pages you can form something like $SESSION['page_id_total_nr_comments'] and track this number, add a config variable that let`s the use to add a maximum of X comments per article for example:
function canUserAddComment($pageId){
$maxAllowed =......;
if(!isset($SESSION[$pageId+'_nr_comments'])){
$SESSION[$pageId+'_nr_comments'] = 0;
}
if($SESSION[$pageId+'_nr_comments']< $maxAllowed){
$SESSION[$pageId+'_nr_comments']++;
return true;
}
return false;
}
OR
On save get the number of comments a use already made on the article and decide if ha can make another(still with a config variable)

Pull an external page 10 seconds after the request using PHP

I have two web pages that I'll call domain.com/Alvin and domain.com/Bert for this example.
Alvin displays search results based on a query string variable, but it loads the results using JavaScript approximately two seconds after the page loads.
Bert needs to use these results for occasional ad-hoc reporting, but due to the way the company is set up, I can't link directly into the database that Alvin is pulling from. A different team manages the Alvin page, so I won't have access to change their existing code.
While I think I could do this with .NET, I'm unsure of how to do the request with PHP which is highly preferred for the page.
Is anybody aware of how I could use file_get_contents, file_get_html or any other PHP functions to get the HTML of another page but only pull the HTML five seconds after the initial request to allow the JavaScript to update the results?

Credit to mplungjan - not sure why I didn't think of this earlier, but I was able to replicate the AJAX to the same request. Thanks!
Since they are on the same domain, one page can ajax the other page in – mplungjan

How can my ASP.NET page go back and forth from client to server code and back several times?

OK, the tite seems a little confusing, so I'll try to explain more thoroughly...
The process the page does currently follows the following sequence:
- User clicks a button
- server-side code goes retrieve data from the DB and exposes said data to the client using, populating, let's say, hidden fields.
- client-side code uses this data to fire up a an ActiveX component which performs a few tasks with the data provided.
And this works fine, however, we need to optimize the process because the ActiveX component is not fit to handle high volumes of data. We need to send data into "blocks" to the component, rather them send all data at once as it is done today.
However, I just hit a roadblock here, on how can I make the page go back and forth from server to client code multiple times? Like... "user clicks a button, server retrieves first block of data, sends to client, client executes ActiveX for the first block, client requests next block, server retrieves second block, sends to client, client executes ActiveX for the second block, client requests third block... and so on"? I can't get past the first request, since I can't register a client script block 2 times and expect AJAX to handle those multiple sequential callbacks...
Or is there a way?

This sounds more like an architectural issue than anything else.
What you should be doing here is:
1) User clicks a button. This is NOT a regular submit button. Just a plain old button that executes some local javascript.
2) Local javascript makes an AJAX request to determine how many records are available.
3) That javascript then does a loop based on the number of available records divided by the amount you want to pull per chunk.
3.a) Execute AJAX request for a chunk
3.b) Throw the data into your ActiveX control - which, btw, I really would suggest you guys think about getting rid of. There are so many issues with ActiveX that it's not even funny.
4) Repeat 3.a and 3.b until completion.
You'll notice that at no point was a full post back performed. You'll also notice that you shouldn't have to register any client script blocks.
Now the draw back here is purely in the ActiveX control. Can it be instantiated from javascript multiple times in a page or are you forced to only use a single instance?
If it's limited to a single instance, then you'll need a different approach entirely.