@nifrajs/web 4.0.2 → 5.0.0

package/src/deferred.ts

@@ -6,6 +6,7 @@
  * resolution scripts settle. The per-adapter `<Await>` lives in `@nifrajs/web-{solid,react}/client`.
  */
 import { plainJsonCodec, type TransportCodec } from "@nifrajs/core/transport-codec"
+import { parsePageData } from "./internal/revive-dates.ts"
 
 /**
  * A loader value marked to stream in after the shell. The component consumes it with the adapter's
@@ -164,25 +165,29 @@ export function ndjsonStream(
   deferred: ReadonlyArray<{ readonly id: number; readonly promise: Promise<unknown> }>,
   codec: TransportCodec = plainJsonCodec,
 ): ReadableStream<Uint8Array> {
+  // A client that goes away cancels the body; a value settling after that has nowhere to go.
+  let cancelled = false
   return new ReadableStream({
     async start(controller) {
       controller.enqueue(NDJSON_ENCODER.encode(`${codec.encode(forClient)}\n`))
       await Promise.all(
         deferred.map(async (d) => {
+          let line: string
           try {
-            const value = await d.promise
-            controller.enqueue(NDJSON_ENCODER.encode(`${codec.encode({ i: d.id, v: value })}\n`))
+            line = codec.encode({ i: d.id, v: await d.promise })
           } catch (err) {
             // Redact: stream a stable opaque code, never the raw error text; log the real reason
             // server-side. The client's <Await> errorFallback receives this code.
             console.error("[nifra/web] deferred value rejected:", err)
-            controller.enqueue(
-              NDJSON_ENCODER.encode(`${codec.encode({ i: d.id, e: DEFERRED_ERROR_CODE })}\n`),
-            )
+            line = codec.encode({ i: d.id, e: DEFERRED_ERROR_CODE })
           }
+          if (!cancelled) controller.enqueue(NDJSON_ENCODER.encode(`${line}\n`))
         }),
       )
-      controller.close()
+      if (!cancelled) controller.close()
+    },
+    cancel() {
+      cancelled = true
     },
   })
 }
@@ -213,7 +218,16 @@ export const DEFERRED_RUNTIME = `(() => {
   // Tag the promise (status/value/reason) - React's use() reads them and returns SYNCHRONOUSLY at
   // hydration, so it renders the resolved content directly into the <Suspense> boundary the server
   // streamed (no re-suspend, no fallback flash). r/j also wake awaiters (Solid uses its own _$HY).
-  window.__nifraResolve = (id, v) => { const e = get(id); e.p.status = "fulfilled"; e.p.value = v; e.r(v); };
+  // A t.date() value arrives tagged; rebuild it before anything reads the settled value.
+  const __nifraDates = (d) => {
+    if (!d || typeof d !== "object") return d
+    if (Array.isArray(d)) { for (let i = 0; i < d.length; i++) d[i] = __nifraDates(d[i]); return d }
+    const k = Object.keys(d)
+    if (k.length === 1 && k[0] === "__nifra_date" && typeof d.__nifra_date === "string") return new Date(d.__nifra_date)
+    for (const x of k) { const v = __nifraDates(d[x]); if (v !== d[x]) Object.defineProperty(d, x, { value: v, enumerable: true, writable: true, configurable: true }) }
+    return d
+  };
+  window.__nifraResolve = (id, v) => { v = __nifraDates(v); const e = get(id); e.p.status = "fulfilled"; e.p.value = v; e.r(v); };
   window.__nifraReject = (id, x) => { const e = get(id); e.p.status = "rejected"; e.p.reason = x; e.j(x); };
 })();`
 
@@ -225,6 +239,7 @@ export const DEFERRED_RUNTIME = `(() => {
 export const MAP_DEFERRED_SOURCE = `const mapDeferred = (d) => {
   if (!d || typeof d !== "object") return d
   if (typeof d.__nifra_deferred === "number") return { __nifra_deferred: true, id: d.__nifra_deferred, promise: window.__nifraDeferred(d.__nifra_deferred) }
+  if (typeof d.__nifra_date === "string" && Object.keys(d).length === 1) return new Date(d.__nifra_date)
   if (Array.isArray(d)) return d.map(mapDeferred)
   const out = {}
   for (const k of Object.keys(d)) Object.defineProperty(out, k, { value: mapDeferred(d[k]), enumerable: true, writable: true, configurable: true })
@@ -326,8 +341,11 @@ export async function parseNdjsonData(
   }
 
   const pending: Pending = new Map()
+  // Only plain JSON carries t.date() tags; a richer codec decodes its own dates.
+  const decode = (line: string): unknown =>
+    codec === plainJsonCodec ? parsePageData(line) : codec.decode(line)
   const first = await readLine()
-  const data = markersFromPlaceholders(first === null ? null : codec.decode(first), pending)
+  const data = markersFromPlaceholders(first === null ? null : decode(first), pending)
 
   void (async () => {
     try {
@@ -335,7 +353,7 @@ export async function parseNdjsonData(
         const line = await readLine()
         if (line === null) break
         if (line === "") continue
-        const msg = codec.decode(line) as { i: number; v?: unknown; e?: string }
+        const msg = decode(line) as { i: number; v?: unknown; e?: string }
         const entry = pending.get(msg.i)
         if (entry === undefined) continue
         pending.delete(msg.i)

package/src/dev-feed.ts

@@ -392,6 +392,25 @@ function fnv1a(text: string): string {
   return (hash >>> 0).toString(16).padStart(8, "0")
 }
 
+/**
+ * A query value may be a single-use ticket or a token no redaction pattern knows, so the feed keeps
+ * which keys a request sent and never their values. `/x?ticket=abc&page` -> `/x?ticket=[redacted]&[redacted]`.
+ */
+function queryKeysOnly(target: string): string {
+  const at = target.indexOf("?")
+  if (at === -1) return target
+  const hash = target.indexOf("#", at)
+  const parts = target
+    .slice(at + 1, hash === -1 ? undefined : hash)
+    .split("&")
+    .filter((part) => part.length > 0)
+    .map((part) => {
+      const eq = part.indexOf("=")
+      return eq === -1 ? "[redacted]" : `${part.slice(0, eq)}=[redacted]`
+    })
+  return parts.length === 0 ? target.slice(0, at) : `${target.slice(0, at)}?${parts.join("&")}`
+}
+
 const cap = (text: string, max: number): string =>
   text.length <= max ? text : `${text.slice(0, max)}... [${text.length - max} more chars]`
 
@@ -477,7 +496,7 @@ export function createDevFeed(options: DevFeedOptions): DevFeed {
     if (diagnostic.request !== undefined) {
       redacted.request = {
         method: diagnostic.request.method,
-        url: cap(redactText(diagnostic.request.url), 2048),
+        url: cap(redactText(queryKeysOnly(diagnostic.request.url)), 2048),
       }
     }
     if (diagnostic.codeframe !== undefined) {
@@ -530,7 +549,7 @@ export function createDevFeed(options: DevFeedOptions): DevFeed {
     record.resolvedAt = undefined
     if (requestId !== undefined) record.requestId = requestId
     if (meta.route !== undefined) record.route = meta.route
-    if (meta.page !== undefined) record.page = meta.page
+    if (meta.page !== undefined) record.page = cap(redactText(queryKeysOnly(meta.page)), 2048)
     // Re-insert: Map order is recency order, which eviction relies on.
     errors.delete(key)
     errors.set(key, record)
@@ -557,7 +576,7 @@ export function createDevFeed(options: DevFeedOptions): DevFeed {
       message: text,
     }
     if (requestId !== undefined) entry.requestId = requestId
-    if (meta.page !== undefined) entry.page = meta.page
+    if (meta.page !== undefined) entry.page = cap(redactText(queryKeysOnly(meta.page)), 2048)
     logs.push(entry)
     logBytes += text.length
     if (logs.length > limits.logs || logBytes > limits.logBytes) {
@@ -607,7 +626,7 @@ export function createDevFeed(options: DevFeedOptions): DevFeed {
         seq,
         requestId,
         method,
-        path: cap(redactText(path), 2048),
+        path: cap(redactText(queryKeysOnly(path)), 2048),
         at: nowIso(),
         status: undefined,
         durationMs: undefined,
@@ -856,7 +875,7 @@ export function writeDevServerRecord(root: string, record: DevServerRecord): voi
 
 /** Remove the record only while it is still this server's: a newer server may have replaced it. */
 export function removeDevServerRecord(root: string, token: string): void {
-  // @nifra-gate-reviewed: the server comparing its own token with a file on this machine; no request
+  // nifra-expect NF-S002: the server comparing its own token with a file on this machine; no request
   // reaches this comparison.
   if (readDevServerRecord(root)?.token !== token) return
   rmSync(join(root, DEV_SERVER_RECORD_FILE), { force: true })

package/src/dev-session.ts

@@ -8,6 +8,7 @@
  * either. `/__nifra/last-error` keeps its older, token-free contract behind the same Host check.
  */
 import { performance } from "node:perf_hooks"
+import { writableResponse } from "@nifrajs/core/server"
 import {
   type BrowserError,
   CLIENT_BATCH_MAX_BYTES,
@@ -649,19 +650,9 @@ export function createDevSession(options: DevSessionOptions): DevSession {
       },
       performance.now() - started,
     )
-    try {
-      response.headers.set(DEV_REQUEST_ID_HEADER, requestId)
-      return response
-    } catch {
-      // `Response.redirect()` and fetched responses carry immutable headers on some runtimes.
-      const headers = new Headers(response.headers)
-      headers.set(DEV_REQUEST_ID_HEADER, requestId)
-      return new Response(response.body, {
-        status: response.status,
-        statusText: response.statusText,
-        headers,
-      })
-    }
+    const target = writableResponse(response)
+    target.headers.set(DEV_REQUEST_ID_HEADER, requestId)
+    return target
   }
 
   return {

package/src/dev.ts

@@ -58,7 +58,12 @@ import { dirname, relative, resolve } from "node:path"
 import { type BuildClientOptions, buildClient } from "./build.ts"
 import { type DevEntryMatch, resolveDevEntry } from "./bun-dev-entry.ts"
 import { explainBindFailure } from "./dev-port.ts"
-import { createDevSession, type DevAppHooks, type DevSession } from "./dev-session.ts"
+import {
+  createDevSession,
+  type DevAppHooks,
+  type DevSession,
+  isLoopbackHost,
+} from "./dev-session.ts"
 import { createSsrGraph, type SsrGraph } from "./dev-ssr-graph.ts"
 import { discoverRoutes } from "./fs.ts"
 import { DEFAULT_DEV_PORT, generateClientEntry } from "./index.ts"
@@ -112,6 +117,13 @@ export interface DevServerOptions extends Omit<BuildClientOptions, "minify"> {
    * fix (default `true`). Off, the errors still reach the feed.
    */
   readonly indicator?: boolean
+  /**
+   * Host names the dev server answers besides loopback ones (`localhost`, `*.localhost`, `127.0.0.1`,
+   * `[::1]`), port ignored. Every other `Host` gets a 403: a page on another site whose name a DNS
+   * rebind points at 127.0.0.1 would otherwise read the dev server's pages, loader data and error
+   * overlay. Add a name here when a hosts-file entry or tunnel reaches the server under it.
+   */
+  readonly allowedHosts?: readonly string[]
 }
 
 export interface DevServer {
@@ -465,6 +477,7 @@ export async function createDevServer(options: DevServerOptions): Promise<DevSer
     }
   }
 
+  const allowedHosts = new Set((options.allowedHosts ?? []).map(hostName))
   try {
     server = serve({
       port,
@@ -474,6 +487,12 @@ export async function createDevServer(options: DevServerOptions): Promise<DevSer
       routes: { [PROBE_PATH]: htmlModule.default },
       fetch: async (req: Request): Promise<Response> => {
         const url = new URL(req.url)
+        const host = req.headers.get("host") ?? url.host
+        if (!isLoopbackHost(host) && !allowedHosts.has(hostName(host)))
+          return new Response(
+            `[nifra/web/dev] ${hostName(host)} is not a loopback host; add it to allowedHosts if this server should answer it.\n`,
+            { status: 403, headers: { "content-type": "text/plain; charset=utf-8" } },
+          )
         // The stable client-entry URL. Pages reference THIS; it redirects to whichever hashed chunk Bun
         // is serving at the moment the browser asks. A redirect rather than a proxy so the module's final
         // URL is Bun's own - its HMR client derives its socket and module identity from `import.meta.url`,
@@ -620,6 +639,15 @@ export async function createDevServer(options: DevServerOptions): Promise<DevSer
  * whose message is just "Bundle failed" - the actionable part (which file, which import) lives in
  * `.errors`. Surface it, or the guard reports a failure while hiding the reason.
  */
+/** A Host header's name: lowercased, without its port or IPv6 brackets. */
+function hostName(host: string): string {
+  const name = host.trim().toLowerCase()
+  if (name.startsWith("["))
+    return name.slice(1, name.indexOf("]") === -1 ? undefined : name.indexOf("]"))
+  const colon = name.lastIndexOf(":")
+  return colon === -1 ? name : name.slice(0, colon)
+}
+
 export function buildFailureDetail(err: unknown): string {
   return err instanceof AggregateError && err.errors.length > 0
     ? err.errors.map((e) => `  ${e instanceof Error ? e.message : String(e)}`).join("\n")

package/src/draft.ts

@@ -1,7 +1,9 @@
 /**
  * Draft / preview mode - let an editor see unpublished content by flipping a signed cookie that
  * loaders read (`ctx.draft`) and ISR bypasses (fresh render, never cached). The cookie is **HMAC-signed**
- * (so a visitor can't forge it) and **HttpOnly** (JS can't read it). You gate `enableDraft` yourself -
+ * (so a visitor can't forge it), **HttpOnly** (JS can't read it) and carries its own expiry, which the
+ * server checks (a copied cookie stops working when the browser would have dropped it). You gate
+ * `enableDraft` yourself -
  * behind an editor login or a `?token=` check - exactly like Next's `draftMode().enable()`.
  *
  *   // a route you've protected (e.g. checked ?token= against a secret):
@@ -26,9 +28,23 @@ import { assertTokenSecret, timingSafeEqual } from "./internal/timing-safe-equal
 /** The cookie name nifra uses for draft/preview mode. */
 export const DRAFT_COOKIE = "__nifra_draft"
 
-// The signed cookie's payload is a fixed marker - a *valid signature* (not the value) is the signal
-// that the server issued this via enableDraft(). Nothing secret is stored in it.
-const DRAFT_MARKER = "1"
+// The signed payload is `1:<expiry in Unix seconds>`. A valid signature says the server issued it; the
+// expiry bounds a replayed copy, which Max-Age alone cannot, since a client can resend any cookie it holds.
+const DRAFT_PREFIX = "1:"
+
+function draftPayload(options: EnableDraftOptions): string {
+  return `${DRAFT_PREFIX}${Math.floor(Date.now() / 1000) + draftMaxAge(options)}`
+}
+
+function draftMaxAge(options: EnableDraftOptions): number {
+  const seconds = options.maxAgeSeconds ?? 3600
+  if (!Number.isSafeInteger(seconds) || seconds <= 0) {
+    throw new RangeError(
+      `[nifra] draft maxAgeSeconds must be a positive whole number of seconds, got ${seconds}`,
+    )
+  }
+  return seconds
+}
 
 /** The response-cookie surface `enableDraft`/`disableDraft` need - nifra's `c.set`. Structural, so any
  * nifra handler context satisfies it without importing the full `Context`. */
@@ -38,7 +54,8 @@ export interface DraftCookieControls {
 }
 
 export interface EnableDraftOptions {
-  /** Cookie lifetime in **seconds** (default `3600` = 1h). Keep it short - draft is an editor session. */
+  /** Draft session lifetime in **seconds** (default `3600` = 1h): the cookie's `Max-Age`, and the expiry
+   * signed into the cookie that the server enforces. Keep it short - draft is an editor session. */
   readonly maxAgeSeconds?: number
   /** Cookie `Path` (default `"/"`). */
   readonly path?: string
@@ -57,8 +74,8 @@ export async function enableDraft(
   secret: string,
   options: EnableDraftOptions = {},
 ): Promise<void> {
-  const signed = await signValue(DRAFT_MARKER, secret)
-  c.set.cookie(DRAFT_COOKIE, signed, draftCookieOptions(options))
+  const cookieOptions = draftCookieOptions(options)
+  c.set.cookie(DRAFT_COOKIE, await signValue(draftPayload(options), secret), cookieOptions)
 }
 
 /**
@@ -77,7 +94,7 @@ function draftCookieOptions(options: EnableDraftOptions): CookieOptions {
     httpOnly: true,
     sameSite: "lax",
     path: options.path ?? "/",
-    maxAge: options.maxAgeSeconds ?? 3600,
+    maxAge: draftMaxAge(options),
     secure: options.secure ?? true,
   }
 }
@@ -91,14 +108,17 @@ export function disableDraft(
 }
 
 /**
- * Whether `request` carries a **valid** signed draft cookie (constant-time verify via `unsignValue`).
- * `createWebApp` uses it to set `ctx.draft`; `withISR` uses it to bypass the cache for editors. A
- * missing, forged, or tampered cookie returns `false`.
+ * Whether `request` carries a **valid**, unexpired signed draft cookie (constant-time verify via
+ * `unsignValue`). `createWebApp` uses it to set `ctx.draft`; `withISR` uses it to bypass the cache for
+ * editors. A missing, forged, tampered, or expired cookie returns `false`.
  */
 export async function isDraftEnabled(request: Request, secret: string): Promise<boolean> {
   const cookie = parseCookies(request.headers.get("cookie"))[DRAFT_COOKIE]
   if (cookie === undefined) return false
-  return (await unsignValue(cookie, secret)) !== null
+  const payload = await unsignValue(cookie, secret)
+  if (payload === null || !payload.startsWith(DRAFT_PREFIX)) return false
+  const expires = Number(payload.slice(DRAFT_PREFIX.length))
+  return Number.isSafeInteger(expires) && Date.now() / 1000 < expires
 }
 
 /**
@@ -173,7 +193,8 @@ export function previewEndpoint(
       `[nifra] previewEndpoint fallbackPath must be a site-relative path, got ${JSON.stringify(fallbackPath)}`,
     )
   }
-  const cookieOptions = draftCookieOptions(options.cookie ?? {})
+  const draftOptions = options.cookie ?? {}
+  const cookieOptions = draftCookieOptions(draftOptions)
   return async (request) => {
     const url = new URL(request.url)
     if (!timingSafeEqual(url.searchParams.get(tokenParam) ?? "", options.secret)) {
@@ -184,7 +205,7 @@ export function previewEndpoint(
     if (destination === null) {
       return Response.json({ ok: false, error: "invalid_redirect" }, { status: 400 })
     }
-    const signed = await signValue(DRAFT_MARKER, options.draftSecret)
+    const signed = await signValue(draftPayload(draftOptions), options.draftSecret)
     return new Response(null, {
       status: 302,
       headers: {

package/src/fonts-google.ts

@@ -113,6 +113,10 @@ const DEFAULT_MAX_FONT_BYTES = 5 * 1024 * 1024
 const MAX_CSS_BYTES = 512 * 1024
 const MAX_TEXT_LEN = 2048
 
+/** A face's weight as Google writes it: `400`, a variable `100 900`, or a keyword. It lands in the
+ * written file's name, so anything else (a tampered `400/../..`) is refused. */
+const FACE_WEIGHT = /^(?:\d{1,4}(?: \d{1,4})?|normal|bold)$/
+
 const VALID_DISPLAY: ReadonlySet<string> = new Set([
   "auto",
   "block",
@@ -420,6 +424,12 @@ export async function loadGoogleFont(
           "the stylesheet may be tampered with",
       )
     }
+    if (!FACE_WEIGHT.test(face.weight)) {
+      throw new Error(
+        `loadGoogleFont: refusing an unexpected font-weight ${JSON.stringify(face.weight.slice(0, 40))}; ` +
+          "the stylesheet may be tampered with",
+      )
+    }
     const bytes = await fetchBounded(fetchImpl, source.url, maxBytes)
     const hash = await contentHash(bytes)
     const style = face.style === "italic" ? "italic" : "normal"

package/src/index.ts

@@ -85,8 +85,8 @@ export {
   generateServerManifest,
 } from "./internal/codegen.ts"
 // Generated client entries intentionally import the browser router from the client subpath:
-// `import { createClientRouter, createMatcher, mergeHeads, resolveMeta } from "@nifrajs/web/client"`.
-export { mergeHeads, resolveMeta } from "./internal/head-merge.ts"
+// `import { createClientRouter, createMatcher, mergeHeads, resolveChainMeta } from "@nifrajs/web/client"`.
+export { mergeHeads, resolveChainMeta, resolveMeta } from "./internal/head-merge.ts"
 export {
   canonical,
   gone,
@@ -141,6 +141,7 @@ export {
   type ISROptions,
   type ISRPlatform,
   type ISRQuery,
+  type ISRStoreOp,
   isCacheablePage,
   KVCacheStore,
   type KVCacheStoreOptions,