How to check if the assets loading in to a HTML page returns 400 status using jquery

Question

I am creating a web-based HTML rendering platform using PHP. Here I will be showing an online IDE-like interface and add HTML, JS, CSS, Video and Image files. Clicking on a button will load these items on a new tab as a complete HTML website.

I need some validations here. So that it will return the number of assets added in the HTML page which returns 400 status (files that don't exist).

I can't add the check inside the Jquery file which is inside the HTML package. Because that is created by the user.

What is in my mind is,

• Click on a button named "Validate"
• It will load the index.html file from the one user-created.
• Some functions will track the loading of all asset files which are added to the index.html file
• Return the number of assets that return the 400 error.

This is the flow in my mind. I am able to load the HTML file which the user has created using my platform. But having no idea how to validate how many of the asset files returning 400 status.

Can someone help me with some ideas on this or some sample code?

Answer 1

For PHP based solution, see file_exists().

$filename = '/path/to/foo.extension';

if (file_exists($filename)) {
    // file exists
} else {
    // file DOES NOT exist
}

Also you may consider to use is_readable() with file_exists().