Side-Project-Since-04 / wepl-fe

1 stars 1 forks source link

SSR에서 Suspense 경계에 에러가 발생하는 경우를 일단 우회하기 #83

Closed CheolWoongChoi closed 1 month ago

CheolWoongChoi commented 2 months ago

RSC든, RCC든 Next 서버 쪽에서 한번 렌더링 과정을 거침

CSR에서는 QueryErrorResetBoundary, ErrorBoundary로 대응이 가능하나, SSR에서는 에러바운더리로 비동기 통신에 대한 에러 대응 불가능

Next에서 SSR 환경에서 Suspense 경계에 에러가 발생하면,

  1. 일단 로딩 (Fallback)을 보여주고
  2. CSR에서 API refetch or 에러바운더리의 폴백을 보여준다고 하나 -> https://github.com/TanStack/query/discussions/6348#discussioncomment-7530654

Next 빌드 과정에서 오류가 발생하면, 빌드오류를 띄우고 종료시킨다. 일단은, AsyncBoundary를 만들건데 그 안에서 SSR 환경 (서버환경) 인지 체크해서, Suspense 내부를 동작시키지 않게 우회하는 것이 좋을 듯

-> https://velog.io/@thkim/SSR-%ED%99%98%EA%B2%BD%EC%97%90%EC%84%9C-Suspense%EC%99%80-useQuery%EA%B0%80-%EC%98%A4%EC%9E%91%EB%8F%99%ED%95%98%EB%8A%94-%EB%AC%B8%EC%A0%9C-%ED%95%B4%EA%B2%B0%ED%95%98%EA%B8%B0 -> https://sangmin802.github.io/Study/Framework/next.js%20async/ -> https://velog.io/@kingyong9169/react-declarative-error-loading-handling

jun0811 commented 2 months ago

Next 빌드 과정에서 오류가 발생하면, 빌드오류를 띄우고 종료시킨다. 일단은, AsyncBoundary를 만들건데 그 안에서 SSR 환경 (서버환경) 인지 체크해서, Suspense 내부를 동작시키지 않게 우회하는 것이 좋을 듯 => 이게 무슨말인지 이해가 안됩니다 빌드가 오류나서 빌드 오류를 띄우는 걸 막기 위해서 Suspense 동작을 우회시킨다..?