$http의 각 IE 캐싱 문제
"Ajax " " " " " " " " " " " " " " " " " " " " " " " " " " 。304 response
★★★★★★★★★★★★★★★★★★★★★★★★★★요청은 동일하지만, 제 경우에는 응답이 동일하지 않습니다.이 캐시를 비활성화합니다.추가하려고 했습니다.cache attribute
$140. 하지만 되지 않았다.얻었지만 여전히 도움이 되지 않았다.이 문제를 해결하려면 어떻게 해야 합니까?
$httpProvider에서는 각 GET-Request의 캐시를 디세블로 하는 대신 글로벌하게 디세블로 합니다.
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';
}]);
요청에 고유한 쿼리 스트링(cache: false 옵션에서 jQuery가 수행하는 작업이라고 생각합니다)을 추가할 수 있습니다.
$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 행을 삭제해야 합니다.
angular project의 index.html에 메타태그 3개를 추가하면 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
다른 케이스에 적용할 수 있도록 말이야
이 선만이 도움이 되었습니다(각도 1.4.8).
$httpProvider.defaults.headers.common['Pragma'] = 'no-cache';
UPD: 문제는 IE11이 공격적인 캐싱을 한다는 것입니다.Fiddler를 살펴보고 있을 때 F12 모드에서 요청이 "Pragma=no-cache"를 전송하고 있으며 페이지를 방문할 때마다 엔드포인트가 요청된다는 것을 알게 되었습니다.그러나 일반 모드에서는 처음에 페이지를 방문했을 때 엔드포인트가 한 번만 요청되었습니다.
캐시를 방지하기 위해 동일한 리소스 또는 데이터에 대해 다른 URL을 지정하는 방법이 있습니다.다른 URL을 생성하려면 URL 끝에 랜덤 쿼리 문자열을 추가합니다.이 기술은 JQuery, Angular 또는 기타 유형의 Ajax 요청에 대해 작동합니다.
myURL = myURL +"?random="+new Date().getTime();
datetime을 랜덤으로 추가하는 것을 해결했습니다.
$http.get("/your_url?rnd="+new Date().getTime()).success(function(data, status, headers, config) {
console.log('your get response is new!!!');
});
위의 솔루션은 동작합니다(쿼리 스트링에 새로운 파라미터를 추가하여 URL을 고유하게 만듭니다). 단, 솔루션 제안 [여기]를 권장합니다.AngularJS에서 IE 캐시를 방지하는 더 나은 방법 IE 고유하지 않은 서버 수준에서 이 작업을 처리합니다.즉, 해당 리소스를 캐시할 필요가 없는 경우 서버에서 캐시하십시오(이는 사용된 브라우저와는 무관하며 리소스에 영향을 미칩니다).
예를 들어 JAX-RS를 사용하는 Java에서는 JAX-RS v1의 경우 프로그래밍 방식으로, JAX-RS v2의 경우 디클래티벌리 방식으로 수행합니다.
누구나 방법을 알아낼 수 있을 거야
이것은 조금 낡았지만, 같은 솔루션은 구식입니다.서버가 캐시를 처리하거나 캐시를 처리하지 않도록 합니다(응답).캐시를 보증하는 유일한 방법은 (실가동 중인 새 버전을 고려하는) js 또는 css 파일을 버전 번호로 변경하는 것입니다.웹팩으로 하는 거예요.
또한 다음과 같은 헤더를 servce로 설정할 수도 있습니다.
...{ 주입 가능}을(를) "@angular/core"에서 가져옵니다.{HttpClient, HttpHeaders, HttpParams}를 "@angular/common/http"에서 Import합니다....@Injectable()내보내기 클래스 MyService { 개인 헤더:Http Headers; 컨스트럭터(프라이빗http:Http Client..){ 이것.headers = 새로운 HttpHeaders().append("Content-Type", "application/json").append("Accept", "application/json").append("LanguageCulture") 이거.headers Language).append("Cache-Control", "캐시 없음").append("Pragma", "캐시 없음")}}....
올바른 서버측 솔루션:AngularJS에서 IE 캐시를 방지하는 더 나은 방법?
[OutputCache(NoStore = true, Duration = 0, VaryByParam = "None")]
public ActionResult Get()
{
// return your response
}
이 문제는 앞서 설명한 IE 캐싱 문제로 인해 발생합니다.f12 키를 눌러 IE 디버깅모드로 테스트할 수 있습니다(디버깅모드에서는 정상적으로 동작합니다).IE는 페이지가 호출될 때마다 서버 데이터를 가져오지 않고 캐시에서 데이터를 가져옵니다.이것을 무효로 하려면 , 다음의 몇개의 조작을 실시합니다.
- http 서비스 요청 URL에 다음을 추가합니다.
//전(발행 전)
this.httpService.get(this.serviceUrl + "/e)AMobile Service.svc/Validate Engagment Name/" + agement Name , {}
//After (정상 작동)
this.httpService.get(this.serviceUrl + "/e)AMobile Service.svc/Validate Engagment Name/" + agement Name + "?DateTime=" + 새로운 Date() + getTime() + '', { cache: false }
- 모듈 전체의 캐시를 비활성화합니다.-
$httpProvider.defaults 입니다.headers.common['Pragma'] = '캐시 없음';
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"
}
})
언급URL : https://stackoverflow.com/questions/16098430/angular-ie-caching-issue-for-http
'programing' 카테고리의 다른 글
Spring의 ScriptUtils는 덤프에 코멘트가 포함된 코드를 무시합니다. (0) | 2022.10.15 |
---|---|
1을 포함하는 어레이를 작성하는 방법...n (0) | 2022.10.15 |
Prepared Statement를 여러 번 재사용 (0) | 2022.10.15 |
생성자에 인수가 있는 Java 8 공급업체 (0) | 2022.10.06 |
DATE 또는 DATETIME 기본값을 설정할 때 MySQL에서 오류가 발생함 (0) | 2022.10.06 |