Угловая проблема кэширования IE для $ http

Все ajax-вызовы, отправляемые из IE, кэшируются Angular, и я получаю a 304 responseдля всех последующих вызовов. Хотя запрос такой же, ответ не будет таким же в моем случае. Я хочу отключить этот кеш. Я попытался добавить в cache attribute$ http.get, но все равно это не помогло. Как можно решить эту проблему?

Вместо того, чтобы отключать кэширование для каждого отдельного GET-запроса, я отключаю его глобально в $ httpProvider:

myModule.config(['$httpProvider', function($httpProvider) {
    //initialize get if not there
    if (!$httpProvider.defaults.headers.get) {
        $httpProvider.defaults.headers.get = {};    
    }    

    // Answer edited to include suggestions from comments
    // because previous version of code introduced browser-related errors

    //disable IE ajax request caching
    $httpProvider.defaults.headers.get['If-Modified-Since'] = 'Mon, 26 Jul 1997 05:00:00 GMT';
    // extra
    $httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache';
    $httpProvider.defaults.headers.get['Pragma'] = 'no-cache';
}]);

Вы можете добавить уникальную строку запроса (я думаю, именно это jQuery делает с опцией cache: false) к запросу.

$http({
    url: '...',
    params: { 'foobar': new Date().getTime() }
})

Возможно, лучшим решением будет то, что если у вас есть доступ к серверу, вы можете убедиться, что для предотвращения кэширования установлены необходимые заголовки. Если вы используете ASP.NET MVC этот ответ, может помочь.

Вы можете добавить перехватчик.

myModule.config(['$httpProvider', function($httpProvider) {
 $httpProvider.interceptors.push('noCacheInterceptor');
}]).factory('noCacheInterceptor', function () {
            return {
                request: function (config) {
                    console.log(config.method);
                    console.log(config.url);
                    if(config.method=='GET'){
                        var separator = config.url.indexOf('?') === -1 ? '?' : '&';
                        config.url = config.url+separator+'noCache=' + new Date().getTime();
                    }
                    console.log(config.method);
                    console.log(config.url);
                    return config;
               }
           };
    });

Вы должны удалить строки console.log после проверки.

Я просто добавил три мета-тега в index.html для углового проекта, и проблема с кешем была решена в IE.

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="Sat, 01 Dec 2001 00:00:00 GMT">

Дублирую мой ответ в другой ветке .

Для Angular 2 и новее самый простой способ добавить no-cacheзаголовки, переопределив RequestOptions:

import { Injectable } from '@angular/core';
import { BaseRequestOptions, Headers } from '@angular/http';

@Injectable()
export class CustomRequestOptions extends BaseRequestOptions {
    headers = new Headers({
        'Cache-Control': 'no-cache',
        'Pragma': 'no-cache',
        'Expires': 'Sat, 01 Jan 2000 00:00:00 GMT'
    });
}

И сослаться на это в вашем модуле:

@NgModule({
    ...
    providers: [
        ...
        { provide: RequestOptions, useClass: CustomRequestOptions }
    ]
})

Гарантированный, что я работал, был чем-то вроде этого:

myModule.config(['$httpProvider', function($httpProvider) {
    if (!$httpProvider.defaults.headers.common) {
        $httpProvider.defaults.headers.common = {};
    }
    $httpProvider.defaults.headers.common["Cache-Control"] = "no-cache";
    $httpProvider.defaults.headers.common.Pragma = "no-cache";
    $httpProvider.defaults.headers.common["If-Modified-Since"] = "Mon, 26 Jul 1997 05:00:00 GMT";
}]);

Я должен был объединить 2 из вышеуказанных решений для того , чтобы гарантировать правильное использование всех методам, но вы можете заменить commonс getили другим методом , то есть put, post, deleteчтобы сделать эту работу для различных случаев.

Мне помогла только эта строка (Angular 1.4.8):

$httpProvider.defaults.headers.common['Pragma'] = 'no-cache';

UPD: проблема в том, что IE11 делает агрессивное кэширование. Когда я заглянул в Fiddler, я заметил, что в режиме F12 отправляются запросы "Pragma = no-cache", и конечная точка запрашивается при каждом посещении страницы. Но в обычном режиме конечная точка запрашивалась только один раз при первом посещении страницы.

Чтобы избежать кеширования, можно указать разные URL-адреса для одного и того же ресурса или данных. Чтобы создать другой URL, вы можете добавить случайную строку запроса в конец URL. Этот метод работает для запросов AJAX JQuery, Angular или других типов.

myURL = myURL +"?random="+new Date().getTime();

Я получаю это решенное добавление даты и времени как случайного числа:

$http.get("/your_url?rnd="+new Date().getTime()).success(function(data, status, headers, config) {
    console.log('your get response is new!!!');
});

Решение, приведенное выше, будет работать (сделайте URL уникальным, добавив в строку запроса новый параметр), но я предпочитаю решение, предлагаемое [здесь]: Лучший способ предотвратить кеширование IE в AngularJS?, которые обрабатывают это на уровне сервера, поскольку это не относится к IE. Я имею в виду, что если этот ресурс не должен быть кэширован, делайте это на сервере (это никак не связано с используемым браузером; это сложно для ресурса).

Например, в java с JAX-RS сделайте это программно для JAX-RS v1 или декларативно для JAX-RS v2.

Я уверен, что кто-нибудь поймет, как это сделать

Это немного по-старому, но: решения вроде устарели. Пусть сервер обрабатывает кеш или не кеш (в ответе). Единственный способ гарантировать отсутствие кэширования (думать о новых версиях в производстве) - это заменить файл js или css номером версии. Я делаю это с помощью веб-пакета.

Также вы можете попробовать в вашем серве установить заголовки, например:

...
import {Injectable} из "@ angular / core";
import {HttpClient, HttpHeaders, HttpParams} из "@ angular / common / http";
...
 @Injectable ()
класс экспорта MyService {

    частные заголовки: HttpHeaders;


    конструктор (частный http: HttpClient ..) 
    {


        this.headers = new HttpHeaders ()
                    .append ("Content-Type", "application / json")
                    .append («Принять», «Приложение / JSON»)
                    .append ("LanguageCulture", this.headersLanguage)
                    .append ("Cache-Control", "no-cache")
                    .append ("Pragma", "no-cache")                   
    }
}
....

Правильное решение на стороне сервера: лучший способ предотвратить кеширование IE в AngularJS?

[OutputCache(NoStore = true, Duration = 0, VaryByParam = "None")]
public ActionResult Get()
{
    // return your response
}

Эта проблема связана с проблемой кэширования IE, как вы сказали, вы можете протестировать ее в режиме отладки IE, нажав клавишу f12 (в режиме отладки это будет нормально работать) .IE не будет принимать данные сервера при каждом вызове страницы, это займет данные из кеша. Чтобы отключить это, выполните одно из следующих действий:

1. добавьте следующее к URL-адресу запроса на обслуживание http

// До (выдан)

this.httpService.get (this.serviceUrl + "/eAMobileService.svc/ValidateEngagmentName/" + engagementName, {})

// После (работает нормально)

this.httpService.get (this.serviceUrl + "/eAMobileService.svc/ValidateEngagmentName/" + engagementName + "? DateTime =" + new Date (). getTime () + '', {cache: false})

2. отключить кеш для всего модуля: -

$ httpProvider.defaults.headers.common ['Pragma'] = 'no-cache';

meta http-equiv="Cache-Control" content="no-cache"

Я просто добавил это в View, и он начал работать в IE. Подтвердили работу на Angular 2.

Одним из вариантов является использование простого подхода - добавление метки времени при каждом запросе без необходимости очищать кэш.

    let c=new Date().getTime();
    $http.get('url?d='+c)

Попробуйте это, у меня получилось в похожем случае: -

$http.get("your api url", {
headers: {
    'If-Modified-Since': '0',
    "Pragma": "no-cache",
    "Expires": -1,
    "Cache-Control": "no-cache, no-store, must-revalidate"
 }
})