Как вы обрабатываете ошибки от вызовов AJAX?

Question

Допустим, у меня есть следующий вызов jQuery AJAX:

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
        // Do stuff
   }
 });

Теперь, когда сделан этот вызов AJAX, я хочу, чтобы серверный код проходил несколько проверок ошибок (например, пользователь все еще вошел в систему, имеют ли они разрешение на использование этого вызова, действительны ли данные и т. Д. ). Если обнаружена ошибка, как отправить сообщение об ошибке обратно на клиентскую сторону?

Моя первоначальная мысль состояла в том, чтобы вернуть объект JSON с двумя полями: error и errorMessage. Эти поля будут затем проверены в вызове jQuery AJAX:

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
       if (result.error == "true") 
       {
           alert("An error occurred: " & result.errorMessage);
       }
       else 
       {
           // Do stuff
       }
   }
 });

Мне это кажется немного неуклюжим, но это работает. Есть ли лучшая альтернатива?

Answer 1

Лично у меня есть код, подобный следующему коду в моей библиотеке.

$.ajaxSetup({
    error: function(xhr){
        alert('Request Status: ' + xhr.status + ' Status Text: ' + xhr.statusText + ' ' + xhr.responseText);
    }
});

jQuery docs Ajax / jQuery.ajaxSetup

Лучший способ передать эту ошибку со стороны сервера (используя php) на сторону клиента - это отправить заголовок через запрос Ajax где-то в 400-х годах (что всегда связано с ошибками). Как только Ajax-запрос получит это, он вызовет вашу функцию ошибки. Это также означает, что вам не нужно определять ошибку: вызов при каждом вызове $ .ajax.

header('HTTP/1.0 419 Custom Error');

Цитата из Информация о заголовке w3.org

Ошибка 4xx, 5xx Коды 4xx предназначены для случаев, когда клиент, по-видимому, допустил ошибку, а коды 5xx для случаев, когда сервер знает, что сервер допустил ошибку. В целом невозможно различить эти случаи, поэтому разница носит исключительно информационный характер. Раздел тела может содержать документ, описывающий ошибку в удобочитаемой форме. Документ представлен в формате MIME и может быть только в формате text / plain, text / html или в формате, указанном как приемлемый в запросе.

Answer 2

$.ajax({
   type: "POST",
   url: "MyUrl",
   data: "val1=test",
   success: function(result){
        // Do stuff
   },
   error: function(request,status,errorThrown) {
        // There's been an error, do something with it!
        // Only use status and errorThrown.
        // Chances are request will not have anything in it.
   }
 });

Answer 3

Не принимает ли функция jQuery ajax в конце еще один параметр, обратный вызов для неудачных вызовов? Если это так, просто добавьте fail:function(...){..} после успешного обратного вызова.

Answer 4

Уже довольно поздно отвечать на этот вопрос, но я думаю, что кому-то будет полезно использовать es6 и jquery 2.2.

Я обычно следую этому (отложенному подходу) в своем коде

sendAjaxRequest(URL, dataToSend) {
    return $.ajax({
        type        : 'POST',
        url         : URL,
        data        : JSON.stringify(dataToSend),
        dataType    : 'json'
    }).fail((responseData) => {
        if (responseData.responseCode) {
            console.error(responseData.responseCode);
        }
    });
},

Я добавил отложенный метод fail, который будет вызываться при возникновении ошибки. Это альтернативная конструкция для опции обратного вызова с ошибкой, метод .fail () заменяет устаревший метод .error () в последнем jquery.

Далее с места звонка sendAjaxRequest Я использую then jquery Обещание обратного вызова

sendAjaxRequest(URL, dataToSend)
.then(
     (success) => {
     },
     (error) => {
     }
);

Он будет вызывать функцию успеха или ошибки на основе ответа, полученного от сервера.

Answer 5

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