[javascript] 캐시가 비활성화되어 있어도 서버가 코드 파일의 변경 사항을 무시하는 이유는 무엇입니까?

로컬 호스트 (Windows 7, Chrome v79.0.3945.130 (64 비트))에서 html / js 코드를 테스트하고 시간 코드 변경의 약 50 %가 브라우저에 반영되지 않습니다 (개발 도구 / 소스에서 확인) ).
인터넷에는 많은 조언이 있지만 작동하지 않는 것 같습니다.

  • 다시로드를 마우스 오른쪽 단추로 클릭하고 “빈 캐시 및 하드 다시로드”를 선택하십시오. 30 %의 경우에는 도움이되지 않습니다.
  • Chrome 개발자 도구의 네트워크 탭에서 캐시를 사용 중지합니다. 도움이되지 않습니다.
  • <meta http-equiv="Cache-control" content="no-cache">헤더에 추가 -도움이되지 않습니다.
  • 교체 <script src="common.js"></script>로는 <script src="common.js?blabla"></script>– 사례의 60 %에 도움이됩니다,하지만 당신은 모든 변화는 거대한 기계에 의존 후 그것을 할 필요가있다. 또한 html 변경 사항에는 작동하지 않습니다.
  • 파일을 index.html에서 index2.html과 같은 새 파일로 복사하고 코드에서 파일 이름을 바꿉니다. 항상 작동하지만 더 큰 작업입니다.

github.io에 코드를 커밋 할 때 똑같은 문제가 발생합니다.

사이트가 코드 변경 사항을 즉시 반영하도록 도와주십시오.


편집 : index3.html 파일을 만들고 거기에 “hello world”만 넣었습니다. 브라우저에서 파일을 열었습니다. “hello world2″로 변경-브라우저가 내용을 업데이트했습니다. “hello world3″으로 변경 – 여러 번 다시로드하고 “빈 캐시 및 하드 다시로드”후에도 브라우저에 여전히 “hello world2″가 표시되었습니다. “hello world4″로 변경했습니다. 브라우저에 여전히 “hello world2″가 표시되었습니다. 4 시간 동안 나는 “hello world5″로 바뀌었다 – 브라우저는 여전히 “hello world2″를 보여준다. 이 파일은 기본 메모장으로 편집했습니다.


Edit2 : 사람들은 내가 사용중인 서버를 계속 묻습니다. 이것은 문제의 일부처럼 보입니다. 불행히도, 나는 그것을 확인하기 위해 정확히 무엇을 해야하는지 모른다. 여기까지 내가 찾은 모든 것이 있습니다.

  • 나는이 inetpub/wwwroot난에서 브라우저에서 HTML & JS 파일과 다음 열기 index.html을 넣어 디렉토리를 http://localhost/.
  • Devs Tools의 내 네트워크 패널은 다음과 같습니다 : image link .
  • 서버 설정이 매우 빨라서 추가 소프트웨어를 설치할 필요가 없었습니다. 즉, node.js를 사용하지 않습니다.
  • iisstart.htm이 열렸을 inetpub/wwwroothttp://localhost/iisstart.htmIIS7이라고 말합니다.


답변

매개 변수를 사용하는 것이 올바른 방법입니다! 여기서 큰 변경 사항에서만 수동으로 변경하는 버전 번호를 추가 할 수 있으며 디버깅을 위해 Date.time ()으로 설정할 수 있으므로 <head> 태그에서 매개 변수가 항상 새로운이므로 캐시 된 모든 버전을 덮어 씁니다 하나:

< script type="text/javascript">
    var script = document.createElement('script');
    var version = Date.time();
    script.src = "common.js?v="+version;
    document.head.appendChild(script)
< /script>

도움이 되었기를 바랍니다!


답변

Windows 7에서 실행되는 IIS7 Windows 서버에서 콘텐츠 캐싱을 방지하려면이라는 구성 파일 중 하나를 변경해야합니다 web.config. 나중에 IIS 7에 대한 구성 파일의 위치는 %WinDir%\System32\Inetsrv\Config folder어디에서 %WinDir%Windows를 (일반적으로 설치되어있는 폴더입니다 C:/Windows).

web.config파일을 변경하기 전에 파일을 롤백 할 수 있도록 편집하기 전에 파일 의 백업 사본을 작성하십시오 .

당신의에서 web.config파일, 당신의 캐싱 방지하기 위해 다음을 추가합니다 index.html:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>

  <location path="index.html">
    <system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="Cache-Control" value="no-cache" />
        </customHeaders>
      </httpProtocol>
    </system.webServer>
  </location>

</configuration>

web.config여기 에서 파일 의 파일 경로를 얻었습니다 . Windows Doc : Configuration Reference

위의 캐시 구성을 여기에서 얻었습니다. IIS를 통해 제공되는 단일 페이지 응용 프로그램 HTML 파일의 캐싱을 비활성화하는 방법은 무엇입니까?


답변

나는 같은 문제가 있었고 이것은 내 체크리스트입니다.

  1. 검사 의 Web.config (캐싱 및 clientcache, 커널 캐시 정책 등) 또는 htaccess로 (헤더 캐시 제어 설정).
  2. ASP, PHP와 같은 동적 언어를 사용한 경우 내부 캐시 설정이있을 수 있습니다. 한 경우에는 <%Response.Expires=1440%>많은 ASP 코드 줄에서 발견 되었으며 다른 모든 설정을 극복하고있었습니다! PHP session_cache_expire에서 동일한 작업을 수행 할 수 있습니다.
  3. IIS를 사용하는 경우 서버 > HTTP 응답 헤더 를 확인하여 서버 이름 아래에 나열된 개별 웹 사이트에 대해서도 동일한 캐싱이 없는지 확인하십시오.
  4. http-equiv="Cache-control"html 헤더를 확인하십시오 (이 테스트를 통과했습니다!).

마지막으로 나는 위의 모든 상황에서, 확인 ‘라고해야 함 캐시 에서 newtwork의 그러나이 좋다 항상 나를 위해 일한 크롬 콘솔에서 탭하는 목적으로 만 사용하고 그렇게 늘 방문자 디버깅을 위해 페이지의 새로운 버전을 볼 수 있습니다!


답변

Chrome을 사용하는 특정 경우에는 다음을 시도하십시오. 개발 도구 열기-> ‘네트워크’탭으로 이동 페이지를 새로 고친 후 ‘캐시 사용 안함’확인란을 선택하십시오.

참고 :이 작업을 수행 할 때마다 개발 도구 창이 항상 열려 있어야합니다.

여기에 이미지 설명을 입력하십시오

그러나 페이지 등을 강제로 새로 고치지 않고 변경 사항을 사용자에게 전파하려면 자주 변경되는 파일에 대해 참조 된 각 파일의 끝에 파일 버전을 추가해야합니다. 예를 들면 다음과 같습니다.

<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Sites/stackoverflow/primary.css?v=20b379f72a37" >

v=20b379f72a37끝에 추가 파일 내용의 자동 생성 된 파일의 해시입니다.


답변

이것은 긴 샷이지만 어떤 종류의 편집기 / IDE를 사용하고 있습니까? 또한 index.html에서 어떤 종류의 수정을하고 있습니까?

파일을 저장하고로드하려고 할 때 반영되지 않는 이러한 편집의 예를 제공 할 수 있습니까?

문제를 재현하려고합니다. 사람들이 제안한 바에 따르면 문제가 코드 자체에있는 것으로 보이지 않습니다. 환경 문제인 것 같지만 의심을 확인하려면 더 많은 정보가 필요합니다.


답변

HTML 메타로 작성하는 것은 엄격한 지침이 아니라 브라우저에 대한 권장 사항입니다. 브라우저에서 엄격한 캐싱을 사용하면 도움이되지 않습니다.

솔루션은 잘 설명되어 있습니다 : https://curtistimson.co.uk/post/front-end-dev/what-is-cache-busting/

서버 측에서 파일 자체의 마지막 업데이트 날짜가있는 버전을 스크립트에 추가하는 것을 선호합니다.

<script src="/myScript.js?v=1579780745150"></script>

여기서 1579780745150 은 Unix Timestamp가 myScript.js 파일 자체를 업데이트합니다 . 자체 파일에서만 작동하지만 외부 파일은 필요하지 않습니다. 대부분 파일 이름은 버전입니다.


답변

이것은 아마도 실망스럽고, 당신이 잘못하고있는 것처럼 들리지 않습니다.

브라우저와 스크립트 파일 사이에 어떤 캐싱을 수행하는 것이 문제 일 수 있습니다.

그것이 무엇인지 확인하기 위해 localhost URL을 어떻게 탐색하고 있는지 묻겠습니다.

예 :

file://path/to/file.html
http://localhost/file.html
http://127.0.0.1/file.html
http://[machine's-hostname]/file.html
http://[custom-domain-defined-in-hosts-file]/file.html

실행 중이라면 file://path/to/file.html웹 서버 / 프록시를 통해 탐색하지 않는 것입니다. 그렇다면 http://[something]/file.html어떤 종류의 웹 서버를 실행 중이며 범인 일 가능성이 큽니다. 캐싱을 해제 할 수있는 설정을 찾으십시오.

웹 서버를 사용하지 않고 문자 그대로 웹 서버없이 로컬 html 파일을 직접 탐색하는 경우 브라우저가 범인이라고 제안합니다. 이 경우 Martin Shishkov가 제안한 것처럼 브라우저 캐싱을 끄는 것이 좋습니다 .