I did use an http interceptor to handle 401 response status like following
var expiredSessionInterceptor = function ($q,$window) {
return {
request: function (config) {
return config;
},
requestError: function (rejection) {
// Contains the data about the error on the request and return the promise rejection.
return $q.reject(rejection);
},
response: function (response) {
return response;
},
responseError: function (response) {
if (response.status == 401) {
$window.location.href = '/Cortex_IP/j_spring_security_logout.do';
}
return $q.reject(response);
}
};
};
and it works every other ajax call expect select2 and its not intercepted by the above one .,
The select2 box continue loading (busy) when 401 error occurs.
Any one help me to handle 401 error in select2 in angularjs
Related
I am trying to add an interceptor in my main config file,below is the code.But I am getting the above error after adding the log. Googled but didn't get much help.Kindly help if anyone faced this error before.
// Intercept http calls.
$provide.factory('HttpResponseInterceptor', ['$q', '$log', function ($q, $log) {
return {
// On request success
request: function (config) {
$log.info('HttpInterceptor Request object' + config); // Contains the data about the request before it is sent.
// Return the config or wrap it in a promise if blank.
return config || $q.when(config);
},
// On request failure
requestError: function (rejection) {
$log.error('HttpInterceptor Request Failure' + rejection); // Contains the data about the error on the request.
// Return the promise rejection.
return $q.reject(rejection);
},
// On response success
response: function (response) {
$log.info('HttpInterceptor Success Response' + response); // Contains the data from the response.
// Return the response or promise.
return response || $q.when(response);
},
// On response failture
responseError: function (rejection) {
$log.error('HttpInterceptor Response Failure' + rejection); // Contains the data about the error.
// Return the promise rejection.
return $q.reject(rejection);
}
};
}]);
$httpProvider.interceptors.push('HttpResponseInterceptor');
I want to capture all request going out from my one page application like clicking on different tab or any hyperlink.
I have written an interceptor and want to put a ajax call for all request.
.factory('httpRequestInterceptor', function($q,$http){
return {
request: function($http,config){
window.alert(config.url);
var dummyValue = $http.get("url");
return config;
}
}
})
.config(function($httpProvider) {
$httpProvider.interceptors.push('httpRequestInterceptor');
});
I think you are in search of http logger kind of factory. You can use this one
.config(function ($provide, $httpProvider) {
// Intercept http calls.
$provide.factory('MyHttpInterceptor', function ($q) {
return {
// On request success
request: function (config) {
console.log(config); // Contains the data about the request before it is sent.
// Return the config or wrap it in a promise if blank.
return config || $q.when(config);
},
// On request failure
requestError: function (rejection) {
console.log(rejection); // Contains the data about the error on the request.
// Return the promise rejection.
return $q.reject(rejection);
},
// On response success
response: function (response) {
console.log(response); // Contains the data from the response.
// Return the response or promise.
return response || $q.when(response);
},
// On response failture
responseError: function (rejection) {
console.log(rejection); // Contains the data about the error.
// Return the promise rejection.
return $q.reject(rejection);
}
};
});
// Add the interceptor to the $httpProvider.
$httpProvider.interceptors.push('MyHttpInterceptor');
});
I tested, it works for routeProvider navigation as well. For more information please check this blog https://djds4rce.wordpress.com/2013/08/13/understanding-angular-http-interceptors/
$resource calls some API. If it returns some flag, than request should drop to .catch() section of $resource('api/').get(...).$promise.catch();
My interceptor does not trigger that call. It calls .then in any case
Interceptor code:
.factory('SomeHTTPInterceptor', function($q) {
return {
response: function(response) {
if (response.data.someFlag) {
return $q.reject(response);
}
return response;
}
};
})
How to get same response, but in catch section w/o checking for error in every single request?
You have to use the responseError handler as per doc
responseError: interceptor gets called when a previous interceptor threw an error or resolved with a rejection.
.factory('SomeHTTPInterceptor', ['$q', function($q) {
return {
// optional method
'responseError': function(rejection) {
if (rejection.data.someFlag) {
// do something
}
return $q.reject(rejection);
}
};
}]);
I am trying to set up an interceptor to catch 403 responses.
In my config function I have added this to test things out
$httpProvider.interceptors.push(function($q) {
return {
request: function(config) {
console.log('test');
},
responce: function(responce) {
console.log(responce);
if(responce.status === 403) {
console.log('403')
}
return responce || $q.when(responce);
},
responceError: function(rejection) {
console.log(rejection);
if(rejection.status === 403) {
console.log('403', rejection);
}
return $q.reject(rejection);
}
}
});
When I reload the page I get the following output to console:
TypeError: Cannot read property 'headers' of undefined
test
In an infinite loop that crashes the browser tab
If I remove the request method from the object then I never get anything output to console
I am using Angular version: 1.2.22
The first problem is that your request callback is not returning the config parameter, check the $http interceptors documentation:
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 second problem is you are spelling response incorrectly, simply change responce and responceError to response and responseError respectively.
DEMO
$httpProvider.interceptors.push(function($q) {
return {
request: function(config) {
console.log('test');
return config;
},
response: function(response) {
console.log(response);
if(response.status === 403) {
console.log('403')
}
return response || $q.when(response);
},
responseError: function(rejection) {
console.log(rejection);
if(rejection.status === 403) {
console.log('403', rejection);
}
return $q.reject(rejection);
}
}
});
Response is spelled with an s, not with a c.
I'd like to implement authentication on a single page web app with Angular.js. The official Angular documentation recommends the using of interceptors:
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
return {
// ...
'responseError': function(rejection) {
// do something on error
if (canRecover(rejection)) {
return responseOrNewPromise
}
return $q.reject(rejection);
}
};
});
The problem is when the server sends 401 error, the browser immediately stops with "Unauthorized" message, or with login pop-up window (when authentication HTTP header is sent by the server), but Angular can't capture with it's interceptor the HTTP error to handle, as recommended. Am I misunderstanding something? I tried more examples found on web (this, this and this for example), but none of them worked.
For AngularJS >1.3 use $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');
}])
in app config block:
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);
}
}];
I don't know why, but response with 401 error goes into success function.
'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);
}
AngularJS interceptors only work for calls made with the $http service; if you navigate to a page that returns a 401, AngularJS never even runs.