CSS나 JavaScript를 수정했는데 사용자 브라우저에 이전 버전이 캐시되어 있어서 문제가 생긴 적 있으신가요? 해시 기반 파일 이름으로 해결할 수 있습니다.
캐시 버스팅의 원리
파일 내용의 해시를 파일 이름에 포함시킵니다. style.abc123.css 처럼요. 내용이 바뀌면 해시도 바뀌고, 파일 이름이 바뀌니 브라우저가 새로 다운로드합니다.
빌드 도구에서의 활용
Webpack, Vite 같은 번들러가 자동으로 해시를 파일 이름에 추가해줍니다. [contenthash] 옵션을 설정하면 됩니다. 해시 생성기와 같은 원리로 파일 내용을 해시해서 이름에 넣는 거죠.
장점
1) 내용이 안 바뀌면 해시도 안 바뀌어서 캐시 유지 2) 내용이 바뀌면 자동으로 새 버전 로드 3) 수동으로 버전 관리할 필요 없음. 현대 웹 개발의 표준 기법입니다.
해시와 보안의 관계
해시는 보안에서 중요한 역할을 하지만, 만능이 아닙니다. 해시 생성기로 만든 해시값은 원본 데이터를 숨기는 데는 좋지만, 짧거나 예측 가능한 입력은 무차별 대입으로 찾아낼 수 있습니다. 예를 들어 4자리 PIN을 해시해도 10,000가지 경우의 수만 시도하면 원본을 찾을 수 있죠. 그래서 비밀번호 해싱에는 솔트(salt)를 추가하고, bcrypt처럼 의도적으로 느린 알고리즘을 씁니다.
레인보우 테이블 공격
미리 계산해둔 해시-원본 쌍을 이용한 공격입니다. 솔트를 사용하면 각 사용자마다 다른 해시가 생성되어 이 공격을 무력화할 수 있습니다. 요즘 프레임워크들은 솔트를 자동으로 처리해주지만, 직접 구현할 때는 반드시 솔트를 포함시켜야 합니다.