I am implementing an angularjs service, which saves the data sent by an $http call in localStorage. In order to do that, I am using the request interceptor, so that whenever an http request is sent via $http, the data is saved in localStorage. Below is my code for the interceptor,
var OfflinkJs = angular.module('OfflinkJs', []);
OfflinkJs.factory('cacheInterceptor', function () {
var cacheInterceptor = {
request: function (config) {
// Here I am saving the config as a string in localstorage
return config;
}
};
return cacheInterceptor;
});
For above interceptor to work, I have to register it in the interceptors array of $httpProvider. I have done this to achieve that,
OfflinkJs.config(['$httpProvider', function ($httpProvider) {
$httpProvider.interceptors.push('cacheInterceptor');
}]);
PROBLEM
Now, when I use OfflinkJS module in another module, all the $http calls go through my interceptor. But I would like to make some requests sent by $http service use my interceptor while some other requests NOT.
Since $http service is a singleton, I cannot figure out how to use two instances of it in separate places of my application. Is there any way to achieve this?
I went through this question, but seems it really addresses the issue of Circular dependency
I need two instances of AngularJS $http service or what?
I check the URL in the interceptor and use that to filter out requests to other services. I set the base url for my service as a constant in my module, and then check against that. If the request isn't to the relevant service, it just passes through with no action.
But perhaps a better way would be to set up a data service instead of an interceptor. There are plenty of tutorials out there on data services.
Related
I need one help for Angular js.
I need make the 400 service calls when click on button, but it is taking too much time in iPad hybrid application. can any one suggest me how to maintain the service calls.
Now i am using
forEach.array(function(){
here i am making service call.
});
Is there any other way to do this one like main thread or child thread in angular js?
Can you please help me any one.
There is something called as angular interceptors. You can just track the outgoing request from the interceptor to capture the service call being made.
Here is a tutorial that will explain it to you.
What you do is essentially in you app.js file push the interceptor service.
$httpProvider.interceptors.push(yourservice);
This service will contain your logic to capture the request and responses being made. The service is a simple angular service which qul contain the request variable.
var _request = function (config) {
config.headers = config.headers || {};
//the header should contain your request URL's. Identify the ones which are serivce requests and add them to a queue
return config;
}
I am trying to call a list from a google endpoint with $resource, before that I was using http, but with $resource seems more clear.
Is just to fill a combobox.
My service.js looks like:
provinciaServices.factory('Provincia', ['$resource',
function($resource){
return $resource('https://local.appspot.com/_ah/api/provinciaendpoint/v1/:provinciaId', {}, {
query: {method:'GET', params:{provinciaId:'provincia'}}
});
}]);
and in my controler I call the list with the following line:
$scope.provincias = Provincia.query();
The recommended way to interact with an Endpoints API is through the client library for js. Read that link if you're doing angular with endpoints no matter what - it's a great resource.
You can use $http to hit your endpoints API as a REST service, but this requires some careful use of routes and HTTP verbs, and OAuth is a little more difficult, if you feel you might want to do that later.
I'm not really sure what your error with $resource is. Could you update your question perhaps?
I would like to know whether we can create a provider in angularjs which will replace the $http operation .which means where we can use this provider in other modules where we can make use of these $http operation.
The reason why provider has to be taken is because we can configure the http parameters like the api path, request type .
Also can we have logging/exception handling mechanism inside the provider so that the modules(eg: any other factories) which inherit the provider wont need to do any extra logging/exception mechanisms.
Is there any way to have some loading screen using this provider when http requests are made ?
For the things you mentioned, you don't need another provider, because $http has the concept of interceptors.
Interceptors can specify different callbacks to be executed at different phases:
request (runs before any request is sent): It can modify the configuration (e.g. the request URL, method etc). It could also be used to show some loading message/animation (e.g. using some property on the $rootScope).
requestError (runs when there is an error before sending the request): It can be used for logging, recovering, exception handling.
response (runs after any response is received): It can be used for logging. It could also be used to hide the loading message/animation. (Don't forget to also handle this on response error.)
responseError (runs when there is an error regarding the response (e.g. bad request)): It can be used for logging, recovering, exception handling.
If interceptors do not cover your needs, you could use $provide's decorator to monkey-patch, augment or totally replace the $http service:
.config(function ($provide) {
$provide.decorator('$http', function ($delegate) {
var newHttp = $delegate; // or a totally new object
// ...monkey-patch newHttp or define new methods or whatever
return newHttp;
});
});
I am trying to refactor my AngularJS application and introduce a login service. Currently my controller has methods like login(), logout(), getCurrentUser(), which make http requests and handle the user object. I want to move these functions into a service, because I need to call the getCurrentUser() method from multiple controllers.
I have written the following service:
angular.module('common.login', []).
factory('loginService', function ($http) {
return {
user: null,
error: null
};
});
So at the moment the service is not doing anything. However I get an error:
Uncaught Error: Circular dependency: loginService <- $http
If I remove the $http dependency from the callback function, then the service works. I have trouble understanding why there is a circular dependency. The loginService factory is injected into two places: A **main module's config callback ** and a **login module's controller callback **. The config callback configures a http interceptor, the login controller also uses the http services.
The circular dependency is caused because you configure an httpInterceptor either to send some auth token or to intercept 401 error that depend on your login service that depend itself from the $http service.
Your httpInterceptor should not depend of your login service.
For instance if you need to send a token, you could store it in localStorage when you login and then in your httpInterceptor read it from there instead of your loginService.
If you need to logout the user when you get a 401 error then juste redirect the user to /logout instead of calling a logout method on your loginService.
I'm searching a solution but it's always the same and she's not correpond to my problem.
I have a lot of route element but for all routes with different controller I need to know if the user is authenticate or not. If yes, I have a token from an api and if no, I have a token too. So I need to have a token from an api when I load all controllers.
So I don't want to make a resolve for each "when()", I don't want to ddos the API so I search a system like this with
app.run(['Auth', function(Auth){
// Call my service & waiting his resolve
// When resolved, continue the init
}]);
So how can I make a resolve system with my "Auth" service on the run() ?
Make a service where you will have variable with status of authentication, inject this service in all controllers and in each controller call method of that service. Inside that method check variable with authentication status and only if authentication request was not yet send - send it (and set variable to status sent).