[HTTP] 브라우저에서 axios 요청 보낼 시 브라우저 캐시(from disk cache) 미사용 설정

·2023년 4월 10일
1
post-thumbnail

홈에서 상세를 들어간 후 홈으로 뒤로가기 시 새로운 api 요청을 하지 않고 브라우저 캐시인 disk cache에서 들고 오는 걸 발견할 수 있었다. (요청 헤더 확인)
굳이 다시 api 요청이 필요하지 않다면 문제가 없지만 이번 작업에선 꼭 다시 요청이 필요했다.

export const $axios = axios.create({
  headers: {
    'Cache-Control': 'no-cache',
    'Pragma': 'no-cache',
    'Expires': '0',
  },
});

기본 axios header 설정을 no-cache로 해주었다. 사실 prettier로 Single-quote가 제거되어

export const $axios = axios.create({
  headers: {
    'Cache-Control': 'no-cache',
    Pragma: 'no-cache',
    Expires: '0',
  },
});

이런 식으로 설정이 되었는데 이렇게 설정할 경우 초반에만 적용이 되고 시간이 지나면 다시 디스크 캐시를 사용하는 현상(?)이 발생했다........
혹시 시간이 지나니 다시 디스크 캐시를 사용하는 경우 옵션 전부 Single-quote로 감싸서 해보시길 바랍니다.. 이유가 뭘까요?

0개의 댓글