1. 문제 상황

2. 해결 과정

처음보는 에러이다. middleware api 서버를 next.js로 띄워서 이와 관련한 에러가 아닐까 의심을 했다.

1. middleware api서버로의 fetch에 force-cache옵션을 끈다.

next.js의 api서버가 아직 만들어지지 않아 발생한 오류였다. 이 옵션을 끄니 해결이 되었다.

force-cache 옵션을 끄니 해결이 되었다. 하지만, force-cache옵션이 꺼져 있어서 옵션이 바뀔 때마다 데이터를 매 번 다시 서버에서 받아오는 것을 확인할 수 있다.

<aside> ❗ next.js 공식문서에서는 분명히 기본값이 force-cache라는데 실제로 그렇지 않은 듯하다.

</aside>

그렇다면, api서버가 이제 만들어졌으니 이제 force-cache옵션을 켜도 되지 않을까?

2. middleware api서버로의 fetch에 force-cache옵션을 켠다.

한 번 배포를 하고, 이제 api서버가 만들어졌을 테니 이제 force-cache로 수정을 하고 다시 배포를 해보았다.

오른쪽 네트워크창을 보면 처음에만 데이터를 가져오고, 그 이후로는 캐싱된 데이터를 ‘디스크 캐시’에서 가져오는 것을 확인할 수 있다. 데이터 불러오는데 5~10ms로 정말 짧다.