AngularJs routeProvider http status 403

Question

I'm doing authentication and authorization in the server side.

In angularJs I'm doing the routing using the routeProvider like this.

$routeProvider.
        when('/', {
            templateUrl: 'partials/_home',
            controller: 'HomeCtrl'
        }).
        when('/home', {
            templateUrl: 'partials/_home',
            controller: 'HomeCtrl'
        }).
        when('/users', {
            templateUrl: 'partials/_users',
            controller: 'UserCtrl'
        }).
        when('/users/:id', {
            templateUrl: 'partials/_userForm',
            controller: 'UserCtrl'
        }).
        otherwise({
            redirectTo: '/'
        });

And here is the problem to solve, when I get a 403 angular is not showing the server page, it just does not do nothing.

enter image description here

Did some one has a suggestion of how to handle this?

Error 403 „Execute access forbidden” – try to open URL `/test/partials/_userForm` – what you have in response? It has nothing in common with AngularJS, it is your server. What you expect from Angular if 403 happens? Redirect to some login page? — Krzysztof Safjanowski, Jul 30 '14 at 17:12
Yes it's the server response, what I want is to show the content of that 403 error page. but angular is not showing nothing when it gets that error. — Charlires, Jul 30 '14 at 17:14
I am facing the same error, but I want to show the template, what is the best practice to handle this scenario? — ronnyfm, Mar 28 '16 at 22:23

Krzysztof Safjanowski · Accepted Answer · 2016-10-05T08:08:19.263

AngularJS Interceptors - updated to v1.4.2

The interceptors are service factories that are registered with the $httpProvider by adding them to the $httpProvider.interceptors array. The factory is called and injected with dependencies (if specified) and returns the interceptor.

To read more: $http angularjs Doc

Section config (part of it)

.config(function ($httpProvider) {
    $httpProvider.interceptors.push('responseObserver');
})

Response - observer factory

403.html and 500.html are existing HTML files, nice styled with some help content for user.

.factory('responseObserver', function responseObserver($q, $window) {
    return {
        'responseError': function(errorResponse) {
            switch (errorResponse.status) {
            case 403:
                $window.location = './403.html';
                break;
            case 500:
                $window.location = './500.html';
                break;
            }
            return $q.reject(errorResponse);
        }
    };
});

To extend knowledge about interceptors: http://djds4rce.wordpress.com/2013/08/13/understanding-angular-http-interceptors/

Don't you add `$window` as a dependency? Otherwise, it works. — Martin Velez, Sep 11 '15 at 23:44

AngularJs routeProvider http status 403

1 Answers1

AngularJS Interceptors - updated to v1.4.2

Section config (part of it)

Response - observer factory

Linked