Manejar HTTP 302 respuesta desde proxy en angularjs

http-status-code-302

Question

Tengo un proxy inverso que comprueba la autenticación global para varias aplicaciones. Cuando el usuario se desconecta pero aún intenta usar mi aplicación, el proxy envía una respuesta 302:

HTTP/1.1 302 Found
Date: Wed, 11 Sep 2013 09:05:34 GMT
Cache-Control: no-store
Location: https://other.url.com/globalLoginPage.html
Content-Length: 561
Content-Type: text/html; charset=iso-8859-1
Via: 1.1 my-proxy.com
Connection: Keep-Alive

En angularJs, se devuelve la llamada de error, pero los encabezados de respuesta están vacíos, el estado es 0 y los datos son una cadena vacía. Entonces parece que realmente no puedo hacer nada para manejar la respuesta ...
He visto varias preguntas sobre el tema, y ​​aún no entiendo qué sucede (¿CORS debido al proxy o un dominio diferente en la ubicación? ¿¿302 comportamiento del navegador?).
En particular, hay una parte de una respuesta ( https://stackoverflow.com/a/17903447/1093925 ):

Nota: Si su servidor establece un código de respuesta de 301 o 302, no podrá obtener el encabezado de ubicación, ya que será seguido de forma automática y transparente por el objeto XMLHttpRequest.

¿Qué pasa con este objeto XMLHttpRequest?
En una versión muy antigua de Chrome (no se puede usar una versión más reciente) puedo ver una solicitud correspondiente en el panel de red, pero parece fallar porque no hay respuesta.
En la última versión de Firefox, no hay nada que hacer.

¿Puedo hacer algo al respecto, ya que no puedo cambiar la configuración y la respuesta del proxy?

Actualizar:
Repetí mi escenario hoy, y gracias a una versión más reciente de firebug, pude obtener más detalles sobre lo que está sucediendo.
No estaba lejos de la respuesta en mi pregunta: la política de dominios cruzados.
Dado que es una solicitud HTTP hecha por mi aplicación, el navegador niega el siguiente XMLHttpRequest (que en la aplicación se parece a la misma solicitud). De ahí el error y la respuesta vacía.
Así que creo que no hay nada especial que pueda hacer al respecto.

Answer 1

Su 302 -Redirect está siendo manejado directamente por el navegador y no hay nada que pueda hacer al respecto directamente. Sin embargo, puedes usar un httpInterceptor para ayudarte. Tendrá que incluir $httpProvider en la lista de DI de su aplicación, y luego, en alguna parte de su función de configuración, coloque una referencia a esta como esta:

$httpProvider.responseInterceptors.push(''HttpInterceptor'');

Un interceptor de muestra se ve así:

window.angular.module(''HttpInterceptor'', [])
.factory(''HttpInterceptor'', [''$q'', ''$injector'',
    function($q, $injector) {
        ''use strict'';

        return function(promise) {
            return promise.then(success, error);
        };

        function success(response) {
            return response;
        }

        function error(response) {
            var isAuthRequest = (response.config.url.indexOf(''/v1/rest/auth'') !== -1);

            //if we are on the authenticating don''t open the redirect dialog
            if (isAuthRequest) {
                return $q.reject(response);
            }

            //open dialog and return rejected promise
            openErrorDialog(response);
            return $q.reject(response);
        }

        function openErrorDialog(response) {
            $injector.get(''$dialog'').dialog({
                backdropFade: true,
                dialogFade: true,
                dialogClass: ''modal newCustomerModal'',
                resolve: {
                    errorData: function() {
                        return response.data;
                    },
                    errorStatus: function() {
                        return response.status;
                    }
                }
            })
            .open(''/views/error-dialog-partial.htm'',
                ''errorDialogController'')
            .then(function(response) {
                if (response) {
                    window.location = ''/'';
                }
            });
        }
    }
]);

Answer 2

Tuve el mismo problema en mi aplicación. Realmente no se puede "atrapar" una respuesta de redireccionamiento 302. El navegador lo atrapa antes de que Angular lo ponga en la mano. así que en realidad, cuando recibas tu respuesta, ya es demasiado tarde.

La mala noticia : no es un problema en la plataforma angular. XmlHttpRequest no admite este tipo de comportamiento, y el navegador actúa antes de que pueda hacer algo al respecto. referencia: evitar la redirección de Xmlhttprequest

La buena noticia : hay muchas maneras de evitar este problema, al interceptar la respuesta, y encontrar alguna manera de reconocer que es su 302. amable. Esto es un truco, pero es lo mejor que puede hacer en este momento.

Asi que. Por ejemplo, en mi aplicación, la redirección fue nuevamente a la página login.html de la aplicación, y en la aplicación obtuve la respuesta con un estado 200 y los datos de la respuesta eran el contenido de mi página login.html. así que en mi interceptor, verifiqué si el resultado es una cadena (generalmente no! así que no hay problemas de eficiencia ...) y si es así, si es mi página login.html. De esa manera, podría capturar el redireccionamiento y manejarlo a mi manera.

yourApp.factory(''redirectInterceptor'', [''$location'', ''$q'', function($location, $q) {
    return function(promise) {
        promise.then(
            function(response) {
                if (typeof response.data === ''string'') {
                    if (response.data.indexOf instanceof Function &&
                        response.data.indexOf(''<html id="ng-app" ng-app="loginApp">'') != -1) {
                        $location.path("/logout");
                        window.location = url + "logout"; // just in case
                    }
                }
                return response;
            },
            function(response) {
                return $q.reject(response);
            }
        );
        return promise;
    };
}]);

Luego inserte este interceptor en su aplicación. algo como esto:

$httpProvider.responseInterceptors.push(''redirectInterceptor'');

buena suerte.

Answer 3

Tuve un problema muy similar, y consideré la solución provista por Ofer Segev, pero verificando el contenido de la respuesta para ver si coincidía con un fragmento html de otra página me parecía demasiado intrépido. ¿Qué pasa cuando alguien cambia esa página?

Afortunadamente, también tuve el control del backend, así que en lugar de devolver un 302 (Redirigir), devolví un 403 (Prohibido) y pasé la ubicación deseada en los encabezados. A diferencia del 302, el 403 se manejará en su controlador de errores, donde podrá decidir qué hacer a continuación. Aquí estaba mi controlador resultante:

function ($scope, $http) {
    $http.get(_localAPIURL).then(function (response) {
            // do what I''d normally do
        }, function (response) {
        if (response.status == 403)
        {
            window.location.href = response.headers().location;
        }
        else
        {
            // handle the error
        }