브라우저가 캐시를 지우도록 강제 브라우저 캐시를 지우고 변경

누군가가 사이트를 방문 할 때 브라우저 캐시를 지우고 변경 사항을 볼 수 있도록 내 페이지에 코드를 넣을 수있는 방법이 있습니까?

사용되는 언어 : ASP.NET, VB.NET, 물론 HTML, CSS 및 jQuery

답변

이와 관련 .css하여 .js변경되는 경우, “캐시 버스 팅”방법은 _versionNo각 릴리스의 파일 이름에 ” ” 와 같은 것을 추가하는 것 입니다. 예를 들면 다음과 같습니다.

script_1.0.css // This is the URL for release 1.0
script_1.1.css // This is the URL for release 1.1
script_1.2.css // etc.

또는 파일 이름 다음에 수행하십시오.

script.css?v=1.0 // This is the URL for release 1.0
script.css?v=1.1 // This is the URL for release 1.1
script.css?v=1.2 // etc.

이 링크 를 확인하여 어떻게 작동하는지 확인할 수 있습니다.

답변

로 봐 캐시 제어 하고, 만료 메타 태그를 .

<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="EXPIRES" CONTENT="Mon, 22 Jul 2002 11:12:01 GMT">

또 다른 일반적인 관행은 끊임없이 변경되는 문자열을 요청 된 파일의 끝에 추가하는 것입니다. 예를 들어 :

<script type="text/javascript" src="main.js?v=12392823"></script>

답변

2012 업데이트

이것은 오래된 질문이지만 웹 사이트 캐싱을보다 잘 제어 할 수있는 방법이 있기 때문에 최신 답변이 필요하다고 생각합니다.

에서 오프라인 웹 응용 프로그램 (정말 어떤 HTML5 웹 사이트입니다)applicationCache.swapCache() 수동으로 페이지를 다시로드 할 필요없이 웹 사이트의 캐시 된 버전을 업데이트하는 데 사용할 수 있습니다.

다음은 HTML5 Rocks 에서 초보자를위한 응용 프로그램 캐시 사용에 대한 코드 예제로, 사용자를 최신 버전의 사이트로 업데이트하는 방법을 설명합니다.

// Check if a new cache is available on page load.
window.addEventListener('load', function(e) {

  window.applicationCache.addEventListener('updateready', function(e) {
    if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
      // Browser downloaded a new app cache.
      // Swap it in and reload the page to get the new hotness.
      window.applicationCache.swapCache();
      if (confirm('A new version of this site is available. Load it?')) {
        window.location.reload();
      }
    } else {
      // Manifest didn't changed. Nothing new to server.
    }
  }, false);

}, false);

응용 프로그램 캐시 사용을 참조하십시오. 정보는 Mozilla Developer Network .

2016 업데이트

웹에서 상황이 빠르게 바뀝니다. 이 질문은 2009 년에 요청되었으며 2012 년에 질문에 설명 된 문제를 처리하는 새로운 방법에 대한 업데이트를 게시했습니다. 또 다른 4 년이 지났는데 이제는 더 이상 사용되지 않는 것 같습니다. cgaldiolo 덕분에의견에서 지적 해 에게 .

현재 2016 년 7 월 현재 HTML 표준, 섹션 7.9, 오프라인 웹 응용 프로그램 에는 사용 중단 경고가 포함되어 있습니다.

이 기능은 웹 플랫폼에서 제거되고 있습니다. (이 과정은 오랜 시간이 걸립니다.) 현재 오프라인 웹 응용 프로그램 기능을 사용하지 않는 것이 좋습니다. 대신 서비스 직원을 사용하십시오.

2012 년에 언급 한 Mozilla 개발자 네트워크 에서 응용 프로그램 캐시 사용도 마찬가지입니다 .

더 이상 사용되지 않음
이 기능은 웹 표준에서 제거되었습니다. 일부 브라우저는 여전히이를 지원할 수 있지만 삭제되는 중입니다. 오래된 프로젝트 나 새로운 프로젝트에서는 사용하지 마십시오. 이를 사용하는 페이지 또는 웹 앱은 언제든지 중단 될 수 있습니다.

서비스 워커 페치 차단이 활성화 된 경우 버그 1204581-AppCache에 대한 지원 중단 알림 추가를 참조하십시오 .

답변

그렇지 않습니다. 한 가지 방법은 컨텐츠를 제공 할 때 적절한 헤더를 전송하여 브라우저를 강제로 다시로드하는 것입니다.

모든 브라우저에서 웹 페이지가 캐시되지 않도록하십시오.

에 대한 검색 "cache header"SO에서 하거나 이와 비슷한 것을 찾으면 ASP.NET 관련 예제를 찾을 수 있습니다.

덜 깨끗하지만 때로는 서버 측에서 헤더를 제어 할 수없는 경우 유일한 방법은 호출되는 리소스에 임의의 GET 매개 변수를 추가하는 것입니다.

myimage.gif?random=1923849839

답변

들어 정적 리소스 바로 캐싱하는 것입니다 쿼리 매개 변수를 사용하여 각 배포 또는 파일 버전의 값. 이는 각 배포 후 캐시를 지우는 효과가 있습니다.

/Content/css/Site.css?version={FileVersionNumber}

다음은 ASP.NET MVC 예입니다.

<link href="@Url.Content("~/Content/Css/Reset.css")?version=@this.GetType().Assembly.GetName().Version" rel="stylesheet" type="text/css" />

어셈블리 버전을 업데이트하는 것을 잊지 마십시오.

답변

나는 비슷한 문제가 있었고 이것이 내가 해결 한 방법이다.

  1. 에서 index.html파일 I 매니페스트 추가했습니다 :

    <html manifest="cache.manifest">

  2. 에서 <head>섹션 스크립트 캐시를 업데이트를 포함 :

    <script type="text/javascript" src="update_cache.js"></script>

  3. 에서 <body>섹션 I 기능 온로드 삽입 한 :

    <body onload="checkForUpdate()">

  4. 에서 cache.manifest나는 모든 파일을 넣어 한 내가 캐시합니다. 이제는 “버전”주석을 업데이트 할 때마다 제 경우 (아파치)에서 작동하는 것이 중요합니다. “? ver = 001″또는 이름 끝에 무언가를 사용하여 파일 이름을 지정할 수도 있지만 필요하지는 않습니다 . 변경하면 # version 1.01캐시 업데이트 이벤트가 트리거됩니다.

    CACHE MANIFEST
# version 1.01
style.css
imgs/logo.png
#all other files

    index.html 에만 1, 2 및 3. 포인트를 포함시키는 것이 중요합니다 . 그렇지 않으면

    GET http://foo.bar/resource.ext net::ERR_FAILED

    페이지가 이미 캐시되어있는 동안 모든 “하위”파일이 페이지를 캐시하려고하기 때문에 발생합니다.

  5. 에서 update_cache.js파일이 코드를 넣어했습니다 :

    function checkForUpdate()
{
    if (window.applicationCache != undefined && window.applicationCache != null)
    {
        window.applicationCache.addEventListener('updateready', updateApplication);
    }
}
function updateApplication(event)
{
    if (window.applicationCache.status != 4) return;
    window.applicationCache.removeEventListener('updateready', updateApplication);
    window.applicationCache.swapCache();
    window.location.reload();
}

이제 파일을 변경하기 만하면 매니페스트에서 버전 주석을 업데이트해야합니다. 이제 index.html 페이지를 방문하면 캐시가 업데이트됩니다.

솔루션의 일부는 내 것이 아니지만 인터넷을 통해 찾은 다음 작동하도록 구성했습니다.

답변

나는 고객의 사진을 온라인으로 찍을 사진이 있고 사진이 변경되면 div를 업데이트 해야하는 경우가있었습니다. 브라우저에 여전히 오래된 사진이 표시되었습니다. 그래서 나는 매번 고유 한 임의의 GET 변수를 호출하는 해킹을 사용했습니다. 여기 누군가를 도울 수 있다면

<img src="/photos/userid_73.jpg?random=<?php echo rand() ?>" ...

편집 다른 사람들이 지적했듯이 다음은 이미지가 변경 될 때만 이미지를 다시로드하여 파일 크기 로이 변경 사항을 식별하기 때문에 훨씬 효율적인 솔루션입니다.

<img src="/photos/userid_73.jpg?modified=<? filemtime("/photos/userid_73.jpg")?>"