我如何检查我的服务器上的文件是否存在jQuery或纯JavaScript?


当前回答

我使用这个脚本来检查一个文件是否存在(它也处理交叉起源问题):

$.ajax(url, {
       method: 'GET',
       dataType: 'jsonp'
         })
   .done(function(response) { 
        // exists code 
    }).fail(function(response) { 
        // doesnt exist
    })

请注意,当检查的文件不包含JSON时,会抛出以下语法错误。

未捕获SyntaxError:意外的令牌<

其他回答

这对我来说很管用:

function ImageExist(url) 
{
   var img = new Image();
   img.src = url;
   return img.height != 0;
}

您需要做的是向服务器发送一个请求,让它进行检查,然后将结果发回给您。

您试图与哪种类型的服务器通信?您可能需要编写一个小型服务来响应请求。

如果你使用Babel transpiler或Typescript 2,下面是如何用ES7的方式来做:

async function isUrlFound(url) {
  try {
    const response = await fetch(url, {
      method: 'HEAD',
      cache: 'no-cache'
    });

    return response.status === 200;

  } catch(error) {
    // console.log(error);
    return false;
  }
}

然后在你的其他异步作用域中,你可以很容易地检查url是否存在:

const isValidUrl = await isUrlFound('http://www.example.com/somefile.ext');

console.log(isValidUrl); // true || false

只要你在同一个域上测试文件,这应该是有效的:

function fileExists(url) {
    if(url){
        var req = new XMLHttpRequest();
        req.open('GET', url, false);
        req.send();
        return req.status==200;
    } else {
        return false;
    }
}

请注意,这个例子使用了一个GET请求,它除了获取头信息(检查文件是否存在所需要的全部信息)之外,还会获取整个文件。 如果文件足够大,这个方法可能需要一段时间才能完成。

更好的方法是更改这一行:req。open('GET', url, false);要求的事情。open('HEAD', url, false);

异步调用查看文件是否存在是更好的方法,因为它不会因为等待服务器的响应而降低用户体验。如果调用.open,将第三个参数设置为false(如上面的许多示例,例如http. open)。open('HEAD', url, false);),这是一个同步调用,您会在浏览器控制台中得到一个警告。

更好的方法是:

function fetchStatus( address ) {
  var client = new XMLHttpRequest();
  client.onload = function() {
    // in case of network errors this might not give reliable results
    returnStatus( this.status );
  }
  client.open( "HEAD", address, true );
  client.send();
}

function returnStatus( status ) {
  if ( status === 200 ) {
    console.log( 'file exists!' );
  }
  else {
    console.log( 'file does not exist! status: ' + status );
  }
}

来源:https://xhr.spec.whatwg.org/