캐시 무효화가 작동하지 않는 이유

캐시 무효화를 사용하여 웹사이트의 새 버전을 출시하는 것은 작동하지 않습니다.

작은 웹사이트를 개발할 때 캐싱 관리 프로세스를 건너뛰고 모든 것을 직접 제공하기 쉽습니다. 그러나 일단 웹사이트가 확장되고 콘텐츠 배포 네트워크(CDN)를 활용하기 시작하면 적절한 캐싱 전략을 구현하는 것이 중요합니다. 개발자가 이 단계를 건너뛰면 고객이 오래된 콘텐츠를 받거나 웹 사이트가 손상될 수도 있습니다.

CDN이 캐시를 사용하는 이유

콘텐츠 배포 네트워크(CDN)는 일반적으로 성능을 위한 웹 요청에 대한 응답을 캐시하는 데 사용됩니다. CDN이 웹사이트를 캐시하면 원본으로 돌아가지 않고 콘텐츠를 제공합니다. 이것은 시간을 절약하고 더 나은 고객 경험을 제공합니다. 그러나 CDN에 캐시된 콘텐츠가 있는 경우 오래된 정보를 제공할 수 있습니다. 개발자가 새 콘텐츠를 출시할 수 있는 방법 중 하나는 CDN에서 제공하는 도구로 캐시를 무효화하는 것입니다.

캐시 무효화가 작동하지 않는 이유

CDN 수준에서 캐시를 무효화해도 사용자 브라우저 또는 인터넷 서비스 공급자(ISP) 캐싱에는 영향을 미치지 않습니다. 캐시를 무효화하더라도 고객 입장에서는 무슨 일이 벌어지고 있는지 알 길이 없다는 뜻이다.



브라우저는 CDN과 동일한 지침을 사용하여 헤더를 캐시합니다. 즉, 사용자가 사이트에 액세스하면 이후에 캐시를 무효화하고 사용자가 사이트를 다시 방문하면 여전히 이전 버전을 받을 수 있습니다.

Invalidation is intended for use in exceptional circumstances, not as part of your normal workflow. Invalidations don’t affect cached copies in web browser caches or caches operated by third-party internet service providers. — Google

ISP가 일반적으로 사용하는 웹사이트의 데이터를 캐시하여 네트워킹 비용을 절약하고 소유한 서버의 부하를 줄이는 것도 일반적입니다.

사용자의 브라우저나 ISP가 콘텐츠를 캐시하면 캐시에서 콘텐츠를 제거할 수 없습니다. 이것이 캐시 무효화가 작동하지 않고 대체 솔루션을 사용해야 하는 이유입니다.

대안은 무엇입니까?

웹사이트를 변경할 때 캐시를 무효화하는 대신 적절한 캐시 헤더 또는 캐시 무효화를 사용해야 합니다. 웹 사이트에서 기본적으로 캐싱 헤더를 설정하는 것이 일반적이지만 캐시 무효화의 필요성을 피하기 위해 적절하게 사용하는 것이 중요합니다.

만료

만료 헤더를 사용하여 캐시에서 특정 개체를 지워야 하는 시간을 설정할 수 있습니다. 그러나 이 헤더를 관리하기 어려울 수 있으며 몇 가지 기술적인 문제가 있습니다.

the time format is difficult to parse, many implementation bugs were found, and it is possible to induce problems by intentionally shifting the system clock — Mozilla

Expires: Tue, 28 Feb 2022 22:22:22 GMT

캐시 제어: 최대 연령

일반적으로 개체를 캐시해야 하는 기간을 제공하려면 max-age 헤더를 사용해야 합니다. 헤더가 초 단위로 설정되므로 1일과 같은 86400으로 설정하는 것이 좋습니다. 즉, 사이트의 새 버전을 출시하면 24시간 후에 모든 사용자에게 사이트가 표시된다는 것을 의미합니다.

Cache-Control: max-age=86400

캐시 무효화

캐싱을 사용하면서도 고객에게 즉각적인 업데이트를 제공하려는 경우 캐시 무효화라는 더 복잡한 솔루션을 사용할 수 있습니다. 요청 캐시에 고유한 URL 또는 쿼리 문자열 값을 설정하면 각 버전을 새 객체로 취급합니다. 즉, 변경될 때마다 새 링크를 배포하고 초기 index.html을 캐시하지 않으면 캐시가 이전 파일을 지울 때까지 기다리지 않고 새 파일을 로드할 수 있습니다.

# Initial link  
/css/main.css?1653714985

# New link  
/css/main.css?1653715024</pre>

요약

다음 번에 웹 사이트 변경 사항을 배포하기 위해 캐시를 무효화해야 할 때는 대신 max-age 또는 캐시 무효화를 사용해 보십시오. 올바른 파일이 고객에게 제공되고 있다는 확신을 제공하면서 배포할 때마다 시간과 노력을 절약할 수 있습니다.

추가 정보

HTTP caching - HTTP | MDN

Cache-Control - HTTP | MDN

더 많은 내용을 보려면 여기에서 저를 팔로우하거나 다음을 통해 저에게 연락하십시오:

트위터:

이메일: [email protected]

웹사이트: torvo.com.au