게시글 공유는 웹앱 셸을 내려준다 — 같은 주소에서 바로 웹앱

[seizeh]

직전 PR(#128)의 "웹에서 계속 보기" 2차 CTA 를, 링크를 누르면 바로 웹앱이 뜨는 방식으로 바꾼다.

왜 웹앱 주소를 그냥 공유하지 않나

그러면 크롤러가 빈 셸을 받아 카톡 링크 미리보기가 죽는다(Flutter 웹은 클라이언트 렌더링). 그래서 공유 주소는 go.pawmate.kr/s?t=… 그대로 두고, 이 함수가 웹앱의 index.html 을 가져와 아래를 주입해 내려준다.

1. <base href> 를 웹앱 절대주소로 — 에셋(main.dart.js·canvaskit.wasm 등)을 그쪽에서 받는다. pmdart 쪽에 web/_headers 로 CORS 를 열어 뒀다.
2. 토큰별 OG 태그(제목·설명·이미지·url) + <title>
3. <meta name="pm-post"> — 열어야 할 게시글 id

3번이 필요한 이유: 주소에는 토큰만 있는데 토큰→게시글 해석은 share_view_load(service_role 전용) 라 웹앱이 스스로 못 한다. 서버가 대신 실어 보낸다.

결과: 크롤러는 OG 만 읽고 → 미리보기 유지. 사람은 같은 주소에서 웹앱이 부팅 → 바로 둘러보기.

폴백

• 셸을 못 가져오면(웹앱 배포 중, 네트워크 오류 등) 기존 서버 렌더링 HTML 로 폴백한다. 공유 링크가 죽는 것보다 낫다.
• WEB_APP_URL 미설정이면 지금까지와 완전히 동일하게 동작한다. 즉 이 PR 만 머지·배포해도 사용자 노출 변화는 0 이고, 시크릿을 넣는 순간 전환된다.

케어리포트·업체 미리보기는 이 경로를 쓰지 않는다

수신자 성격이 다르다.

	게시글 공유	케어리포트 공유
수신자	불특정 다수	그 반려동물의 보호자 한 명
목적	둘러보다 설치	내 아이 기록을 받는 것
이후	앱 설치	앱 설치 + 계정 연결(전화번호 대조 자동 연결)

자동 연결(claim_care_reports)은 앱에만 있다. 웹앱으로 보내면 "로그인해도 내 기록이 안 보이는" 상태가 된다.

감수한 비용

지금은 링크를 누르면 서버 렌더링 HTML 이 즉시 뜨고 사진·본문이 바로 보인다. 바뀌면 CanvasKit 2MB 를 받는 동안 스플래시를 3~4초 보게 된다(모바일 데이터면 더). 즉시 표시를 내주고 탐색 깊이를 얻는 교환이며, 사용자가 이 비용을 알고 선택했다.

부작용 하나 더: 셸이 go.pawmate.kr 오리진에서 뜨므로 app.pawmate.kr 의 세션(sessionStorage)은 공유되지 않는다. 공유 링크는 게스트 대상이라 감수한다.

검증

deno check 통과. 실제 동작 확인은 WEB_APP_URL 설정 후에 가능하다(그전까지는 기존 경로).

🤖 Generated with Claude Code