npm - what-server - Versions diffs - 0.10.0 → 0.11.1 - Mend

what-server 0.10.0 → 0.11.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/README.md +148 -0
package/dist/actions.min.js +1 -2
package/dist/index.min.js +5 -6
package/dist/islands.min.js +0 -1
package/package.json +4 -4
package/src/action-handler.js +208 -21
package/src/adapter/cloudflare.js +1 -1
package/src/adapter/core.js +104 -11
package/src/adapter/vercel.js +74 -10
package/src/index.js +21 -2
package/src/revalidation-registry.js +2 -2
package/dist/actions.js +0 -384
package/dist/actions.js.map +0 -7
package/dist/actions.min.js.map +0 -7
package/dist/index.js +0 -1150
package/dist/index.js.map +0 -7
package/dist/index.min.js.map +0 -7
package/dist/islands.js +0 -355
package/dist/islands.js.map +0 -7
package/dist/islands.min.js.map +0 -7

package/src/action-handler.js CHANGED Viewed

@@ -32,6 +32,57 @@ function jsonResponse(status, bodyObj) {
   };
 }
+function htmlResponse(status, message) {
+  return {
+    status,
+    headers: { 'content-type': 'text/html; charset=utf-8' },
+    body: `<!DOCTYPE html><html><body><h1>${status}</h1><p>${String(message)
+      .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')}</p></body></html>`,
+  };
+}
+// Resolve a safe local redirect target for the form (POST/redirect/GET) path.
+// `_redirect` must be a same-origin local path ("/x"); protocol-relative
+// ("//evil"), backslash-smuggled ("/\evil", "/\\evil") and absolute
+// ("https://evil") targets are rejected. The Referer header (an absolute URL)
+// is reduced to its path + query. Falls back to '/'.
+//
+// Backslashes matter: browsers and `new URL()` treat "\" like "/", so
+// "/\evil.com" canonicalizes to http://evil.com (an open redirect). We reject
+// anything starting with two slash-or-backslash chars or containing a
+// backslash, then canonicalize via URL and require the localhost origin.
+function safeLocalPath(value) {
+  if (typeof value !== 'string' || !value.startsWith('/')) return null;
+  // Reject protocol-relative / backslash-smuggled targets up front.
+  if (/^[/\\]{2}/.test(value) || value.includes('\\')) return null;
+  try {
+    const u = new URL(value, 'http://localhost');
+    if (u.origin !== 'http://localhost') return null;
+    return u.pathname + u.search;
+  } catch {
+    return null;
+  }
+}
+function safeRedirectTarget(form, headers) {
+  const explicit = safeLocalPath(form && form._redirect);
+  if (explicit) return explicit;
+  const referer = headers.referer || headers.referrer;
+  if (referer) {
+    try {
+      const u = new URL(referer, 'http://localhost');
+      const path = safeLocalPath(u.pathname + u.search);
+      if (path) return path;
+    } catch { /* fall through */ }
+  }
+  return '/';
+}
+// Reserved form fields consumed by the framework (not passed to the action).
+// `what-csrf-token` is an alias for `_csrf` matching the <meta name="what-csrf-token">
+// tag SSR pages embed, so templates can reuse one name for both surfaces.
+const RESERVED_FORM_FIELDS = new Set(['_action', 'data-action', '_csrf', 'what-csrf-token', '_redirect']);
 /**
  * Framework-agnostic action dispatcher.
  *
@@ -41,7 +92,25 @@ function jsonResponse(status, bodyObj) {
  *   - basePath: string — defaults to '/__what_action' (used by the adapters).
  *
  * Returns: async (reqLike) -> { status, headers, body:string }
- *   reqLike: { method, headers, body }  where body is the parsed JSON ({ args }).
+ *   reqLike: { method, headers, body, query? }
+ *
+ * Two request shapes are accepted:
+ *
+ * 1. JSON + header (fetch clients — what the `action()` client wrapper sends):
+ *    POST with `X-What-Action: <id>` header, JSON body `{ args: [...] }`,
+ *    CSRF token in the `X-CSRF-Token` header. Responds with JSON.
+ *
+ * 2. Plain HTML form post (progressive enhancement — works without JS):
+ *    POST with `Content-Type: application/x-www-form-urlencoded` and NO
+ *    X-What-Action header. `body` is the parsed form fields object.
+ *    - action id:   `_action` (or `data-action`) hidden field, or `?action=`
+ *                   query param (reqLike.query.action)
+ *    - CSRF token:  `_csrf` (or `what-csrf-token`) hidden field; an
+ *                   `x-csrf-token` HEADER wins when both are present
+ *    - redirect:    `_redirect` hidden field (local path), else Referer, else '/'
+ *    The action receives ONE argument: the form fields object (reserved
+ *    fields stripped). Success responds 303 See Other (POST/redirect/GET);
+ *    failures respond with an HTML error page and the matching status.
  */
 export function createActionHandler(options = {}) {
   const { getCsrfToken, skipCsrf = false } = options;
@@ -53,21 +122,72 @@ export function createActionHandler(options = {}) {
     }
     const headers = lowerHeaders(reqLike.headers);
-    const actionId = headers['x-what-action'];
-    if (!actionId) {
+    const headerActionId = headers['x-what-action'];
+    const contentType = headers['content-type'] || '';
+    const isFormPost = !headerActionId && contentType.includes('application/x-www-form-urlencoded');
+    const sessionCsrfToken = skipCsrf
+      ? undefined
+      : (getCsrfToken ? await getCsrfToken(reqLike) : undefined);
+    // --- Plain HTML form post (progressive enhancement) ---
+    if (isFormPost) {
+      const form = reqLike.body || {};
+      const actionId = form._action || form['data-action'] || (reqLike.query && reqLike.query.action);
+      if (!actionId) {
+        return htmlResponse(400, 'Missing action name (add a hidden "_action" field or ?action= query param)');
+      }
+      // CSRF token travels in the `_csrf` (or `what-csrf-token`) form field
+      // for plain forms; map it to the header slot handleActionRequest
+      // validates against. The header wins when both are present.
+      const formHeaders = { ...headers };
+      const bodyToken = form._csrf ?? form['what-csrf-token'];
+      if (bodyToken && !formHeaders['x-csrf-token']) formHeaders['x-csrf-token'] = String(bodyToken);
+      if (!skipCsrf && getCsrfToken && !sessionCsrfToken) {
+        // CSRF is configured but this client has no token (e.g. no cookie yet).
+        return htmlResponse(403, 'Missing CSRF token');
+      }
+      const data = {};
+      for (const [k, v] of Object.entries(form)) {
+        if (!RESERVED_FORM_FIELDS.has(k)) data[k] = v;
+      }
+      const result = await handleActionRequest(
+        { headers: formHeaders },
+        actionId,
+        [data],
+        { csrfToken: sessionCsrfToken, skipCsrf }
+      );
+      if (result.status === 200) {
+        return {
+          status: 303,
+          headers: { location: safeRedirectTarget(form, headers) },
+          body: '',
+        };
+      }
+      return htmlResponse(result.status, (result.body && result.body.message) || 'Action failed');
+    }
+    // --- JSON + X-What-Action header (fetch clients) ---
+    if (!headerActionId) {
       return jsonResponse(400, { message: 'Missing X-What-Action header' });
     }
+    if (!skipCsrf && getCsrfToken && !sessionCsrfToken) {
+      // CSRF configured, but the client presented no session token (no cookie).
+      return jsonResponse(403, { message: 'Missing CSRF token' });
+    }
     const body = reqLike.body || {};
     const args = body.args;
-    const sessionCsrfToken = skipCsrf
-      ? undefined
-      : (getCsrfToken ? await getCsrfToken(reqLike) : undefined);
     const result = await handleActionRequest(
       { headers },
-      actionId,
+      headerActionId,
       args,
       { csrfToken: sessionCsrfToken, skipCsrf }
     );
@@ -84,27 +204,87 @@ export function nodeActionMiddleware(options = {}) {
   const handle = createActionHandler(options);
   return async function middleware(req, res, next) {
-    const url = (req.url || '').split('?')[0];
+    const [url, search] = (req.url || '').split('?');
     if (url !== basePath || (req.method || '').toUpperCase() !== 'POST') {
       return next ? next() : undefined;
     }
     let body;
     try {
-      body = await readJsonBody(req);
+      const raw = await readRawBody(req);
+      body = parseActionBody(raw, req.headers['content-type'] || '');
     } catch (err) {
       res.writeHead(err.code === 'BODY_TOO_LARGE' ? 413 : 400, { 'content-type': 'application/json' });
-      res.end(JSON.stringify({ message: err.code === 'BODY_TOO_LARGE' ? 'Payload too large' : 'Invalid JSON body' }));
+      res.end(JSON.stringify({ message: err.code === 'BODY_TOO_LARGE' ? 'Payload too large' : 'Invalid request body' }));
       return;
     }
-    const out = await handle({ method: req.method, headers: req.headers, body });
+    const query = Object.fromEntries(new URLSearchParams(search || ''));
+    const out = await handle({ method: req.method, headers: req.headers, body, query });
     res.writeHead(out.status, out.headers);
     res.end(out.body);
   };
 }
-function readJsonBody(req) {
+/** Parse an action request body by content type: form-urlencoded -> fields object, else JSON. */
+export function parseActionBody(raw, contentType) {
+  if ((contentType || '').includes('application/x-www-form-urlencoded')) {
+    const fields = {};
+    for (const [k, v] of new URLSearchParams(String(raw))) {
+      if (fields[k] === undefined) fields[k] = v;
+      else if (Array.isArray(fields[k])) fields[k].push(v);
+      else fields[k] = [fields[k], v];
+    }
+    return fields;
+  }
+  if (raw == null || raw === '') return {};
+  return JSON.parse(String(raw));
+}
+/**
+ * Read a Web Fetch `Request` body as text with the same MAX_BODY_BYTES cap the
+ * Node middleware enforces. Used by the adapter/edge entry points (Vercel /
+ * Cloudflare / Node-adapter) so all three share one DoS guard.
+ *
+ * Returns { raw } on success or { tooLarge: true } when the cap is exceeded —
+ * checked first via Content-Length, then enforced while streaming (chunked /
+ * spoofed Content-Length can't bypass it).
+ *
+ * @param {Request} request
+ * @param {number} [limit=MAX_BODY_BYTES]
+ */
+export async function readFetchBodyCapped(request, limit = MAX_BODY_BYTES) {
+  const declared = Number(request.headers.get('content-length'));
+  if (Number.isFinite(declared) && declared > limit) {
+    return { tooLarge: true };
+  }
+  const body = request.body;
+  // No stream available (or env without ReadableStream): fall back to text()
+  // but still re-check the resulting size against the cap.
+  if (!body || typeof body.getReader !== 'function') {
+    const raw = await request.text();
+    if (Buffer.byteLength(raw, 'utf8') > limit) return { tooLarge: true };
+    return { raw };
+  }
+  const reader = body.getReader();
+  const chunks = [];
+  let size = 0;
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    if (value) {
+      size += value.byteLength;
+      if (size > limit) {
+        try { await reader.cancel(); } catch { /* ignore */ }
+        return { tooLarge: true };
+      }
+      chunks.push(value);
+    }
+  }
+  return { raw: Buffer.concat(chunks.map((c) => Buffer.from(c))).toString('utf8') };
+}
+function readRawBody(req) {
   return new Promise((resolve, reject) => {
     let size = 0;
     const chunks = [];
@@ -120,12 +300,8 @@ function readJsonBody(req) {
       chunks.push(chunk);
     });
     req.on('end', () => {
-      if (chunks.length === 0) return resolve({});
-      try {
-        resolve(JSON.parse(Buffer.concat(chunks).toString('utf8')));
-      } catch (e) {
-        reject(e);
-      }
+      if (chunks.length === 0) return resolve('');
+      resolve(Buffer.concat(chunks).toString('utf8'));
     });
     req.on('error', reject);
   });
@@ -139,11 +315,22 @@ export function fetchActionHandler(options = {}) {
   return async function (request) {
     let body = {};
     try {
-      body = await request.json();
+      const read = await readFetchBodyCapped(request);
+      if (read.tooLarge) {
+        return new Response(JSON.stringify({ message: 'Payload too large' }), {
+          status: 413,
+          headers: { 'content-type': 'application/json' },
+        });
+      }
+      body = parseActionBody(read.raw, request.headers.get('content-type') || '');
     } catch {
       body = {};
     }
-    const out = await handle({ method: request.method, headers: request.headers, body });
+    let query = {};
+    try {
+      query = Object.fromEntries(new URL(request.url, 'http://localhost').searchParams);
+    } catch { /* no query */ }
+    const out = await handle({ method: request.method, headers: request.headers, body, query });
     return new Response(out.body, { status: out.status, headers: out.headers });
   };
 }

package/src/adapter/cloudflare.js CHANGED Viewed

@@ -1,6 +1,6 @@
 // Cloudflare Workers adapter — exposes a `fetch(request, env, ctx)` worker
 // entry over the same Web-Fetch core handler. ISR runs via the origin cache
-// engine; pass a what-cache redis/KV-backed store for cross-isolate caching and
+// engine; pass a what-isr redis/KV-backed store for cross-isolate caching and
 // use ctx.waitUntil for background regeneration.
 import { createRequestHandler } from './core.js';

package/src/adapter/core.js CHANGED Viewed

@@ -3,16 +3,18 @@
 //   match route -> intercept actions + revalidate webhook -> ISR cache
 //   (HIT/STALE/MISS) -> render -> respond with Cache-Control headers.
 //
-// The cache engine is OPTIONAL and injected (from what-cache) so what-server
+// The cache engine is OPTIONAL and injected (from what-isr) so what-server
 // stays standalone. Render is owned here (renderDocument) but overridable.
 import { matchRoute, parseQuery } from 'what-router/match';
 import { renderDocument } from '../index.js';
-import { createActionHandler } from '../action-handler.js';
+import { createActionHandler, parseActionBody, readFetchBodyCapped } from '../action-handler.js';
 import { setRevalidationHandler } from '../revalidation-registry.js';
+import { generateCsrfToken } from '../actions.js';
 const ACTION_PATH = '/__what_action';
 const REVALIDATE_PATH = '/__what_revalidate';
+const CSRF_COOKIE = 'what-csrf';
 function headersToObject(headers) {
   const out = {};
@@ -20,6 +22,23 @@ function headersToObject(headers) {
   return out;
 }
+function readCookie(cookieHeader, name) {
+  if (!cookieHeader) return null;
+  const match = String(cookieHeader).match(new RegExp(`(?:^|;\\s*)${name}=([^;]+)`));
+  return match ? decodeURIComponent(match[1]) : null;
+}
+// Read + parse the action body with the shared MAX_BODY_BYTES cap. Returns
+// { tooLarge: true } when over the limit so the caller can respond 413 (DoS
+// guard parity with the Node connect/express middleware).
+async function readActionBody(request) {
+  try {
+    const read = await readFetchBodyCapped(request);
+    if (read.tooLarge) return { tooLarge: true };
+    return parseActionBody(read.raw, request.headers.get('content-type') || '');
+  } catch { return {}; }
+}
 async function readJsonBody(request) {
   try { return await request.json(); } catch { return {}; }
 }
@@ -28,7 +47,10 @@ function defaultRenderRoute(documentOptions) {
   return async function renderRoute(routeMatch) {
     const { route, params, query, request } = routeMatch;
     const pageModule = { default: route.component, loader: route.loader };
-    const html = await renderDocument(pageModule, { params, query, request }, documentOptions);
+    const opts = routeMatch.csrfToken
+      ? { ...documentOptions, csrfToken: routeMatch.csrfToken }
+      : documentOptions;
+    const html = await renderDocument(pageModule, { params, query, request }, opts);
     return {
       html,
       status: 200,
@@ -38,18 +60,49 @@ function defaultRenderRoute(documentOptions) {
   };
 }
+/**
+ * Create the framework request handler: (Request) -> Response.
+ *
+ * CSRF is ON BY DEFAULT (double-submit cookie):
+ *   - Every HTML response ensures a `what-csrf` cookie (SameSite=Lax, NOT
+ *     HttpOnly so the fetch client can echo it in the X-CSRF-Token header).
+ *   - Uncached HTML renders also embed <meta name="what-csrf-token"> plus the
+ *     token for hidden form fields (cached/ISR pages rely on the cookie only,
+ *     so a per-user token is never baked into shared cache entries).
+ *   - POST /__what_action validates the client token (X-CSRF-Token header for
+ *     fetch clients, `_csrf` or `what-csrf-token` form field for plain HTML
+ *     forms — the header wins when both are present) against the cookie.
+ *
+ * Opt out with `csrf: false` (e.g. token-authed APIs behind another gateway),
+ * or take full control by passing your own `actionHandler` — a custom handler
+ * owns its CSRF policy and the cookie/meta auto-provisioning is skipped.
+ *
+ * Plain HTML form posts (progressive enhancement, no JS) are accepted on
+ * /__what_action as application/x-www-form-urlencoded — see createActionHandler
+ * in action-handler.js for the field contract (_action, _csrf/what-csrf-token,
+ * _redirect).
+ */
 export function createRequestHandler(options = {}) {
   const {
     routes = [],
     cache,
     render,
-    actionHandler = createActionHandler({ skipCsrf: true }),
     revalidateWebhook,
     document: documentOptions = {},
     notFound,
     basePath = '',
+    csrf = true,
   } = options;
+  // Auto-provisioning (cookie + meta tag) only applies to the built-in
+  // handler; a user-supplied actionHandler owns its own CSRF policy.
+  const autoCsrf = csrf !== false && !options.actionHandler;
+  const actionHandler = options.actionHandler || createActionHandler(
+    autoCsrf
+      ? { getCsrfToken: (reqLike) => readCookie(reqLike.headers && reqLike.headers.cookie, CSRF_COOKIE) }
+      : { skipCsrf: true }
+  );
   const renderRoute = render || defaultRenderRoute(documentOptions);
   // Bind the cache engine so server actions' revalidatePath/revalidateTag (and
@@ -66,13 +119,49 @@ export function createRequestHandler(options = {}) {
     let pathname = url.pathname;
     if (basePath && pathname.startsWith(basePath)) pathname = pathname.slice(basePath.length) || '/';
-    // Server actions
+    // Server actions (JSON fetch path AND plain form-post fallback)
     if (request.method === 'POST' && pathname === ACTION_PATH) {
-      const body = await readJsonBody(request);
-      const out = await actionHandler({ method: 'POST', headers: headersToObject(request.headers), body });
+      const body = await readActionBody(request);
+      if (body && body.tooLarge) {
+        return new Response(JSON.stringify({ message: 'Payload too large' }), {
+          status: 413,
+          headers: { 'content-type': 'application/json' },
+        });
+      }
+      const out = await actionHandler({
+        method: 'POST',
+        headers: headersToObject(request.headers),
+        body,
+        query: Object.fromEntries(url.searchParams),
+      });
       return new Response(out.body, { status: out.status, headers: out.headers });
     }
+    // CSRF provisioning for HTML responses (double-submit cookie). If the
+    // visitor has no token cookie yet, mint one and Set-Cookie it below.
+    let csrfToken = null;
+    let csrfSetCookie = null;
+    if (autoCsrf) {
+      csrfToken = readCookie(headersToObject(request.headers).cookie, CSRF_COOKIE);
+      if (!csrfToken) {
+        csrfToken = generateCsrfToken();
+        // NOT HttpOnly: the client action() wrapper reads it to send X-CSRF-Token.
+        // Secure when the request is HTTPS (direct or via a proxy's
+        // x-forwarded-proto) or in production; OFF for plain-http localhost dev
+        // so the cookie still sets and CSRF keeps working locally.
+        const reqHeaders = headersToObject(request.headers);
+        const isHttps = reqHeaders['x-forwarded-proto'] === 'https'
+          || url.protocol === 'https:'
+          || process.env.NODE_ENV === 'production';
+        csrfSetCookie = `${CSRF_COOKIE}=${encodeURIComponent(csrfToken)}; Path=/; SameSite=Lax`
+          + (isHttps ? '; Secure' : '');
+      }
+    }
+    const withCsrfCookie = (headers) => {
+      if (csrfSetCookie) headers['set-cookie'] = csrfSetCookie;
+      return headers;
+    };
     // On-demand revalidation webhook
     if (request.method === 'POST' && pathname === REVALIDATE_PATH && revalidateWebhook) {
       const body = await readJsonBody(request);
@@ -87,7 +176,7 @@ export function createRequestHandler(options = {}) {
     const matched = matchRoute(pathname, routes);
     if (!matched) {
       const html = notFound ? notFound() : '<!DOCTYPE html><html><body><h1>404 — Not Found</h1></body></html>';
-      return new Response(html, { status: 404, headers: { 'content-type': 'text/html; charset=utf-8' } });
+      return new Response(html, { status: 404, headers: withCsrfCookie({ 'content-type': 'text/html; charset=utf-8' }) });
     }
     const { route, params } = matched;
@@ -95,17 +184,21 @@ export function createRequestHandler(options = {}) {
     const routeMatch = { path: pathname, query: parseQuery(url.search), config, route, params, request };
     // ISR cache path (static/hybrid with a cache engine). Server-mode bypasses.
+    // NOTE: cached HTML is shared across users, so the per-user CSRF token is
+    // NOT embedded in the page here — clients read it from the cookie instead.
     if (cache && config.mode !== 'server') {
       const result = await cache.handle(routeMatch, () => renderRoute(routeMatch));
       return new Response(result.html, {
         status: result.status || 200,
-        headers: { 'content-type': 'text/html; charset=utf-8', ...(result.headers || {}) },
+        headers: withCsrfCookie({ 'content-type': 'text/html; charset=utf-8', ...(result.headers || {}) }),
       });
     }
-    // Direct render (server mode, or no cache configured)
+    // Direct render (server mode, or no cache configured): per-request HTML,
+    // safe to embed the CSRF token as a <meta> tag for forms/fetch clients.
+    if (csrfToken) routeMatch.csrfToken = csrfToken;
     const out = await renderRoute(routeMatch);
-    const headers = { 'content-type': 'text/html; charset=utf-8' };
+    const headers = withCsrfCookie({ 'content-type': 'text/html; charset=utf-8' });
     if (config.mode === 'server') headers['Cache-Control'] = 'private, no-store';
     return new Response(out.html, { status: out.status || 200, headers });
   };

package/src/adapter/vercel.js CHANGED Viewed

@@ -1,8 +1,8 @@
 // Vercel adapter. The runtime render function is the same Web-Fetch core
 // handler (deployable as a Vercel Function). ISR maps to Vercel's native
 // s-maxage/stale-while-revalidate headers emitted by the cache engine, so it
-// works on Vercel with no extra config. buildVercelOutput writes a minimal
-// Build Output API config pointing at the function.
+// works on Vercel with no extra config. buildVercelOutput writes a Build
+// Output API v3 directory (config.json + functions/<name>.func layout).
 import { createRequestHandler } from './core.js';
@@ -12,18 +12,82 @@ export function createVercelHandler(options = {}) {
 }
 /**
- * Write a minimal .vercel/output/config.json that routes all requests to a
- * single render function. The function file itself is emitted by the build step
- * (it imports createVercelHandler with the app's routes).
+ * Write a Build Output API v3 directory (https://vercel.com/docs/build-output-api/v3):
+ *
+ *   .vercel/output/
+ *     config.json                      { version: 3, routes: [...] }
+ *     static/**                        (optional) copied from `staticDir`
+ *     functions/<name>.func/
+ *       .vc-config.json                { runtime, handler, launcherType }
+ *       index.mjs (+ any `files`)      the bundled function entry
+ *
+ * Options:
+ *   - outDir        default '.vercel/output'
+ *   - functionName  default 'render'
+ *   - runtime       default 'nodejs22.x' (any Vercel Node runtime id)
+ *   - files         map of { 'relative/path.mjs': contents } written INTO the
+ *                   .func directory. Must include the handler entry (the app's
+ *                   build step bundles routes + createVercelHandler into it).
+ *   - handler       entry filename inside the .func dir, default 'index.mjs'
+ *   - staticDir     (optional) directory copied to static/ — served by Vercel's
+ *                   CDN before the function ever runs.
+ *
+ * Backward compatible: called with no `files`, it writes config.json only and
+ * the app's build step is responsible for emitting the functions/ directory.
+ *
+ * The function entry must export a Web-Fetch handler, e.g.:
+ *   // index.mjs (bundled with routes + what-server)
+ *   import { createVercelHandler } from 'what-server';
+ *   export default createVercelHandler({ routes });
  */
-export async function buildVercelOutput({ outDir = '.vercel/output', functionName = 'render' } = {}) {
-  const { mkdir, writeFile } = await import('node:fs/promises');
-  const { join } = await import('node:path');
+export async function buildVercelOutput({
+  outDir = '.vercel/output',
+  functionName = 'render',
+  runtime = 'nodejs22.x',
+  files = null,
+  handler = 'index.mjs',
+  staticDir = null,
+} = {}) {
+  const { mkdir, writeFile, cp } = await import('node:fs/promises');
+  const { join, dirname } = await import('node:path');
   await mkdir(outDir, { recursive: true });
   const config = {
     version: 3,
-    routes: [{ src: '/.*', dest: `/${functionName}` }],
+    routes: [
+      // CDN-served static assets win before the render function runs.
+      { handle: 'filesystem' },
+      { src: '/.*', dest: `/${functionName}` },
+    ],
   };
   await writeFile(join(outDir, 'config.json'), JSON.stringify(config, null, 2));
-  return { config, outDir };
+  if (staticDir) {
+    await cp(staticDir, join(outDir, 'static'), { recursive: true });
+  }
+  let functionDir = null;
+  if (files && typeof files === 'object') {
+    functionDir = join(outDir, 'functions', `${functionName}.func`);
+    await mkdir(functionDir, { recursive: true });
+    const vcConfig = {
+      runtime,
+      handler,
+      launcherType: 'Nodejs',
+      shouldAddHelpers: false,
+      supportsResponseStreaming: true,
+    };
+    await writeFile(join(functionDir, '.vc-config.json'), JSON.stringify(vcConfig, null, 2));
+    for (const [rel, contents] of Object.entries(files)) {
+      const dest = join(functionDir, rel);
+      await mkdir(dirname(dest), { recursive: true });
+      await writeFile(dest, contents);
+    }
+    if (!(handler in files)) {
+      // eslint-disable-next-line no-console
+      console.warn(`[what-server] buildVercelOutput: files does not include the handler entry "${handler}" — the deploy will 500 until your build emits it.`);
+    }
+  }
+  return { config, outDir, functionDir };
 }

package/src/index.js CHANGED Viewed

@@ -5,6 +5,7 @@
 import { h, runWithServerContext, beginHeadCollection, endHeadCollection } from 'what-core';
 import { serializeState } from './serialize.js';
 import { getIslandStoresSnapshot } from './islands.js';
+import { csrfMetaTag } from './actions.js';
 // Build a fresh render-scoped server context (head sink, loader data, resources).
 function createRenderContext(loaderData) {
@@ -253,7 +254,11 @@ function wrapHtmlDocument({ body, head, payload, options = {} }) {
   const clientScript = options.clientEntry
     ? `<script type="module" src="${escapeHtml(options.clientEntry)}"></script>`
     : '';
-  const extraHead = options.head || '';
+  // CSRF auto-provisioning: when the caller (e.g. the deploy adapter with
+  // default-on CSRF) passes the per-request token, embed it as the meta tag
+  // the client action() wrapper and plain <form> posts read it from.
+  const csrfHead = options.csrfToken ? csrfMetaTag(options.csrfToken) : '';
+  const extraHead = csrfHead + (options.head || '');
   const bodyClass = options.bodyClass ? ` class="${escapeHtml(options.bodyClass)}"` : '';
   return (
     `<!DOCTYPE html><html lang="${escapeHtml(lang)}"><head>` +
@@ -476,12 +481,26 @@ function _resolveInnerHTML(props) {
   return null;
 }
+// Attribute NAMES are emitted verbatim into the HTML, so they must be
+// validated (values are escaped, names cannot be). Anything outside this
+// pattern (spaces, quotes, equals, ...) could otherwise inject attributes:
+//   h('div', { 'x" onload="alert(1)': '' })  ->  <div x" onload="alert(1)>
+// Allows letters, digits, '_', ':', '.', '-' — covers data-*, aria-*,
+// xlink:href, SVG names like stroke-width, and namespaced attributes.
+const SAFE_ATTR_NAME = /^[a-zA-Z_:][a-zA-Z0-9:._-]*$/;
 function renderAttrs(props) {
   let out = '';
   for (const [key, val] of Object.entries(props)) {
     if (key === 'key' || key === 'ref' || key === 'children' || key === 'dangerouslySetInnerHTML' || key === 'innerHTML') continue;
     if (key.startsWith('on') && key.length > 2) continue; // Skip event handlers in SSR
     if (val === false || val == null) continue;
+    if (!SAFE_ATTR_NAME.test(key)) {
+      if (_isDevMode) {
+        console.warn(`[what-server] Skipping invalid attribute name in SSR: ${JSON.stringify(key)}`);
+      }
+      continue;
+    }
     if (key === 'className' || key === 'class') {
       out += ` class="${escapeHtml(String(val))}"`;
@@ -562,7 +581,7 @@ export {
 } from './action-handler.js';
 // Revalidation registry — app code calls revalidatePath/revalidateTag; the
-// deploy adapter binds a what-cache engine via setRevalidationHandler.
+// deploy adapter binds a what-isr engine via setRevalidationHandler.
 export {
   revalidatePath,
   revalidateTag,

package/src/revalidation-registry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 // Revalidation registry — the indirection that lets app code call
 // revalidatePath()/revalidateTag() from `what-framework/server` while the actual
-// cache engine lives in the optional `what-cache` package. The deploy adapter
+// cache engine lives in the optional `what-isr` package. The deploy adapter
 // binds the engine at startup via setRevalidationHandler(); until then these are
 // safe no-ops (with a dev hint).
@@ -22,7 +22,7 @@ export async function revalidatePath(path, options) {
   if (isDev) {
     console.warn(
       `[what] revalidatePath('${path}') had no effect: no cache engine is bound. ` +
-      'Create a what-cache engine and bind it in your adapter (setRevalidationHandler).'
+      'Create a what-isr engine and bind it in your adapter (setRevalidationHandler).'
     );
   }
 }