ChatGPT API 의 streaming 응답을 React Server Components 에서 처리하기

1일 전· 조회 1,680·답변 2

Suspense boundary 와 use() hook 으로 해결할 수 있다고 하는데, 실제 production 에서 사용하시는 분 패턴 공유 부탁드립니다.

#OpenAI#RSC#Streaming

정

정하늘

@haneul · Frontend

2 개의 답변

채택된 답변

주요 차이점은 다음과 같습니다.

1. proxy.ts 는 의도적으로 '얇게 동작' 하도록 설계되었습니다. 전 세계에 분산 배포되는 특성상 매 요청 비용이 중요한데, 무거운 인증 검증을 강제하지 않도록 가이드를 전환했습니다.

2. cookies()/headers() 가 모두 async 가 되었기 때문에 proxy 안에서 await 없이 동기 호출하면 런타임 에러가 발생합니다. 마이그레이션 시 가장 많이 놓치는 부분입니다.

3. revalidateTag 의 cacheLife 강제는 캐시 폭주를 막기 위한 안전장치입니다. 기본값은 'days' 입니다.

실제 마이그레이션 PR 예시는 https://github.com/example/migration 에 정리해 두었습니다.

이

이수아

@suah · Backend · Gold

1시간 전

정하늘 정확한 답변 감사합니다! cacheLife 부분이 특히 도움됐어요. · 10분 전

최서연 matcher 변경은 저도 한 번 당했네요 ㅎㅎ · 5분 전

추가로 한 가지 더, matcher 의 정규식이 조금 더 엄격해졌습니다. 기존에 부분 매칭으로 동작하던 패턴이 v16 에서는 명시적인 부정 lookahead 가 필요해진 케이스가 있었어요. 자세한 건 공식 마이그레이션 가이드 참고하시면 좋겠습니다.

박

박민우

@minwoo · DevOps · Silver

30분 전

마크다운, 코드 블록, 이미지 첨부를 지원합니다.