Firefox와 Safari가 iframe 콘텐츠를 캐싱하지 못하도록하려면 어떻게해야합니까?
다른 사이트의 페이지에 iframe이있는 간단한 웹 페이지가 있습니다. 외부 페이지와 내부 페이지에는 모두 캐시를 방지하기 위해 HTTP 응답 헤더가 있습니다. 브라우저에서 “뒤로”버튼을 클릭하면 외부 페이지가 제대로 작동하지만 브라우저는 항상 iframed 페이지의 캐시를 검색합니다. IE는 잘 작동하지만 Firefox와 Safari가 문제를 일으키고 있습니다.
내 웹 페이지는 다음과 같습니다.
<html>
<head><!-- stuff --></head>
<body>
<!-- stuff -->
<iframe src="webpage2.html?var=xxx" />
<!-- stuff -->
</body>
</html>
var
변수는 항상 변경합니다. iframe의 URL이 변경 되었음에도 불구하고 (따라서 브라우저가 해당 페이지에 대해 새 요청을해야 함) 브라우저는 캐시 된 콘텐츠를 가져옵니다.
HTTP 요청과 응답을 앞뒤로 조사한 결과, 외부 페이지에이 포함되어 있어도 <iframe src="webpage2.html?var=222" />
브라우저는 여전히 webpage2.html?var=111
.
지금까지 시도한 내용은 다음과 같습니다.
- 임의의 var 값으로 iframe URL 변경
- Expires, Cache-Control 및 Pragma 헤더를 외부 웹 페이지에 추가
- 내부 웹 페이지에 Expires, Cache-Control 및 Pragma 헤더 추가
동일 출처 정책에 의해 차단 되었기 때문에 JavaScript 트릭을 수행 할 수 없습니다.
아이디어가 부족합니다. 누구든지 브라우저가 iframed 콘텐츠를 캐싱하는 것을 중지하는 방법을 알고 있습니까?
최신 정보
Daniel이 다른 테스트를 수행 할 것을 제안한대로 Fiddler2를 설치했지만 안타깝게도 여전히 동일한 결과를 얻고 있습니다.
이것은 내가 수행 한 테스트입니다.
- 외부 페이지
Math.random()
는 JSP에서 사용하여 난수를 생성 합니다. - 외부 페이지는 웹 페이지에 임의의 숫자를 표시합니다.
- 외부 페이지는 iframe을 호출하여 임의의 숫자를 전달합니다.
- 내부 페이지는 임의의 숫자를 표시합니다.
이 테스트를 통해 업데이트중인 페이지와 캐시 된 페이지를 정확하게 확인할 수 있습니다.
시각적 테스트
빠른 테스트를 위해 페이지를로드하고 다른 페이지로 이동 한 다음 “뒤로”를 누릅니다. 결과는 다음과 같습니다.
원본 페이지 :
- 외부 페이지 : 0.21300034290246206
- 내부 페이지 : 0.21300034290246206
페이지를 떠난 후 다시 누르십시오.
- 외부 페이지 : 0.4470929019483644
- 내부 페이지 : 0.21300034290246206
이는 외부 페이지가 URL에서 다른 GET 매개 변수를 사용하여 호출하더라도 내부 페이지가 캐시되고 있음을 보여줍니다. 어떤 이유로 브라우저는 iframe이 새 URL을 요청한다는 사실을 무시합니다. 단순히 이전 것을로드합니다.
피들러 테스트
물론 Fiddler도 똑같은 사실을 확인합니다.
(페이지를로드합니다.)
외부 페이지가 호출됩니다. HTML :
0.21300034290246206
<iframe src="http://ipv4.fiddler:1416/page1.aspx?var=0.21300034290246206" />
http : //ipv4.fiddler : 1416 / page1.aspx? var = 0.21300034290246206 이 호출됩니다.
(나는 페이지를 벗어나서 뒤로 쳤다.)
외부 페이지가 호출됩니다. HTML :
0.4470929019483644
<iframe src="http://ipv4.fiddler:1416/page1.aspx?var=0.4470929019483644" />
http : //ipv4.fiddler : 1416 / page1.aspx? var = 0.21300034290246206 이 호출됩니다.
이 테스트에서 웹 브라우저가 페이지를 캐싱하지 않는 것처럼 보이지만 iframe의 URL을 캐싱 한 다음 해당 캐싱 된 URL에 대해 새 요청을 만드는 것입니다. 그러나이 문제를 해결하는 방법에 대해 여전히 난처합니다.
웹 브라우저가 iframe URL을 캐싱하지 못하도록하는 방법에 대한 아이디어가 있습니까?
답변
iframe의 URL이 iframe의 실제 콘텐츠를 검색하고 반환하는 프록시 역할을하는 사이트의 페이지를 가리 키도록합니다. 이제 더 이상 동일 출처 정책에 구속되지 않습니다 (편집 : iframe 캐싱 문제를 방지하지 않음).
답변
이것은 Firefox의 버그입니다.
https://bugzilla.mozilla.org/show_bug.cgi?id=356558
이 해결 방법을 시도하십시오.
<iframe src="webpage2.html?var=xxx" id="theframe"></iframe>
<script>
var _theframe = document.getElementById("theframe");
_theframe.contentWindow.location.href = _theframe.src;
</script>
답변
name
iframe에 고유 한 속성을 설정하여이 버그를 해결할 수있었습니다. 어떤 이유로 든 캐시가 망가진 것 같습니다. 어떤 동적 데이터를 name
속성으로 사용하거나 사용중인 템플릿 언어에서 현재 ms 또는 ns 시간을 사용할 수 있습니다. 이것은 JS를 직접 요구하지 않기 때문에 위의 것보다 더 좋은 솔루션입니다.
제 특별한 경우에는 iframe이 JS를 통해 빌드되고 있습니다 (그러나 PHP, Ruby 등을 통해 동일한 작업을 수행 할 수 있음) Date.now()
.
return '<iframe src="' + src + '" name="' + Date.now() + '" />';
이것은 내 테스트의 버그를 수정합니다. window.name
내부 창이 변경 되었기 때문일 것입니다 .
답변
말했듯이 여기서 문제는 iframe 콘텐츠 캐싱 이 아니라 iframe url 캐싱 입니다.
2018 년 9 월 현재 Chrome에서는 문제가 계속 발생하지만 Firefox에서는 발생하지 않는 것 같습니다.
나는 많은 것을 시도했다 (변경 GET 매개 변수 추가, onbeforeunload에서 iframe URL 지우기, 쿠키를 사용하여 “캐시에서 다시로드”감지, 다양한 응답 헤더 설정).
1- 쉬운 방법 : 자바 스크립트에서 동적으로 iframe 생성
예를 들면 :
const iframe = document.createElement('iframe')
iframe.id = ...
...
iframe.src = myIFrameUrl
document.body.appendChild(iframe)
2- 복잡한 방법
여기 에 설명 된대로 서버 측에서는 iframe 또는 상위 페이지에 대해 제공하는 콘텐츠에 대해 콘텐츠 캐싱을 사용 중지 합니다 (둘 중 하나라도 사용).
과
다음과 같이 추가 변경 검색 매개 변수를 사용하여 자바 스크립트에서 iframe URL을 설정합니다.
const url = myIFrameUrl + '?timestamp=' + new Date().getTime()
document.getElementById('my-iframe-id').src = url
(단순 버전, 다른 검색 매개 변수에주의)
답변
다른 모든 것을 시도한 후 (iframe 콘텐츠에 프록시 사용 제외) 동일한 도메인에서 iframe 콘텐츠 캐싱을 방지하는 방법을 찾았습니다 .
사용 .htaccess
및 재 작성 규칙과 iframe이 변경 src
속성을.
RewriteRule test/([0-9]+)/([a-zA-Z0-9]+).html$ /test/index.php?idEntity=$1&token=$2 [QSA]
이것을 사용하는 방법은 iframe의 URL이 다음과 같이 보입니다. example.com/test/54/e3116491e90e05700880bf8b269a8cc7.html
여기서 [token]은 무작위로 생성 된 값입니다. 이 URL은 토큰이 동일하지 않기 때문에 iframe 캐싱을 방지하고, iframe은 단일 새로 고침이 완전히 다른 URL을로드하기 때문에 완전히 다른 웹 페이지라고 생각합니다.
example.com/test/54/e3116491e90e05700880bf8b269a8cc7.html
example.com/test/54/d2cc21be7cdcb5a1f989272706de1913.html
둘 다 같은 페이지로 연결됩니다.
숨겨진 URL 매개 변수에 액세스 할 수 있습니다. $_SERVER["QUERY_STRING"]
답변
Firefox 3.5의 버그입니다.
답변
iframe이 항상 새로운 콘텐츠를로드하도록하려면 현재 Unix 타임 스탬프를 GET 매개 변수 끝에 추가하세요. 그러면 브라우저는이를 ‘다른’요청으로 인식하고 새 콘텐츠를 찾습니다.
자바 스크립트에서는 다음과 같이 보일 수 있습니다.
frames['my_iframe'].location.href='load_iframe_content.php?group_ID=' + group_ID + '×tamp=' + timestamp;