Angular Проблема кэширования IE для $http
Все вызовы ajax, отправленные из IE, кэшируются Angular, и я получаю 304 response
для всех последующих вызовов. Хотя запрос тот же, ответ не будет таким же в моем случае. Я хочу отключить этот кеш. Я попытался добавить cache attribute
в $http.get, но все равно он не помог. Как решить эту проблему?
Ответы
Ответ 1
Вместо отключения кэширования для каждого отдельного запроса 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';
}]);
Ответ 2
Вы можете либо добавить уникальную строку запроса (я считаю, что это то, что jQuery делает с параметром cache: false) для запроса.
$http({
url: '...',
params: { 'foobar': new Date().getTime() }
})
Возможно, лучшее решение - если у вас есть доступ к серверу, то вы можете убедиться, что необходимые заголовки настроены на предотвращение кеширования. Если вы используете ASP.NET MVC
этот ответ, это может помочь.
Ответ 3
вы можете добавить перехватчик.
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 после проверки.
Ответ 4
Я просто добавил три метатега в index.html в проекте angular, и проблема с кешем была решена в 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">
Ответ 5
Дублирование моего ответа в другом потоке.
Для Углового 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 }
]
})
Ответ 6
Гарантированным, что я работал, было что-то в этом роде:
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
чтобы сделать эту работу для разных случаев.
Ответ 7
Эта строка помогла мне (Angular 1.4.8):
$httpProvider.defaults.headers.common['Pragma'] = 'no-cache';
UPD: Проблема заключается в том, что IE11 делает агрессивное кэширование. Когда я смотрел на Fiddler, я заметил, что в режиме F12 запросы отправляют "Pragma = no-cache", и конечная точка запрашивается каждый раз, когда я посещаю страницу. Но в нормальном режиме конечная точка была запрошена только один раз в первый раз, когда я посетил страницу.
Ответ 8
Я решил разрешить добавление даты и времени как случайное число:
$http.get("/your_url?rnd="+new Date().getTime()).success(function(data, status, headers, config) {
console.log('your get response is new!!!');
});
Ответ 9
Чтобы избежать кэширования, один из вариантов заключается в предоставлении другого URL-адреса для одного и того же ресурса или данных. Чтобы создать другой URL-адрес, вы можете добавить строку случайного запроса в конец URL-адреса. Этот метод работает для JQuery, Angular или других запросов ajax другого типа.
myURL = myURL +"?random="+new Date().getTime();
Ответ 10
Решение выше будет работать (сделать URL уникальным, добавив в querystring новый параметр), но я предпочитаю, чтобы решение предлагало [здесь]: Лучший способ предотвратить IE-кеш в AngularJS?, которые обрабатывают это на уровне сервера, поскольку это не относится к IE. Я имею в виду, что если этот ресурс не должен кэшироваться, сделайте это на сервере (это не имеет никакого отношения к используемому браузеру, это не противоречит ресурсу).
Например, в java с JAX-RS выполните программно для JAX-RS v1 или declativly для JAX-RS v2.
Я уверен, что кто-нибудь поймет, как это сделать
Ответ 11
Я нашел лучшее решение: Лучший способ предотвратить кеш IE в AngularJS?
Для ленивых - это решение:
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "None")]
public ActionResult Get()
{
// return your response
}
Ответ 12
Это немного до старости, но: Решения вроде устарели. Пусть сервер обрабатывает кеш или не кэширует (в ответе). Единственный способ гарантировать отсутствие кеширования (думать о новых версиях в производстве) - это изменить файл js или css с номером версии. Я делаю это с помощью webpack.
Ответ 13
также вы можете попробовать в своем сервисе установить заголовки, например, например:
...
import { Injectable } from "@angular/core";
import { HttpClient, HttpHeaders, HttpParams } from "@angular/common/http";
...
@Injectable()
export class MyService {
private headers: HttpHeaders;
constructor(private http: HttpClient..)
{
this.headers = new HttpHeaders()
.append("Content-Type", "application/json")
.append("Accept", "application/json")
.append("LanguageCulture", this.headersLanguage)
.append("Cache-Control", "no-cache")
.append("Pragma", "no-cache")
}
}
....
Ответ 14
Эта проблема связана с проблемой кэширования IE, как вы сказали, вы можете протестировать ее в режиме отладки IE, нажав f12 (это будет отлично работать в режиме отладки).IE не будет принимать данные сервера каждый раз, когда вызовы страницы, он берет данные из кеша. Чтобы отключить это, выполните одно из следующих действий:
- добавьте следующее с 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 })
- отключить кеш для всего модуля: -
$httpProvider.defaults.headers.common ['Pragma'] = 'no-cache';
Ответ 15
meta http-equiv="Cache-Control" content="no-cache"
Я просто добавил это в View и начал работать над IE. Подтверждено работать на Angular 2.
Ответ 16
Всегда использовать простой подход добавить временную метку с каждым запросом не нужно очищать кеш
let c=new Date().getTime();
$http.get('url?d='+c)
Ответ 17
Попробуйте это, это сработало для меня в одном случае:
$http.get("your api url", {
headers: {
'If-Modified-Since': '0',
"Pragma": "no-cache",
"Expires": -1,
"Cache-Control": "no-cache, no-store, must-revalidate"
}
})