Prevent $http service execution using Interceptor

Question

I am building an authentication solution with Angular. I am using Interceptors to validate Request and if there is not valid token prevent from further processing and redirect. Here is my simplified Interceptor:

prism.service('APIInterceptor', function($rootScope) {
var service = this;

service.request = function(config) { 
    .....
    return config;
  };
})

Just for the sake of POC that I am working on what would the correct way of stopping this request from any further processing be?

Thanks

Yes, it will not go for data, but in the Console it says: TypeError: Cannot read property 'headers' of null — Mark
– Mark, Commented Sep 17, 2015 at 18:32
Try printing out the config object, see what methods and fields are available within it. If you can't outright cancel the XHR request from initiating, perhaps you can just point it at an invalid URL. This will still throw a 404, but it shouldn't break anything really. — CollinD
– CollinD, Commented Sep 17, 2015 at 18:35

Mike Quinlan · Accepted Answer · 2015-09-17 19:22:16Z

1

From the Angular Docs on Interceptors for the request method:

request: interceptors get called with a http config object. The function is free to modify the config object or create a new one. The function needs to return the config object directly, or a promise containing the config or a new config object.

The rest of the documentation can be found here. From this you can see that the method can also return a promise (which is actually pretty awesome) so you could always reject it.

Try something like this:

prism.service('APIInterceptor', function($q, $rootScope) {
  this.request = function(config) {
    if( /*config is not valid*/ ) {
      return $q.reject({message: 'ERROR, ERROR... INTRUDER ALERT!', status: 401, config: config});
    } else {
      return config;
    }
  };
});

And see how it might be handled (I have no idea what your application will do). Let me know if it works out for you!

EDIT: My answer has been accepted, but is incomplete and it will haunt me forever if I don't complete it. So, after writing some test code of my own I've realized that you can do 1 of 2 things in this situation. The first is to handle the unauthorized request in the interceptor:

...
this.request = function(config) {
  if(/* config is not authorized */) {
    // Do something here like redirect/issue another request... whatever
    return $q.reject({/*whatever the hell you want*/});
  } else ...
};
...

This obviously works best if you want to handle all unauthorized requests the same. If you don't, however, the second option is to defer to the service that issued the request. For example, if you're using $http you can do this:

$http.get('/words/words/words/').then(function(){
  // This is where you handle a successful request.
}, function(error) {
  // Handle your error here. Please take note that this error message is
  // whatever you sent back in the `reject` previously
});

Hopefully that clears a few things up.

edited Sep 17, 2015 at 19:22

answered Sep 17, 2015 at 18:45

Mike Quinlan

2,88219 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Mark Over a year ago

I tried to return your code. The processing was stopped, but I did not see any alert messages if that is what you were expecting.

Mike Quinlan Over a year ago

The message is probably returned to the $http.get('.../someroute/').error(function(error){}); callback. However, if your plan of action when authorization fails is application wide, you can write whatever logic you want in that conditional to either redirect/notify other services without having to deal with the error you were getting. If your plan of action differs on a per-request basis, you should try the error callback

Mark Over a year ago

Well, it returns to response = response.then(function (data) { return data.data; }); It would be nice to return back to response.catch(function (data) { $q.reject(data); });

Collectives™ on Stack Overflow

Prevent $http service execution using Interceptor

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related