[Tip] IsAjaxRequest siempre retorna falso usando AngularJS y ASP.NET MVC

Hoy les quiero compartir un tip que me sirvió para resolver un inconveniente que tenía al tratar de realizar una petición AJAX sobre una acción en ASP.NET MVC, la cual se estaba haciendo a través de $http con AngularJS.

Para el ejemplo, el código que se tiene en la acción del controlador ASP.NET MVC está construido para retornar un JSON cuando se tiene un AJAX request y para retornar una vista cuando es otro caso, así:

public ActionResult Index()
{
    var productos = ConsultarProductos();
 
    if (Request.IsAjaxRequest())
    {
        return Json(productos, JsonRequestBehavior.AllowGet);
    }
 
    return View(productos);
}

Este código funciona muy bien cuando se hace una petición AJAX con jQuery porque el método IsAjaxRequest retorna true. Pero resulta que al tratar de hacer la misma petición con una llamada desde AngularJS el método IsAjaxRequest siempre retorna false. Al analizar en detalle el por qué del error, resulta que ASP.NET MVC busca el header HTML X-Requested-With en el método IsAjaxRequest para determinar si es una petición AJAX o no, y este encabezado es enviado en jQuery por defecto, pero no en AngularJS.

Y bien, una vez entendido el problema, ahora la solución: nosotros podemos configurar el $httpProvider de AngularJS para que siempre envíe el encabezado requerido en cualquier parte de nuestra aplicación. Esto lo hacemos así:

// Declaración de aplicación de Angular.js
var app = angular.module('app', []);
 
app.config(['$httpProvider'function ($httpProvider) {
    // Adición de HTTP header por default
    $httpProvider.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
}]);

Es todo por este post, espero que les sea de utilidad. Hasta una próxima.

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: