How Can I Check Existence Of A File With Javascript?

How can I check an existence of a file (It is an xml file that I would like to check in this case) with JavaScript?

Solution 1:

if you're using jQuery, you can try to load the file

$.ajax({
  type: "GET",
  url: "/some.xml",
  success: function()
  { /** found! **/},
  error: function(xhr, status, error) {
    if(xhr.status==404)
      { /** not found! **/}
  }
});

if you're not using jQuery:

functionajaxRequest(){
 var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"] 
 //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)if (window.ActiveXObject){ 
  for (var i=0; i<activexmodes.length; i++){
   try{
    returnnewActiveXObject(activexmodes[i])
   }
   catch(e){
    //suppress error
   }
  }
 }
 elseif (window.XMLHttpRequest) // if Mozilla, Safari etcreturnnewXMLHttpRequest()
 elsereturnfalse
}

var myrequest=newajaxRequest()
myrequest.onreadystatechange=function(){
 if (myrequest.readyState==4){ //if request has completedif (myrequest.status==200 || window.location.href.indexOf("http")==-1){ 
    // FOUND!
  }
 }
}

myrequest.open('GET', 'http://blabla.com/somefile.xml', true); 

Solution 2:

If the file is located on the same host that served the page containing the javascript you could try sending an ajax request and verify the returned status code:

functioncheckFile(fileUrl) {
    var xmlHttpReq = false;
    varself = this;
    // Mozilla/Safariif (window.XMLHttpRequest) {
        self.xmlHttpReq = new XMLHttpRequest();
    }
    // IEelseif (window.ActiveXObject) {
        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
    }

    self.xmlHttpReq.open('HEAD', fileUrl, true);
    self.xmlHttpReq.onreadystatechange = function() {
        if (self.xmlHttpReq.readyState == 4) {
            if (self.xmlHttpReq.status == 200) {
                alert('the file exists');
            } elseif (self.xmlHttpReq.status == 404) {
                alert('the file does not exist');
            }
        }
    }
    self.xmlHttpReq.send();
}

checkFile('/somefile.xml');

Solution 3:

Javascript doesn't really have any file handling functions. Your best bet is to do the check server side and send some context back to the client.

If you want to get super hacky you COULD call an xmlHttpRequest (If you're using jQuery take a look at the $.ajax function)

Once you call $.ajax you can use the success/error handlers to determine what to do. It should spit out an error if the file doesn't exist.

This of course is NOT a recommended way to do this.

Solution 4:

I don't have enough reputation to post comments so let me note that in the Anwar Chandra's answer (non-jQuery version) you have to call eventually:

myrequest.send();

Also, the HEAD method would be better to "check existence of a file", because you don't need to read the whole file from the server.