15

I have an Angular interceptor working:

factory('myHttpInterceptor', function ($q, $location, $rootScope) {
// do something
return function (promise) {
    return promise.then(function (response) {
        // do something
        return response;
    }, function (response) {
        // do something
        return $q.reject(response);
    });
};
})

and one big html file which contains templates like <script type="text/ng-template" id="home-template">. Unfortunately my HTTP interceptor intercepts not only loading HTTP requests but also loading templates (which are already loaded in html file) for controllers which are defined like when('/', {controller:MainController, templateUrl:'home-template'}). Is there a way how to make interceptor intercepting only HTTP requests or how to recognize whether I am loading something from server or just a template?

2
  • I'm not sure I understand your question. Do you want to intercept template requests? or do you want to intercept everything but template requests? Jun 24, 2013 at 14:38
  • intercept everything but template requests
    – igo
    Jun 25, 2013 at 7:52

2 Answers 2

23

I ran in to this issue as well. We were adding query strings to all our $http calls with an interceptor. It ended up breaking our templates, because when looking in $templateCache the template name with query string wasn't being found (the template was originally cached with just using it's id).

Angular $httpProvider interceptors will intercept $http module calls. These $http calls are not necessarily real HTTP GET / POST requests they can also be calls to get templates in $templateCache. It seems like when an embedded template is being referenced, first the $http module is used (which run the interceptor first) and then the $http module will look in $templateCache to see if the template is already cached. If $http finds out the item exists in $templateCache it will return it, if not it will attempt to make an actual HTTP request to get the template.

Our solution was to include the $templateCache module in our interceptor and manually check first if the http request exists in $templateCache. If the request is not in $templateCache add our query string, if it is in $templateCache then simply return it.

$httpProvider.interceptors.push(function($templateCache) {
    return {
        'request' : function(request) {
            // If the request is a get and the request url is not in $templateCache
            if(request.method === 'GET' && $templateCache.get(request.url) === undefined) {
                // Item is not in $templateCache so add our query string
                request.url = request.url + '?time=' + new Date().getTime();
            }
            return request;
        }
    };
});
2
  • 2
    To add to this, you may not need $templateCache injected here. I think request.cache points to it so request.cache.get(request.url) essentially does the same thing
    – ragamufin
    Feb 20, 2015 at 1:14
  • @ragamufin this is true, although request.cache could also be set to true to enable the default $http cache
    – leeb
    Aug 26, 2015 at 13:06
0

From what I have gathered, you are looking for a way to see if the request involved a template file or not. What you could do is look at the url of the request and see if it contains the path to your partials directory.

Let me know if this is what you were looking for:

var interceptor = ['$location', '$log', '$q', function($location, $log, $q) {
    function success(response) {
        // you can examine the url of the request here
        $log.info(response.config.url)
        return response;
    }

    function error(response) {
        if (response.status === 401) {
            $location.path('/signin');
            return $q.reject(response);
        } else {
            return $q.reject(response);
        }
    }
    return function(promise) {
        return promise.then(success, error);
    }
}];

$httpProvider.responseInterceptors.push(interceptor);

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.