How to catch ERR_FILE_NOT_FOUND errors in JavaScript

I was trying to test whether certain file exist using javascript.(don't want to use Ajax). Want to use catch try to handle ERR_FILE_NOT_FOUND error. I tried

   try{
            img.attr('src', url)
        }catch(err){
            console.log("file"+ url + " doesn't exist");
        }

but it doesn't catch up the error.How do I catch ERR_FILE_NOT_FOUND error?

Answers:

Answer

Setting the image attribute src isn't going to throw anything based on the results of the file existing or not, it will just simply show the image or not show it.

You might be able to check the size of the image after it's done loading and see if it is 0 width, but this is still just a hack and might only work for images.

Your best bet is jQuery with ajax and use a simple:

$.get("/path/to/file", function(data, status) {  
   console.log("File request status: "+status); 
});

EDIT:

You might want to check the onerror event like in the comment, you could use the html like:

<img onerror="onerrFunction()">

or

js: imgObject.onerror = function(){}


The error you are referring to as 'ERR_FILE_NOT_FOUND' I assume you are finding from a browser such as chrome in the developer console like so:

screenshot

However, this is not a javascript erro being thrown, so you cannot catch it with js code. This is just a browser error to help debug your code. There might be other ways to catch these kinds of errors but as for what you are asking, that probably isn't in the scope of the question.

Answer

Chrome does it to inform. Even if you handle onerror correctly with correct error handling with try-catch and every trick with void or ( ) that is told to prevent error - you can not fix it. It is out of Javascript control.

The best you can do is to let those errors scroll away to the top, to not clutter your output. This works if you also want to remove the clutter of line numbers on each console.log to get a clean output with relevant information. Use \n as line break. A dashed line separate the errors from your output.

var logs = ""

function log(x) {
  logs += '\n\n' + x
}

//your code
try{
  img.attr('src', url)
}catch(err){
  log("file"+ url + " doesn't exist")
}

setTimeout(function(){
  console.log("%c" + logs, "border-top: dashed 2px black;")
}, 1000)

Maybe better replace the setTimeout with a function called in end of your program.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.