Ich habe einen Rest-Endpunkt, der eine Liste bei einem GET-Aufruf zurückgibt. Ich habe auch einen POST-Endpunkt, um neue Elemente hinzuzufügen und ein DELETE, um sie zu entfernen. Dies funktioniert in Firefox und Chrome, und der POST und DELETE funktionieren in IE11. Das GET in IE11 funktioniert jedoch nur beim ersten Laden der Seite. Das Aktualisieren von Daten zwischengespeicherte Daten. Ich habe Post über dieses Verhalten in Angular 1 gesehen, aber nichts für Angular 2 (Release Candidate 1).Verhindern IE11-Zwischenspeicherung GET-Aufruf in Angular 2
Antwort
Wie beantwortet here, die Sie gerade RequestOptions
außer Kraft setzen können Header benötigt hinzuzufügen:
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'
});
}
Modul:
@NgModule({
...
providers: [
...
{ provide: RequestOptions, useClass: CustomRequestOptions }
]
})
Das ist eine großartige Lösung für alle Anfragen von angular Anfrage kein Cache, aber ich will dieses Verhalten nicht für alle Anfragen, da einige Anfragen gut in den Cache gestellt werden können. Ich ging mit der Einstellung der entsprechenden Header Server-Seite. Ich hätte lieber den Server, der Caching sowieso pfeift. Ich habe die Frage vielleicht schlecht formuliert. – cmaynard
@cmaynard Ich stieß in Ihrer Frage beim Betrachten, wie man globales Zwischenspeichern für Andular einrichtet, also von der google Perspektive ist Ihre Benennung für alles perfekt, das Leute Suche suchen :) –
Weiterleiten der Stackoverflow-Antwort Angular IE Caching issue for $http, Sie sollten die Header 'Pragma', 'No-Cache', 'If-Modified-Since' zu jeder 'GET' Anfrage hinzufügen.
Das Interzeptor-Szenario wird nicht mehr auf Winkel 2 unterstützt. Also solltest du das http wie hier beschrieben erweitern What is httpinterceptor equivalent in angular2?.
Angular 4.3 enthält jetzt den Dienst HttpClient, der Interzeptoren unterstützt.
Ein bisschen spät, aber ich stieß auf das gleiche Problem. Für Angular 4.X Ich schrieb eine benutzerdefinierte Http-Klasse, um eine zufällige Zahl an das Ende anzuhängen, um Zwischenspeicherung durch IE zu verhindern. Es basiert auf dem 2. Link von Dimeren (What is httpinterceptor equivalent in angular2?). Warnung: nicht garantiert zu 100% fehlerfrei.
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);
}
}
Ich habe diese Technik in der Vergangenheit benutzt, um Caching zu "täuschen". Ich denke, es ist nützlich, aber es ist normalerweise besser, die entsprechenden Header zu setzen. – cmaynard
Heute habe ich dieses Problem auch hatte, (verdammt IE) . In meinem Projekt verwende ich , das hat nicht BaseRequestOptions
. Wir sollten Http_Interceptor
verwenden, um es zu lösen!
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);
}
Module bieten
@NgModule({
...
providers: [
...
{ provide: HTTP_INTERCEPTORS, useClass: CustomHttpInterceptorService, multi: true }
]
})
Danke, das ist die korrekte Antwort für Angular 5. Jedoch seitdem Ich habe Angular 2 in der ursprünglichen Frage angegeben. Ich werde diese Antwort für diese Frage als richtig markieren lassen, habe eine Verbesserung! – cmaynard
Wenn Ihr GET api nicht eine beliebige Header Cache Control -> Es bedeutet, dass die Antwort zwischenspeicherbar ist, wenn der Status 200 OK ist. – Loc
Siehe auch http://stackoverflow.com/questions/36500804/proper-way-to-prevent-angular2-http-request-caching-in-internet-explorer-ie für eine clientseitige Problemumgehung. –
@Loc Ich habe die Cache-Control-Werte no-store und no-cache hinzugefügt und bekomme immer noch das gleiche Ergebnis in IE. – cmaynard