¿Cómo obtener el código de estado de respuesta de jQuery.ajax?

230

En el siguiente código, todo lo que intento hacer es obtener el código de respuesta HTTP de una llamada jQuery.ajax. Luego, si el código es 301 (movido permanentemente), muestre el encabezado de respuesta 'Ubicación':

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title>jQuery 301 Trial</title>
  <script src="http://code.jquery.com/jquery-1.5.1.min.js"></script>

  <script type="text/javascript">
  function get_resp_status(url) {
    $.ajax({
      url: url,
      complete: function (jqxhr, txt_status) {
        console.log ("Complete: [ " + txt_status + " ] " + jqxhr);
        // if (response code is 301) {
        console.log ("Location: " + jqxhr.getResponseHeader("Location"));
        // }
      }
    });
  }
  </script>
  <script type="text/javascript">
  $(document).ready(function(){
    $('a').mouseenter(
      function () {
        get_resp_status(this.href);
      },
      function () {
      }
    );
  });
  </script>
</head>
<body>
  <a href="http://ow.ly/4etPl">Test 301 redirect</a>
  <a href="http://cnn.com/not_found">Test 404 not found</a>
</body>
</html>

¿Alguien puede señalar dónde me estoy equivocando? Cuando verifico el objeto 'jqxhr' en Firebug, no puedo encontrar el código de estado ni el encabezado de respuesta 'Ubicación'. Establecí el punto de interrupción en la última línea de 'completar'.

Muchas gracias.

Mahesh
fuente
Sé que esto es viejo, pero creo que lo resolví (XHR.responseURL): stackoverflow.com/a/39416846/4946681
Nate

Respuestas:

221

Veo el campo de estado en el objeto jqXhr, aquí hay un violín que funciona:

http://jsfiddle.net/magicaj/55HQq/3/

$.ajax({
    //...        
    success: function(data, textStatus, xhr) {
        console.log(xhr.status);
    },
    complete: function(xhr, textStatus) {
        console.log(xhr.status);
    } 
});
Adam Ayres
fuente
2
Parece estar funcionando en jsFiddle. Basado en eso y en la documentación de jQuery, xhr.status debería hacer lo que quiero. Sin embargo, cuando intento lo mismo en mi código original (txt_status reemplazado por jqxhr.status), sigo obteniendo jqxhr.status de 0. Aquí hay una captura de pantalla: twitpic.com/4alsqj
Mahesh
10
Creo que el problema es que no se está ejecutando contra un servidor web sino localmente desde el sistema de archivos. Creo que si enciende un servidor web local, esto funcionaría correctamente, aquí hay algunos artículos sobre el tema: pearweb.com/javascript/XMLHttpRequest.html developer.mozilla.org/En/Using_XMLHttpRequest "La clave a tener en cuenta aquí es que el estado del resultado se compara con 0 para el éxito en lugar de 200. Esto se debe a que los esquemas de archivos y ftp no usan códigos de resultados HTTP ".
Adam Ayres
esto es genial. Especialmente cuando puedo hacer que mi servidor envíe códigos de estado.
thatmiddleway
Tenga en cuenta que si la respuesta es un estado de redireccionamiento como 302, esto dará 200
Contador م
52

Encontré este viejo hilo buscando una solución similar yo mismo y encontré que la respuesta aceptada estaba usando el .complete()método de jquery ajax. Cito el aviso en el sitio web de jquery aquí:

Las devoluciones de llamada jqXHR.success (), jqXHR.error () y jqXHR.complete () están en desuso a partir de jQuery 1.8. Para preparar su código para su eventual eliminación, use jqXHR.done (), jqXHR.fail () y jqXHR.always () en su lugar.

Para conocer la status coderespuesta de ajax, se puede usar el siguiente código:

$.ajax( url [, settings ] )
.always(function (jqXHR) {
    console.log(jqXHR.status);
});

Funciona de manera similar para .done()y.fail()

cara
fuente
2
Esto está volviendo "indefinido"
Pedro Joaquín
43

Probablemente sea más idiomático jQuery usar la propiedad statusCode del objeto de parámetro pasado a la función $ .ajax:

$.ajax({
  statusCode: {
    500: function(xhr) {
      if(window.console) console.log(xhr.responseText);
    }
  }
});

Sin embargo, como dijo Livingston Samuel , no es posible detectar códigos de estado 301 en javascript.

rstackhouse
fuente
41

Cuando su solicitud XHR devuelve una respuesta de redireccionamiento (estado HTTP 301, 302, 303, 307), XMLHttpRequest sigue automáticamente la URL redirigida y devuelve el código de estado de esa URL .

Puede obtener los códigos de estado sin redireccionamiento (200, 400, 500, etc.) a través de la statuspropiedad del objeto xhr.

Así no se puede obtener la ubicación redirigida desde la cabecera de la respuesta de un 301, 302, 303o 307petición.

Es posible que tenga que cambiar la lógica de su servidor para responder de una manera que pueda manejar la redirección, en lugar de dejar que el navegador lo haga. Un ejemplo de implementación .

Livingston Samuel
fuente
24

Puede verificar el contenido de su respuesta, solo console.log y verá que la propiedad tiene un código de estado. Si no entiende jsons, consulte el video: https://www.youtube.com/watch?v=Bv_5Zv5c-Ts

Explica conocimientos muy básicos que te permiten sentirte más cómodo con javascript.

Puede hacerlo con una versión más corta de la solicitud ajax, consulte el código anterior:

$.get("example.url.com", function(data) {
                console.log(data);
            }).done(function() {
               // TO DO ON DONE
            }).fail(function(data, textStatus, xhr) {
                 //This shows status code eg. 403
                 console.log("error", data.status);
                 //This shows status message eg. Forbidden
                 console.log("STATUS: "+xhr);
            }).always(function() {
                 //TO-DO after fail/done request.
                 console.log("ended");
            });

Ejemplo de salida de consola:

error 403 
STATUS: Forbidden 
ended
Przemysław Sienkiewicz
fuente
1
Gracias por proporcionar el código completo de cómo usar done, fail y siempre, con parámetros de función completos.
IvanD
4

jqxhr es un objeto json:

devoluciones completas:
el objeto jqXHR (en jQuery 1.4.x, XMLHTTPRequest) y una cadena que categoriza el estado de la solicitud ("éxito", "no modificado", "error", "tiempo de espera", "aborto" o "error de análisis") .

ver: jQuery ajax

entonces harías:

jqxhr.status para obtener el estado

Naftali aka Neal
fuente
2

NB: Usando jQuery 3.4.1

$.ajax({
  url: URL,
  success: function(data, textStatus, jqXHR){
    console.log(textStatus + ": " + jqXHR.status);
    // do something with data
  },
  error: function(jqXHR, textStatus, errorThrown){
    console.log(textStatus + ": " + jqXHR.status + " " + errorThrown);
  }
});
SurfSanta
fuente