web-dev-qa-db-fra.com

Capture HTTP 401 avec un intercepteur Angular.js

J'aimerais implémenter l'authentification sur une application Web à une seule page avec Angular.js. Le official Angular documentation recommande l'utilisation d'intercepteurs:

$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
  return {

    // ...

    'responseError': function(rejection) {
      // do something on error
      if (canRecover(rejection)) {
        return responseOrNewPromise
      }
      return $q.reject(rejection);
    }
  };
});

Le problème est que lorsque le serveur envoie une erreur 401, le navigateur s’arrête immédiatement avec le message "Unauthorized" ou avec une fenêtre de connexion (lorsque l’en-tête d’authentification HTTP est envoyé par le serveur), mais Angular ne peut pas capturer avec son intercepteur l'erreur HTTP à gérer, comme recommandé. Est-ce que je comprends mal quelque chose? J'ai essayé plusieurs exemples trouvés sur le Web ( this , this et this par exemple), mais aucun d'entre eux n'a fonctionné.

angularjsauthentication
45
Csati

dans le bloc de configuration d'application:

var interceptor = ['$rootScope', '$q', "Base64", function(scope, $q, Base64) {
  function success(response) {
    return response;
  }

  function error(response) {
    var status = response.status;
    if (status == 401) {
      //AuthFactory.clearUser();
      window.location = "/account/login?redirectUrl=" + Base64.encode(document.URL);
      return;
    }
    // otherwise
    return $q.reject(response);
  }
  return function(promise) {
    return promise.then(success, error);
  }
}];
26
Gecko IT

Pour AngularJS> 1.3, utilisez $httpProvider.interceptors.Push('myHttpInterceptor');

.service('authInterceptor', function($q) {
    var service = this;

    service.responseError = function(response) {
        if (response.status == 401){
            window.location = "/login";
        }
        return $q.reject(response);
    };
})
.config(['$httpProvider', function($httpProvider) {
    $httpProvider.interceptors.Push('authInterceptor');
}])
62
Igor S.

Je ne sais pas pourquoi, mais la réponse avec l'erreur 401 entre dans la fonction de réussite.

'responseError': function(rejection)
                {
                    // do something on error

                    if (rejection.status == 401)
                    {
                        $rootScope.signOut();
                    }

                    return $q.reject(rejection);
                },
                'response': function (response) {
                    // do something on error
                    if (response.status == 401) {
                        $rootScope.signOut();
                    };
                    return response || $q.when(response);
                }
8
vikdet

Les intercepteurs AngularJS ne fonctionnent que pour les appels passés avec le service $ http; Si vous accédez à une page qui renvoie un 401, AngularJS ne s'exécutera jamais.

7
ejain