如何在jQuery或纯JavaScript中检查文件是否存在？

Question

如何在jQuery或纯JavaScript中检查文件是否存在？

javascriptjqueryfile-io

298

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

- usertest

19个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jim Bergman · Answer 1

使用异步调用来检查文件是否存在是更好的方法，因为它不会等待来自服务器的响应而降低用户体验。如果您调用.open并将第三个参数设置为false（就像上面的许多示例中一样，例如http.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 );
  }
}

source: https://xhr.spec.whatwg.org/

- yasir amin 9th-b DR.VSMPS · Answer 2

对于客户端计算机，可以通过以下方式实现：

try
{
  var myObject, f;
  myObject = new ActiveXObject("Scripting.FileSystemObject");
  f =   myObject.GetFile("C:\\img.txt");
  f.Move("E:\\jarvis\\Images\\");
}
catch(err)
{
  alert("file does not exist")
}

这是我的程序，用于将文件转移到特定位置，并在该位置不存在时显示警报。

- Josh Harris · Answer 3

这是对已接受答案的调整，但我没有从答案中获得所需内容，不得不测试这个想法是否有效，因此我在这里提供我的解决方案。

我们需要验证本地文件是否存在，并且只允许打开该文件（PDF），如果它存在。如果省略网站的URL，浏览器将自动确定主机名 - 这可以使它在本地主机和服务器上工作：

$.ajax({

    url: 'YourFolderOnWebsite/' + SomeDynamicVariable + '.pdf',
    type: 'HEAD',
    error: function () {
        //file not exists
        alert('PDF does not exist');

    },
    success: function () {
        //file exists
        window.open('YourFolderOnWebsite/' + SomeDynamicVariable + '.pdf', "_blank", "fullscreen=yes");

    }
});

- Vladimir Salguero · Answer 4

首先创建函数

$.UrlExists = function(url) {
 var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return http.status!=404;
}

使用以下函数后：

if($.UrlExists("urlimg")){
 foto = "img1.jpg";
}else{
 foto = "img2.jpg";
}

$('<img>').attr('src',foto);

- blissweb · Answer 5

这是我2020年的异步纯JavaScript工作代码。

function testFileExists(src, successFunc, failFunc) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (this.readyState === this.DONE) {
            if (xhr.status === 200) {
                successFunc(xhr);
            } else {
                failFunc(xhr);
            }
        }
    }
    // xhr.error = function() {
    //     failFunc(xhr);
    // }
    // xhr.onabort = function() {
    //     failFunc(xhr);
    // }
    // xhr.timeout = function() {
    //     failFunc(xhr);
    // }
    xhr.timeout = 5000;           // TIMEOUT SET TO PREFERENCE (5 SEC)
    xhr.open('HEAD', src, true);
    xhr.send(null);               // VERY IMPORTANT
}
function fileExists(xhr) {
    alert("File exists !!  Yay !!");
}
function fileNotFound(xhr) {
    alert("Cannot find the file, bummer");
}
testFileExists("test.html", fileExists, fileNotFound);

我无法通过任何中止、错误或超时回调强制它返回。在上面的测试中，每个回调都返回了一个主状态码0，因此我将它们删除了。你可以尝试一下。我将超时设置为5秒，因为默认值似乎非常过度。使用异步调用，如果没有send()命令，它似乎不会执行任何操作。

- AnhMV · Answer 6

对我来说有效，使用iframe忽略浏览器显示GET错误信息

 var imgFrame = $('<iframe><img src="' + path + '" /></iframe>');
 if ($(imgFrame).find('img').attr('width') > 0) {
     // do something
 } else {
     // do something
 }

- MadcapLaugher · Answer 7

你需要做的是向服务器发送请求以进行检查，然后将结果发送回给你。

你想要与哪种类型的服务器通信？你可能需要编写一个小服务来响应该请求。

- Gianlorenzo Lenza · Answer 8

我想要一个返回布尔值的函数，但我遇到了与闭包和异步相关的问题。我是这样解决的：

checkFileExistence= function (file){
    result=false;
    jQuery.ajaxSetup({async:false});
    $.get(file)
        .done(function() {
           result=true;
        })
        .fail(function() {
           result=false;
        })
    jQuery.ajaxSetup({async:true});
    return(result);
},

- timgavin · Answer 9

这并没有回答楼主的问题，但对于那些从数据库返回结果的人来说，这是我使用的一种简单方法。

如果用户没有上传头像，则 avatar 字段将是 NULL，因此我会从 img 目录中插入默认头像图像。

function getAvatar(avatar) {
    if(avatar == null) {
        return '/img/avatar.jpg';
    } else {
        return '/avi/' + avatar;
    }
}

那么

<img src="' + getAvatar(data.user.avatar) + '" alt="">