CODEWITHSUNDEEP
asp.net-mvcangularjscachingangular-ui-router
robBerto
robBerto

Reputation: 196

Undetectable caching

I'm a web app developer with ASP.NET MVC 5 in server-side and AngularJS in client-side. The navigation, in client-side, is managed with module UI-Router. In server-side I've configured my custom authentication and authorization. When I excecute the app can see a navigation bar with many links. In particular, I have a link named "Overview" that redirects to controller Overview.

Code client (html):

<a ui-sref="Overview">Overview</a>

Code client to redirect (angular):

.config(function ($stateProvider, $urlRouterProvider) {
     $urlRouterProvider.otherwise("Home/Index");
     $stateProvider
        .state("Overview", {
            templateUrl: "Home/Overview",
            url: "/overview"
        })

Controller code:

[OutputCache(Duration=0, NoStore=true)]
[AllowAnonymous]
public ActionResult Overview()
{
    return PartialView();
}

With a breakpoint in line "return PartialView()" to controller code, I can see that controller returns partial view when I click over "overview" in menu app. But when I click second time, the breakpoint does not trigger. I think it's a caching issue.

I have read that caching issue can be generated: * In server-side. * In client-side. * Even IIS.

I have tried many solutions: In server side I use attribute [OutputCache]. When i read in my browser the http headers i can see

enter image description here

In client side i could not find a solution to avoid caching, but i think that UI-Router shouldn't cache anything.

As additional measures I put in my web.config:

<system.webServer>
    <caching enabled="false" enableKernelCache="false" />
</system.webServer>

even, I created my own custom ActionFilterAttribute but did not work.

i don't know what else to do.

PS: sorry for my english

Upvotes: 1

Views: 103

Answers (2)

harishr
harishr

Reputation: 18065

If there is any other plugin which does caches its templates, then your solution will clean those templates and make those plugins unusable.. hence your solution is not good.

To solve problem of html caching you should add random query string at the end of html filename... the other solutions you mentioned are for non-caching of api responses and not for static content (html/js/css files)

To add random query string to ur html. either you can use modules like grunt-cache-busting or gulp-rev or use query string as param query-string-cache-busting.

Please note that datetime/file-hash are best cache-busting param

Upvotes: 1

robBerto
robBerto

Reputation: 196

Ok, I've found the solution.

Despite avoid caching from server side with attributes like OutputCache, or avoid caching from IIS setting my web.config, the issue persisted.

AngularJS was the guilty. In other post I found the solution.

myApp.run(function($rootScope, $templateCache) {
    $rootScope.$on('$viewContentLoaded', function() {
        $templateCache.removeAll();
    });
});

This solution is provided by Mark Rajcok and Valentyn Shybanov. So thanks to both.

Upvotes: 0

Related Questions