SSG 시 SPA fallback 및 asyncData & fetch 문의(부분 SPA or CSR)
미해결
Nuxt.js 시작하기
사내 협업을 위한 인하우스 앱도 nuxt로 새로 개발하려 합니다. 문제는 파편화된 기존 백엔드와(대부분 REST API, 최근 몇개는 웹소켓) 지금까지 사용하던 Django (HTML 템플릿 + jQuery) 서비스에 최신 프론트엔드를 붙여야 하는 상황입니다. 그러다 보니 SSG 아니면 CSR 밖에 선택지가 없는데, https://nuxtjs.org/docs/concepts/static-site-generation/ 에서 generate.exclude 옵션을 사용한 뒤 nuxt generate로 정적 사이트를 생성하면 해당 경로는 CSR로 된다는 것을 읽었습니다. 이 기능을 사용하고 싶어 검색 후 다음과 같은 게시물을 확인하였습니다. https://stackoverflow.com/questions/68837954/how-do-dynamic-api-calls-work-in-nuxt-js-static-vs-ssr-mode https://www.reddit.com/r/Nuxt/comments/ndn2vz/comment/gybtj55/ 위 두 글에서 링크한 nuxt 블로그 게시물( https://nuxtjs.org/announcements/going-full-static/#crazy-fast-static-applications )을 확인하니, nuxt 2.14 버전 이후로는 target: 'static'인 상태에서 nuxt generate를 실행 시 클라이언트 사이드 내비게이션에서의 asyncData와 fetch를 모사하기 위해서 HTML을 사전 렌더링할 때 페이로드 파일을 저장한다고 하고 있습니다. this means no more HTTP calls to your API on client-side navigation. 즉 SSG 모드를 켜면 더 이상 API에서 값을 가져오는 것이 아닌 generate 할 때의 API 값을 저장해 하나의 html로 만들어버린다는 것인데, 혹시 이 옵션을 끄고 SSG와 SSR, CSR 모두 동일하게 페이지 진입 시 API에서 새 값을 받아올 수 있게 하는 법이 있을까요? API에서 값을 받아오고 싶으면 무조건 exlcude에 경로를 추가해 CSR로 돌려야 하나요?
- ssg
- csr
- vuejs
- generate.exclude
- nuxtjs
- ssr
- asyncdata