Предотвращение кэширования IE11 GET-вызов в Angular 2
У меня есть конечная точка отдыха, которая возвращает список в GET-вызове. У меня также есть конечная точка POST для добавления новых элементов и DELETE для их удаления. Это работает в Firefox и Chrome, а POST и DELETE работают в IE11. Однако GET в IE11 работает только при начальной загрузке страницы. Обновление данных кэшируется. Я видел сообщение об этом поведении в Angular 1, но ничего для Angular 2 (кандидат на выпуск 1).
Ответы
Ответ 1
Вы можете переопределить 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 }
]
})
Ответ 2
Сегодня у меня также была эта проблема, (проклятый IE). В моем проекте я использую httpclient
, у которого нет BaseRequestOptions
. Мы должны использовать Http_Interceptor
для его решения!
import { HttpHandler,
HttpProgressEvent,
HttpInterceptor,
HttpSentEvent,
HttpHeaderResponse,
HttpUserEvent,
HttpRequest,
HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
export class CustomHttpInterceptorService implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler):
Observable<HttpSentEvent | HttpHeaderResponse | HttpProgressEvent | HttpResponse<any> | HttpUserEvent<any>> {
const nextReq = req.clone({
headers: req.headers.set('Cache-Control', 'no-cache')
.set('Pragma', 'no-cache')
.set('Expires', 'Sat, 01 Jan 2000 00:00:00 GMT')
.set('If-Modified-Since', '0')
});
return next.handle(nextReq);
}
}
Модуль обеспечивает
@NgModule({
...
providers: [
...
{ provide: HTTP_INTERCEPTORS, useClass: CustomHttpInterceptorService, multi: true }
]
})
Ответ 3
Отправляйте ответ stackoverflow Angular Ошибка кэширования IE за $http, вы должны добавить заголовки Pragma ',' no-cache ',' If-Modified -Since 'для каждого запроса GET.
Сценарий перехватчика больше не поддерживается для angular 2. Поэтому вы должны расширить http, как описано здесь Что такое эквивалент httpinterceptor в angular2?.
Angular 4.3 теперь включает службу HttpClient, которая поддерживает перехватчики.
Ответ 4
Немного поздно, но я столкнулся с той же проблемой. Для Angular 4.X Я написал специальный класс Http для добавления случайного числа до конца, чтобы предотвратить кеширование IE. Он основан на 2-й ссылке по dimeros (Что такое эквивалент httpinterceptor в angular2?). Предупреждение: не гарантируется 100% ошибка.
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Http, Response, XHRBackend, RequestOptions, RequestOptionsArgs,
URLSearchParams } from '@angular/http';
@Injectable()
export class NoCacheHttp extends Http {
constructor(backend: XHRBackend, options: RequestOptions) {
super(backend, options);
}
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
//make options object if none.
if (!options) {
options = { params: new URLSearchParams() };
}
//for each possible params type, append a random number to query to force no browser caching.
//if string
if (typeof options.params === 'string') {
let params = new URLSearchParams(options.params);
params.set("k", new Date().getTime().toString());
options.params = params;
//if URLSearchParams
} else if (options.params instanceof URLSearchParams) {
let params = <URLSearchParams>options.params;
params.set("k", new Date().getTime().toString());
//if plain object.
} else {
let params = options.params;
params["k"] = new Date().getTime().toString();
}
return super.get(url, options);
}
}
Ответ 5
Отключить кеширование браузеров с метатегами HTML: -
<meta http-equiv="cache-control" content="no-cache, must-revalidate, post-check=0, pre-check=0">
<meta http-equiv="expires" content="0">
<meta http-equiv="pragma" content="no-cache">