alabjs 0.2.6 → 0.4.0

package/src/server/app.ts

@@ -1,7 +1,7 @@
 import { createApp as createH3App, createRouter, defineEventHandler, getQuery, readBody } from "h3";
 import { createServer } from "node:http";
 import { resolve, dirname, join, extname } from "node:path";
-import { existsSync, createReadStream, statSync, readFileSync } from "node:fs";
+import { existsSync, createReadStream, statSync, readFileSync, readdirSync } from "node:fs";
 import { createGzip, createBrotliCompress } from "node:zlib";
 import { toNodeListener } from "h3";
 import type { RouteManifest } from "../router/manifest.js";
@@ -18,21 +18,93 @@ import { getPPRShell, injectBuildIdIntoPPRShell, PPR_CACHE_SUBDIR } from "../ssr
 import { handleVitalsBeacon, handleAnalyticsDashboard } from "../analytics/handler.js";
 import { buildImportMap } from "../config.js";
 import type { FederationConfig } from "../config.js";
+import { registerLiveComponent } from "../live/registry.js";
+import { renderLiveFragment, hashFragment } from "../live/renderer.js";
+import { subscribeToTag } from "../live/broadcaster.js";
+
+/** Walk dist/server recursively and collect all *.server.js paths (compiled server functions). */
+function findDistServerFiles(distDir: string): string[] {
+  const serverDir = join(distDir, "server");
+  const results: string[] = [];
+  function walk(dir: string) {
+    try {
+      for (const entry of readdirSync(dir, { withFileTypes: true })) {
+        const fullPath = join(dir, entry.name);
+        if (entry.isDirectory()) {
+          walk(fullPath);
+        } else if (entry.isFile() && entry.name.endsWith(".server.js")) {
+          results.push(fullPath);
+        }
+      }
+    } catch { /* not readable */ }
+  }
+  walk(serverDir);
+  return results;
+}
+
+/** Walk dist/server recursively and register all *.live.js modules. */
+async function registerAllLiveComponents(distDir: string): Promise<void> {
+  const serverDir = join(distDir, "server");
+  const files: string[] = [];
+
+  function walk(dir: string) {
+    try {
+      for (const entry of readdirSync(dir, { withFileTypes: true })) {
+        const fullPath = join(dir, entry.name);
+        if (entry.isDirectory()) {
+          walk(fullPath);
+        } else if (entry.isFile() && entry.name.endsWith(".live.js")) {
+          files.push(fullPath);
+        }
+      }
+    } catch { /* not readable */ }
+  }
+  walk(serverDir);
+
+  for (const filePath of files) {
+    try {
+      const mod = await import(filePath) as {
+        liveId?: string;
+        liveInterval?: number;
+        liveTags?: (props: unknown) => string[];
+      };
+      // liveId is stamped by the Vite plugin (hash of source path).
+      // Fall back to a hash of the file path itself.
+      const id = mod.liveId ?? filePath.replace(/[^a-z0-9]/gi, "").slice(-16);
+      registerLiveComponent({
+        id,
+        modulePath: filePath,
+        ...(typeof mod.liveInterval === "number" ? { liveInterval: mod.liveInterval } : {}),
+        ...(typeof mod.liveTags === "function" ? { liveTags: mod.liveTags } : {}),
+      });
+    } catch (err) {
+      console.warn(`[alabjs] live: failed to register ${filePath}:`, err);
+    }
+  }
+}
 
 /**
  * Find layout file paths (relative to cwd root) for a given route.file, ordered outermost→innermost.
  * Checks the compiled dist directory for the existence of each layout.
  */
+/** Convert a TypeScript source path to its compiled .js equivalent. */
+function toJsPath(p: string): string {
+  return p.replace(/\.(tsx?)$/, ".js");
+}
+
 function findProdLayoutFiles(routeFile: string, distDir: string): string[] {
   // routeFile is like "app/users/[id]/page.tsx"
+  // Returns source paths (e.g. "app/layout.tsx") so the client bootstrap can look
+  // them up in LAYOUT_MODS by their original source key.  The import() call in
+  // app.ts uses toJsPath() to convert back to the compiled .js path.
   const pageDir = dirname(routeFile);
   const parts = pageDir.split("/");
   const layouts: string[] = [];
   for (let i = 1; i <= parts.length; i++) {
     const dir = parts.slice(0, i).join("/");
-    const layoutRelPath = `${dir}/layout.tsx`;
-    if (existsSync(join(distDir, "server", layoutRelPath))) {
-      layouts.push(layoutRelPath);
+    const compiledPath = `${dir}/layout.js`;
+    if (existsSync(join(distDir, "server", compiledPath))) {
+      layouts.push(`${dir}/layout.tsx`);
     }
   }
   return layouts;
@@ -44,7 +116,7 @@ function findProdLayoutFiles(routeFile: string, distDir: string): string[] {
 function findProdErrorFile(routeFile: string, distDir: string): string | null {
   let dir = dirname(routeFile);
   while (dir.length > 0 && dir !== ".") {
-    const candidate = `${dir}/error.tsx`;
+    const candidate = `${dir}/error.js`;
     if (existsSync(join(distDir, "server", candidate))) return candidate;
     const parent = dirname(dir);
     if (parent === dir) break;
@@ -56,8 +128,8 @@ function findProdErrorFile(routeFile: string, distDir: string): string | null {
 function findProdLoadingFile(routeFile: string, distDir: string): string | null {
   let dir = dirname(routeFile);
   while (dir.length > 0 && dir !== ".") {
-    const candidate = `${dir}/loading.tsx`;
-    if (existsSync(join(distDir, "server", candidate))) return candidate;
+    const compiled = `${dir}/loading.js`;
+    if (existsSync(join(distDir, "server", compiled))) return `${dir}/loading.tsx`;
     const parent = dirname(dir);
     if (parent === dir) break;
     dir = parent;
@@ -89,6 +161,21 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
     buildId = readFileSync(resolve(distDir, "BUILD_ID"), "utf8").trim() || undefined;
   } catch { /* no BUILD_ID file — skew protection disabled */ }
 
+  // Resolve the compiled client entry file path by reading the Vite manifest.
+  // /@alabjs/client is a virtual module at build time; at runtime the server
+  // must redirect requests for it to the hashed asset file.
+  // The manifest key is a relative path ending in "@alabjs/client" (not "/@alabjs/client").
+  let clientEntryPath = "";
+  try {
+    const viteManifest = JSON.parse(
+      readFileSync(resolve(distDir, "client/.vite/manifest.json"), "utf8"),
+    ) as Record<string, { file?: string; isEntry?: boolean; src?: string }>;
+    const entry = Object.values(viteManifest).find(
+      (e) => e.isEntry && e.src?.endsWith("@alabjs/client"),
+    );
+    if (entry?.file) clientEntryPath = "/" + entry.file;
+  } catch { /* manifest absent — /@alabjs/client will 404 */ }
+
   // Load federation config written by `alab build`. Used to:
   //  1. Serve `/_alabjs/federation-manifest.json` (remote discovery)
   //  2. Inject `<script type="importmap">` into every page (host → remote routing)
@@ -103,6 +190,11 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
   // Absolute path to the PPR shell cache directory.
   const pprCacheDir = resolve(distDir, "../../", PPR_CACHE_SUBDIR);
 
+  // Register live components at startup (non-blocking — failures are warned, not thrown).
+  registerAllLiveComponents(distDir).catch((err) => {
+    console.warn("[alabjs] live: component registration failed:", err);
+  });
+
   // ─── Global middleware ───────────────────────────────────────────────────────
   app.use(
     defineEventHandler((event) => {
@@ -112,6 +204,40 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
       res.setHeader("referrer-policy", "strict-origin-when-cross-origin");
       res.setHeader("permissions-policy", "camera=(), microphone=(), geolocation=()");
       res.setHeader("x-permitted-cross-domain-policies", "none");
+      // NOTE: 'unsafe-inline' is required by React's inline event delegation and
+      // Tailwind's runtime style injection. 'unsafe-eval' is required by some
+      // React dev-mode internals and dynamic import().
+      //
+      // ⚠️  Security implication: these directives weaken XSS protection.
+      // In production, override this header in your middleware with a nonce-based
+      // CSP: `script-src 'self' 'nonce-<random>'` and inject the same nonce into
+      // every <script> tag via renderToResponse's headExtra option. The CSRF
+      // double-submit pattern relies on XSS prevention — using 'unsafe-inline'
+      // without a nonce makes the CSRF token readable by injected scripts.
+      //
+      // NOTE: 'upgrade-insecure-requests' is intentionally omitted from the
+      // default CSP. That directive tells browsers to silently rewrite http://
+      // sub-resource URLs to https://, which breaks any app served over plain
+      // HTTP (local dev, internal tooling, HTTP-only staging servers) because
+      // the browser will refuse to load scripts and stylesheets redirected from
+      // the virtual /@alabjs/client path.
+      //
+      // Add it in your own middleware when you are certain every environment
+      // runs behind HTTPS:
+      //
+      //   // middleware.ts
+      //   export async function middleware(req: Request) {
+      //     const isHttps = req.headers.get("x-forwarded-proto") === "https"
+      //                  || new URL(req.url).protocol === "https:";
+      //     if (isHttps) {
+      //       // Append the directive to whatever CSP the framework already set.
+      //       const existing = res.headers.get("content-security-policy") ?? "";
+      //       res.headers.set(
+      //         "content-security-policy",
+      //         existing + "; upgrade-insecure-requests",
+      //       );
+      //     }
+      //   }
       res.setHeader(
         "content-security-policy",
         [
@@ -126,7 +252,6 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
           "base-uri 'self'",
           "form-action 'self'",
           "frame-ancestors 'self'",
-          "upgrade-insecure-requests",
         ].join("; "),
       );
       // HSTS — only meaningful over HTTPS; set in production only.
@@ -134,12 +259,18 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
     }),
   );
 
-  // ─── User middleware (middleware.ts compiled to dist/server/middleware.ts) ───
-  const middlewareModulePath = `${distDir}/server/middleware.ts`;
+  // ─── User middleware (middleware.ts compiled to dist/server/middleware.js) ───
+  const middlewareModulePath = `${distDir}/server/middleware.js`;
   if (existsSync(middlewareModulePath)) {
+    // Cache the module after first import — avoids redundant dynamic import()
+    // overhead on every request (each import() call re-resolves the module graph).
+    let _middlewareCache: MiddlewareModule | null = null;
     app.use(
       defineEventHandler(async (event) => {
-        const mod = await import(middlewareModulePath) as MiddlewareModule;
+        if (!_middlewareCache) {
+          _middlewareCache = await import(middlewareModulePath) as MiddlewareModule;
+        }
+        const mod = _middlewareCache;
         if (typeof mod.middleware !== "function") return;
         const req = event.node.req;
         const res = event.node.res;
@@ -193,7 +324,7 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
   };
 
   app.use(
-    defineEventHandler((event) => {
+    defineEventHandler(async (event) => {
       const req = event.node.req;
       const res = event.node.res;
       if (req.method !== "GET" && req.method !== "HEAD") return;
@@ -204,22 +335,42 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
       try { relPath = decodeURIComponent(rawPath); } catch { return; }
       if (relPath.includes("..")) return;
 
-      const ext = extname(relPath).toLowerCase();
-      const contentType = MIME_TYPES[ext];
-      if (!contentType) return; // skip extensionless paths (page routes)
-
       const acceptEncoding = (req.headers["accept-encoding"] ?? "") as string;
       const useBrotli = acceptEncoding.includes("br");
       const useGzip  = !useBrotli && acceptEncoding.includes("gzip");
 
-      /** Stream a file with optional brotli/gzip compression and ETag 304 support. */
+      // Virtual client entry — redirect to the hashed asset file resolved at startup.
+      // A 302 redirect (not direct serve) is critical: relative imports in the bundle
+      // (e.g. "./components-HASH.js") must resolve against the real asset URL
+      // (/assets/client-HASH.js), not the virtual path (/@alabjs/client).
+      if (relPath === "/@alabjs/client") {
+        if (clientEntryPath) {
+          res.writeHead(302, { Location: clientEntryPath });
+        } else {
+          res.statusCode = 404;
+        }
+        res.end();
+        return;
+      }
+
+      const ext = extname(relPath).toLowerCase();
+      const contentType = MIME_TYPES[ext];
+      if (!contentType) return; // skip extensionless paths (page routes)
+
+      /** Stream a file with optional brotli/gzip compression and ETag 304 support.
+       *
+       * Returns a Promise that resolves when the response is fully sent. The
+       * h3 handler awaits this promise so h3 knows the response is complete
+       * before considering the next middleware. This avoids h3 passing the
+       * request to the router (which would 404) while the async pipe is running.
+       */
       function serveFile(
         filePath: string,
         fileSize: number,
         mtimeMs: number,
         cacheControl: string,
         mime: string,
-      ): null {
+      ): Promise<void> {
         // ETag from file size + mtime — both already known from the caller's stat().
         const etag = `"${fileSize.toString(36)}-${mtimeMs.toString(36)}"`;
         res.setHeader("etag", etag);
@@ -228,26 +379,29 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
         if (req.headers["if-none-match"] === etag) {
           res.statusCode = 304;
           res.end();
-          return null;
+          return Promise.resolve();
         }
 
         res.setHeader("content-type", mime);
         res.setHeader("cache-control", cacheControl);
 
-        if (req.method === "HEAD") { res.end(); return null; }
-
-        const stream = createReadStream(filePath);
-        if (useBrotli) {
-          res.setHeader("content-encoding", "br");
-          stream.pipe(createBrotliCompress()).pipe(res);
-        } else if (useGzip) {
-          res.setHeader("content-encoding", "gzip");
-          stream.pipe(createGzip()).pipe(res);
-        } else {
-          res.setHeader("content-length", fileSize);
-          stream.pipe(res);
-        }
-        return null;
+        if (req.method === "HEAD") { res.end(); return Promise.resolve(); }
+
+        return new Promise<void>((resolve, reject) => {
+          const fileStream = createReadStream(filePath);
+          res.on("finish", resolve);
+          res.on("error", reject);
+          if (useBrotli) {
+            res.setHeader("content-encoding", "br");
+            fileStream.pipe(createBrotliCompress()).pipe(res);
+          } else if (useGzip) {
+            res.setHeader("content-encoding", "gzip");
+            fileStream.pipe(createGzip()).pipe(res);
+          } else {
+            res.setHeader("content-length", fileSize);
+            fileStream.pipe(res);
+          }
+        });
       }
 
       // 1. Built client assets (JS chunks, CSS, source maps)
@@ -256,13 +410,14 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
         const stat = statSync(clientCandidate);
         if (stat.isFile()) {
           const isHashed = /\.[a-f0-9]{8,}\.[a-z]+$/.test(relPath);
-          return serveFile(
+          await serveFile(
             clientCandidate,
             stat.size,
             stat.mtimeMs,
             isHashed ? "public, max-age=31536000, immutable" : "public, max-age=3600",
             contentType,
           );
+          return;
         }
       }
 
@@ -271,10 +426,10 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
       if (existsSync(publicCandidate)) {
         const stat = statSync(publicCandidate);
         if (stat.isFile()) {
-          return serveFile(publicCandidate, stat.size, stat.mtimeMs, "public, max-age=3600", contentType);
+          await serveFile(publicCandidate, stat.size, stat.mtimeMs, "public, max-age=3600", contentType);
+          return;
         }
       }
-      return undefined;
     }),
   );
 
@@ -346,6 +501,173 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
     }),
   );
 
+  // ─── Live component SSE endpoint ────────────────────────────────────────────
+  // GET /_alabjs/live/:id?props=<base64-json>
+  //
+  // Opens a persistent SSE stream for a live component. On connect:
+  //   1. Renders the component immediately and sends the first fragment.
+  //   2. Sets up an interval (if liveInterval is set) to re-render and push.
+  //   3. Subscribes to tag broadcasts (if liveTags is set).
+  //   4. On client disconnect: clears interval + unsubscribes tags.
+  router.get(
+    "/_alabjs/live/:id",
+    defineEventHandler(async (event) => {
+      const req = event.node.req;
+      const res = event.node.res;
+
+      const id = (event.context.params?.["id"] ?? "") as string;
+      const { getLiveComponent } = await import("../live/registry.js");
+      const entry = getLiveComponent(id);
+
+      if (!entry) {
+        res.statusCode = 404;
+        res.setHeader("content-type", "application/json");
+        res.end(JSON.stringify({ error: `[alabjs] live component not found: ${id}` }));
+        return;
+      }
+
+      // Parse props from base64-encoded JSON query param.
+      let props: unknown = {};
+      try {
+        const url = new URL(req.url ?? "/", `http://${req.headers.host ?? "localhost"}`);
+        const raw = url.searchParams.get("props");
+        if (raw) props = JSON.parse(Buffer.from(raw, "base64").toString("utf8"));
+      } catch { /* malformed props — use empty object */ }
+
+      // SSE headers.
+      res.statusCode = 200;
+      res.setHeader("content-type", "text/event-stream; charset=utf-8");
+      res.setHeader("cache-control", "no-cache, no-transform");
+      res.setHeader("connection", "keep-alive");
+      res.setHeader("x-accel-buffering", "no"); // disable nginx buffering
+
+      let lastHash = "";
+      let closed = false;
+
+      async function pushFragment(): Promise<void> {
+        if (closed) return;
+        try {
+          const html = await renderLiveFragment(entry!.modulePath, props);
+          const hash = hashFragment(html);
+          if (hash === lastHash) return; // no-op — output unchanged
+          lastHash = hash;
+          res.write(`data: ${html}\n\n`);
+        } catch (err) {
+          console.error(`[alabjs] live render error (${id}):`, err);
+        }
+      }
+
+      // Send initial fragment immediately.
+      await pushFragment();
+
+      // Interval-based polling.
+      let intervalHandle: ReturnType<typeof setInterval> | null = null;
+      if (entry.liveInterval && entry.liveInterval > 0) {
+        intervalHandle = setInterval(() => { void pushFragment(); }, entry.liveInterval);
+      }
+
+      // Tag-based subscriptions.
+      const unsubFns: Array<() => void> = [];
+      if (entry.liveTags) {
+        const tags = entry.liveTags(props);
+        for (const tag of tags) {
+          unsubFns.push(subscribeToTag(tag, () => { void pushFragment(); }));
+        }
+      }
+
+      // Cleanup on disconnect.
+      req.on("close", () => {
+        closed = true;
+        if (intervalHandle) clearInterval(intervalHandle);
+        for (const unsub of unsubFns) unsub();
+      });
+
+      // Return null so h3 does not try to end the response — SSE keeps it open.
+      return null;
+    }),
+  );
+
+  // ─── Server function endpoints ──────────────────────────────────────────────
+  // GET  /_alabjs/data/:fn  — used by useServerData (query params as input)
+  // POST /_alabjs/fn/:fn    — used by useMutation (JSON body as input)
+  //
+  // Both scan all *.server.js files in dist/server for the named export.
+  // Module results are NOT cached — the module cache is Node's own require cache.
+
+  async function callServerFn(
+    fnName: string,
+    ctx: { params: Record<string, string>; query: Record<string, string>; headers: Record<string, string | string[] | undefined>; method: string; url: string },
+    input: unknown,
+    res: import("node:http").ServerResponse,
+  ): Promise<void> {
+    const serverFiles = findDistServerFiles(distDir);
+    for (const file of serverFiles) {
+      const mod = await import(file) as Record<string, unknown>;
+      if (typeof mod[fnName] === "function") {
+        try {
+          const result = await (mod[fnName] as (c: unknown, i: unknown) => Promise<unknown>)(ctx, input);
+          res.statusCode = 200;
+          res.setHeader("content-type", "application/json");
+          res.end(JSON.stringify(result));
+        } catch (err) {
+          const zodError = (err as Record<string, unknown>)?.["zodError"];
+          if (zodError) {
+            res.statusCode = 422;
+            res.setHeader("content-type", "application/json");
+            res.end(JSON.stringify({ zodError }));
+          } else {
+            const msg = err instanceof Error ? err.message : String(err);
+            console.error(`[alabjs] server fn "${fnName}" threw:`, err);
+            res.statusCode = 500;
+            res.setHeader("content-type", "application/json");
+            res.end(JSON.stringify({ error: msg }));
+          }
+        }
+        return;
+      }
+    }
+    res.statusCode = 404;
+    res.setHeader("content-type", "application/json");
+    res.end(JSON.stringify({ error: `[alabjs] server function not found: ${fnName}` }));
+  }
+
+  router.get(
+    "/_alabjs/data/:fn",
+    defineEventHandler(async (event) => {
+      const fnName = event.context.params?.["fn"] ?? "";
+      const req = event.node.req;
+      const url = new URL(req.url ?? "/", `http://${req.headers.host ?? "localhost"}`);
+      const query = Object.fromEntries(url.searchParams.entries());
+      const ctx = {
+        params: query,
+        query,
+        headers: req.headers as Record<string, string>,
+        method: "GET",
+        url: req.url ?? "/",
+      };
+      await callServerFn(fnName, ctx, Object.keys(query).length ? query : undefined, event.node.res);
+    }),
+  );
+
+  router.post(
+    "/_alabjs/fn/:fn",
+    defineEventHandler(async (event) => {
+      const fnName = event.context.params?.["fn"] ?? "";
+      const req = event.node.req;
+      const url = new URL(req.url ?? "/", `http://${req.headers.host ?? "localhost"}`);
+      const query = Object.fromEntries(url.searchParams.entries());
+      const body = await readBody(event);
+      const ctx = {
+        params: query,
+        query,
+        headers: req.headers as Record<string, string>,
+        method: "POST",
+        url: req.url ?? "/",
+      };
+      await callServerFn(fnName, ctx, body, event.node.res);
+    }),
+  );
+
   // Auto sitemap.xml from route manifest
   router.get(
     "/sitemap.xml",
@@ -365,7 +687,7 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
     if (route.kind !== "api") continue;
 
     const h3ApiPath = route.path.replace(/\[([^\]]+)\]/g, ":$1");
-    const apiModulePath = `${distDir}/server/${route.file}`;
+    const apiModulePath = `${distDir}/server/${toJsPath(route.file)}`;
 
     for (const method of ["get", "post", "put", "patch", "delete", "head"] as const) {
       router[method](
@@ -454,11 +776,11 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
         }
 
         // Dynamically import the compiled page module from the dist directory.
-        const pageModulePath = `${distDir}/server/${route.file}`;
+        const pageModulePath = `${distDir}/server/${toJsPath(route.file)}`;
         const mod = await import(pageModulePath) as {
           default?: unknown;
           metadata?: PageMetadata;
-          generateMetadata?: (params: Record<string, string>) => PageMetadata | Promise<PageMetadata>;
+          generateMetadata?: (props: { params: Record<string, string>; searchParams: Record<string, string> }) => PageMetadata | Promise<PageMetadata>;
           ssr?: boolean;
           cdnCache?: CdnCache;
           ppr?: boolean;
@@ -499,7 +821,7 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
         // Support both static metadata and dynamic generateMetadata (production fix)
         const metadata: PageMetadata =
           typeof mod.generateMetadata === "function"
-            ? await mod.generateMetadata(params)
+            ? await mod.generateMetadata({ params, searchParams })
             : (mod.metadata ?? {});
 
         const ssrEnabled = mod.ssr === true;
@@ -507,7 +829,7 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
         // ── Layouts ──────────────────────────────────────────────────────────
         const layoutRelPaths = findProdLayoutFiles(route.file, distDir);
         const layoutMods = await Promise.all(
-          layoutRelPaths.map((p) => import(`${distDir}/server/${p}`)),
+          layoutRelPaths.map((p) => import(`${distDir}/server/${toJsPath(p)}`)),
         );
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const layouts = layoutMods.map((m: any) => m.default).filter((c: unknown): c is any => typeof c === "function");
@@ -550,7 +872,7 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
           if (errorRelPath) {
             try {
               // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              const errorMod = await import(`${distDir}/server/${errorRelPath}`) as any;
+              const errorMod = await import(`${distDir}/server/${toJsPath(errorRelPath)}`) as any;
               const ErrorPage = errorMod.default;
               if (typeof ErrorPage === "function") {
                 renderToResponse(res, {
@@ -582,7 +904,7 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
   app.use(router);
 
   // ─── 404 / not-found fallback ────────────────────────────────────────────────
-  const notFoundPath = `${distDir}/server/app/not-found.tsx`;
+  const notFoundPath = `${distDir}/server/app/not-found.js`;
   app.use(
     defineEventHandler(async (event) => {
       const res = event.node.res;
@@ -618,8 +940,11 @@ export function createApp(manifest: RouteManifest, distDir: string): AlabApp {
 
   return {
     listen(port = 3000) {
+      // Make the server's base URL available to useServerData during SSR so it
+      // can construct an absolute URL for its internal loop-back fetch.
+      process.env["ALAB_ORIGIN"] = `http://127.0.0.1:${port}`;
       const server = createServer(toNodeListener(app));
-      server.listen(port, () => {
+      server.listen(port, "0.0.0.0", () => {
         console.log(`  alab  ready at http://localhost:${port}`);
       });
     },

package/src/server/cache.ts

@@ -28,7 +28,18 @@ interface CacheEntry {
 /** Sentinel value returned when a cache key has no valid entry. */
 const CACHE_MISS: unique symbol = Symbol("alab:cache_miss");
 
-/** Global in-process LRU-style cache. Shared across all server function calls. */
+/**
+ * Global in-process LRU cache. Shared across all server function calls.
+ *
+ * Max size is capped to prevent unbounded memory growth in long-running servers.
+ * When the cap is reached, the oldest entry (by insertion order) is evicted.
+ *
+ * ⚠️  Multi-tenant note: this cache is process-wide and shared across all
+ * requests. In multi-tenant deployments, cache keys MUST include a tenant
+ * identifier (e.g. `tenant:${tenantId}:posts`) to prevent data leakage
+ * between tenants.
+ */
+const _STORE_MAX = 2048;
 const _store = new Map<string, CacheEntry>();
 
 export { CACHE_MISS };
@@ -41,6 +52,9 @@ export function getCached(key: string): unknown | typeof CACHE_MISS {
     _store.delete(key);
     return CACHE_MISS;
   }
+  // Move to end (LRU: mark as recently used)
+  _store.delete(key);
+  _store.set(key, entry);
   return entry.data;
 }
 
@@ -50,6 +64,10 @@ export function setCache(
   data: unknown,
   opts: { ttl: number; tags?: string[] },
 ): void {
+  // Evict oldest entry when at capacity
+  if (_store.size >= _STORE_MAX && !_store.has(key)) {
+    _store.delete(_store.keys().next().value!);
+  }
   _store.set(key, {
     data,
     expires: Date.now() + opts.ttl * 1_000,
@@ -95,6 +113,7 @@ interface PageCacheEntry {
   tags: string[];
 }
 
+const _PAGE_STORE_MAX = 1024;
 const _pageStore = new Map<string, PageCacheEntry>();
 
 /**
@@ -118,6 +137,9 @@ export function getCachedPage(pathname: string): { html: string; stale: boolean
 
 /** Store a rendered HTML page with a TTL (seconds). */
 export function setCachedPage(pathname: string, html: string, ttl: number, tags: string[] = []): void {
+  if (_pageStore.size >= _PAGE_STORE_MAX && !_pageStore.has(pathname)) {
+    _pageStore.delete(_pageStore.keys().next().value!);
+  }
   _pageStore.set(pathname, { html, expires: Date.now() + ttl * 1_000, ttl, revalidating: false, tags });
 }
 

package/src/server/csrf.ts

@@ -31,6 +31,11 @@ export function csrfMiddleware() {
     const method = event.method.toUpperCase();
     if (SAFE_METHODS.has(method)) return;
 
+    // Internal endpoints that use their own auth (Bearer token, no cookie session)
+    // don't need CSRF protection.
+    const path = (event.node.req.url ?? "").split("?")[0] ?? "";
+    if (path === "/_alabjs/revalidate" || path === "/_alabjs/vitals") return;
+
     const cookieToken = getCookie(event, CSRF_COOKIE);
     const headerToken = getHeader(event, CSRF_HEADER);
 

package/src/server/index.ts

@@ -142,3 +142,4 @@ export function defineServerFn(...args: any[]): ServerFn<any, any> {
 
 export { defineSSEHandler } from "./sse.js";
 export type { SSEEvent } from "./sse.js";
+export { invalidateLive } from "../live/broadcaster.js";