배포 후 CSS 파일의 변경 내용이 반영되지 않습니다.

Question

JSF 웹 응용 프로그램에서 작업하고 있습니다. CSS 파일을 변경하고 처음으로 프로그램을 배포 할 때마다 CSS 파일의 변경 내용이 반영되지 않습니다. 나는 다른 상황에서 그것을 테스트했다. 어떻게 이런 일이 발생하며 어떻게 해결할 수 있습니까? 내가 Ctrl + F5를 눌러

Answer 1

예는 그 다음

을로드 그것은 바로 브라우저 캐시에서 제공되고 있었다. 그건 아주 괜찮아. 실제 생산 환경에서 네트워크 대역폭을 절약합니다. 그러나 개발 과정이나 업데이트를 제작할 때마다 이것이 방해가된다고 생각할 수 있습니다. 개발 중에 Ctrl + F5 키를 익히는 법을 배웁니다. 그러나 제작자는 최종 사용자가 "트릭"을 인식하지 못하기 때문에이를 해결하고 싶습니다.

일반적인 접근법은 버전 번호를 요청 매개 변수로 CSS 리소스에 추가하는 것입니다.

<link rel="stylesheet" href="style.css?v=1.0" /> 

CSS를 크게 변경하면 항상 업데이트를 적용하기 전에 버전 번호를 증가시키고 싶습니다.

<link rel="stylesheet" href="style.css?v=1.1" /> 

이렇게하면 브라우저가 스타일 시트를 다시로드하게됩니다.

또 다른 방법은 서버의 시작 시간을 사용하는 것입니다. JSF를 사용할 때 faces-config.xml에 응용 프로그램 범위 관리 Bean으로 선언 된 java.util.Date을 사용하면 쉽게 수행 할 수 있습니다. 이 같은 HTML로 생성됩니다

<link rel="stylesheet" href="style.css?#{startup.time}" /> 

:

이

<link rel="stylesheet" href="style.css?1314105929937" /> 

그것은 당신이 서버를 다시 시작하거나 매번 변경됩니다

<managed-bean> 
    <description>Startup date</description> 
    <managed-bean-name>startup</managed-bean-name> 
    <managed-bean-class>java.util.Date</managed-bean-class> 
    <managed-bean-scope>application</managed-bean-scope> 
</managed-bean> 

그럼 당신은 타임 스탬프를 얻을 Date#getTime()을 사용할 수 있습니다 webapp을 재배포하십시오. 따라서 브라우저는 리소스를 다시로드해야합니다 (실제로 변경되지 않았을 때조차도!) 캐싱과 대역폭 사용량이 공동 일 경우이를 명심하십시오 엔). JavaScript와 이미지와 같은 다른 정적 리소스에도 동일한 기술을 적용 할 수 있습니다.

이미 JSF 2.x를 사용하고 있다면, 내장 된 "리소스 라이브러리 버전 관리"기능을 사용할 수 있습니다. 또한 What is the JSF resource library for and how should it be used?

Answer 2

나는 CSS 파일을 바꾸는 동안 동일한 문제가 있었고 사이트를 새로 고쳐야했다. 꽤 귀찮고 매우 부끄러웠다.

결국 나는 프로젝트에 구현해야하는 멋진 "도구"인 자바 스크립트 파일을 발견했습니다. 나중에 사이트를 새로 고칠 필요가 없으며 CSS 파일을 저장하면 2,3 초 후에 변경 사항이 자동으로 적용됩니다.