Как проверить, существует ли файл jQuery или чистый JavaScript?

Как проверить, существует ли файл на моем сервере в jQuery или чистом JavaScript?

ОТВЕТЫ

Ответ 1

С помощью jQuery:

$.ajax({
    url:'http://www.example.com/somefile.ext',
    type:'HEAD',
    error: function()
    {
        //file not exists
    },
    success: function()
    {
        //file exists
    }
});

EDIT:

Вот код для проверки статуса 404 без использования jQuery

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

Небольшие изменения, и вместо этого он может проверить статус статуса HTTP-кода 200 (успех).

Ответ 2

Аналогичный и более современный подход.

$.get(url)
    .done(function() { 
        // exists code 
    }).fail(function() { 
        // not exists code
    })

Ответ 3

Это работает для меня:

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

Ответ 4

я использовал этот script, чтобы добавить альтернативное изображение

function imgError()
{
alert('The image could not be loaded.');
}

HTML:

<img src="image.gif" onerror="imgError()" />

http://wap.w3schools.com/jsref/event_onerror.asp

Ответ 5

Пока вы тестируете файлы в том же домене, это должно работать:

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); до req.open('HEAD', url, false);

Ответ 6

У меня возникала проблема с перекрестными доменами при попытке запустить ответ на этот вопрос, поэтому я пошел с:

function UrlExists(url) {
$('<img src="'+ url +'">').load(function() {
    return true;
}).bind('error', function() {
    return false;
});
}

Кажется, отлично работает, надеюсь, что это поможет кому-то!

Ответ 7

Вот как это сделать ES7, если вы используете транспилятор Babel или Typescript 2:

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;
  }
}

Затем внутри вашей другой области async вы можете легко проверить, существует ли url:

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

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

Ответ 8

Я использую этот script, чтобы проверить, существует ли файл (также он обрабатывает проблему с перекрестным происхождением):

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

Обратите внимание, что следующая синтаксическая ошибка возникает, когда проверяемый файл не содержит JSON.

Неподготовленный SyntaxError: Неожиданный токен <

Ответ 9

Для клиентского компьютера это может быть достигнуто с помощью:

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")
}

Это моя программа для передачи файла в определенное место и показывает предупреждение, если оно не существует

Ответ 10

Сначала создается функция

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

Ответ 11

Функция JavaScript для проверки наличия файла:

function doesFileExist(urlToFile)
{
    var xhr = new XMLHttpRequest();
    xhr.open('HEAD', urlToFile, false);
    xhr.send();

    if (xhr.status == "404") {
        console.log("File doesn't exist");
        return false;
    } else {
        console.log("File exists");
        return true;
    }
}

Ответ 12

Это адаптация к принятому ответу, но я не мог получить то, что мне нужно от ответа, и мне пришлось проверять это, так как это было догадкой, поэтому я размещаю свое решение здесь.

Нам нужно было проверить, существует ли локальный файл, и разрешить открывать файл (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");

    }
});

Ответ 13

Что вам нужно сделать, это отправить запрос на сервер, чтобы он выполнил проверку, а затем отправил обратно результат.

С каким сервером вы пытаетесь общаться? Возможно, вам потребуется написать небольшую услугу, чтобы ответить на запрос.

Ответ 14

Асинхронный вызов, чтобы увидеть, существует ли файл, является лучшим подходом, поскольку он не ухудшает работу пользователя, ожидая ответа с сервера. Если вы вызываете .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 );
  }
}

источник: https://xhr.spec.whatwg.org/

Ответ 15

Это не относится к вопросу OP, но для тех, кто возвращает результаты из базы данных: здесь используется простой метод.

Если пользователь не загрузил аватар, поле avatar будет NULL, поэтому я бы вставлял изображение аватара по умолчанию из каталога img.

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

затем

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

Ответ 16

Это работает для меня, используйте iframe для игнорирования браузеров, показывая сообщение об ошибке GET

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

Ответ 17

Мне нужна функция, которая возвращает логическое значение, я столкнулся с проблемами, связанными с закрытием и асинхронностью. Я решил так:

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);
},