CODEWITHSUNDEEP
javascripthtmlcssrequestxmlhttprequest
Gary Chen
Gary Chen

Reputation: 278

Need to get statuses of static files

I need to get statuses(http codes) of static files on page.

For example html code contains

<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="https://example.com/theme.css">
<script src="script.js"></script>
<script src="https://example.com/script.js"></script>
<img src="image.png">
<img src="https://example.com/image.png">

On output need to get json like this Only 404 needed.

{
  "css": [
    {
      "https://example.com/theme.css": "404",
      "https://example2.com/theme.css": "404"
    }
  ],
    "js": [
    {
      "https://example1.com/script.js": "404",
      "https://example.com/script.js": "404"
    }
  ],
      "images": [
    {
      "https://example.com/image.png": "404",
      "https://example.com/image.png": "404"
    }
  ]
}

It must be done with only Javascript.

I am going to use this

var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
    if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
        callback(xmlHttp.responseText);
}
xmlHttp.open("GET", theUrl, true); // true for asynchronous
xmlHttp.send(null);

It is necessary that upon receiving the status, this should not be done by executing a separate GET request to the file.

But I can't find the way how to do this without executing a separate GET request.

Who can find the solution?

Upvotes: 2

Views: 388

Answers (2)

Ryuno-Ki
Ryuno-Ki

Reputation: 800

I need to make some assumptions here, so please check, whether those are true :-)

  • You want to run the code in a browser (i.e. not in Electron or Node.js or a Web Extension).
  • You want to save additional network roundtrips (e.g. not making additional requests to throw away the response, because you only need the status).
  • You want to process the results further.
  • You are asking for static files inserted in HTML (instead of injected with JavaScript).

I'm afraid, you won't get much around making additional requests.

Here are some ideas, you could further investigate:

  • Make an additional HEAD request instead of GET
    • This will only ask for the HTTP Headers (body will be empty).
    • Sadly, not all servers support it.
  • Use a Service Worker to intercept the network requests and look at the status code before forwarding the response to the browser.
    • I can't tell you, how to get the response out of the service worker.
  • Register your JavaScript early on and intercept the requests, i.e. handle them in JavaScript directly.
    • Does not work with static resources linked in HTML

Would be great if you could provide more details on what you are trying to do.

Cheers

Ryuno-Ki

Upvotes: 0

Ritesh Khandekar
Ritesh Khandekar

Reputation: 4005

If you are using Server side languages like PHP then i have some idea. eg. 

<?php
$url= $_POST["url"];
$curl = curl_init(); curl_setopt_array($curl, array( CURLOPT_URL => $url, CURLOPT_HEADER => true, CURLOPT_RETURNTRANSFER => true, CURLOPT_NOBODY => true)); $header = explode("\n", curl_exec($curl)); curl_close($curl); $string = $header[0];
if(strpos($string, "200")){
    echo "200";
}else{
    echo "404";
}
?>

Call the above file in AJAX with url parameter.

Or write similar lines of in your server side. Like (python):

s=socket.socket()
s.connect('url',80)
s.send('GET /path HTTP/1.0\r\nHost:hostname\r\n\r\n')
print s.recv(1024) #some lines of headers

From the above, in short, it is not possible to get status code of file present in any host without sending request.

Hence, it is not possible without sending multiple AJAX request (seperate GET requests)

Upvotes: 2

Related Questions