주소 입력
사용자가 깊은 경로로 바로 들어오거나 현재 경로에서 새로고침한다.
SPA 새로고침과 서버 fallback 흐름
클라이언트 라우팅은 앱 내부 이동에 강하지만, 주소 직접 입력이나 새로고침은 서버가 같은 HTML을 돌려줘야 화면이 복원된다.
직접 접근 처리 흐름
HTTP + routeHTTP 요청
브라우저는 실제 서버에 해당 경로의 문서를 요청한다.
서버 fallback
서버는 앱 진입점 HTML을 돌려주고 정적 JS를 함께 로드하게 한다.
라우트 매칭
클라이언트 라우터가 현재 pathname에 맞는 화면을 선택한다.
화면 복원
필요한 데이터만 다시 가져오고 해당 뷰를 DOM에 그린다.
URL
HTTP
HTML
route
render
내부 이동은 History API가 처리하지만, 새로고침과 직접 접근은 서버 fallback 설정이 있어야 같은 SPA 라우터로 이어진다.