How to pass values from Custom Server to Route Handler in Next.js?

[thucpn]

In a Next.js app with a custom server (e.g., server.ts), there is no documented or straightforward mechanism to pass values—whether value types (e.g., strings, numbers) or reference types (e.g., objects, class instances)—from the custom server to API route handlers (e.g., app/api/route.ts). As a workaround, I attempted to use globalThis to share values between the custom server and route handlers. While globalThis works for value types, it fails for reference types, as the references do not match across contexts.

Sample code:

/ global.ts 
class A {
	constructor() {}
}
export const globalA = new A();

// server.ts
import { createServer } from "http";
import { parse } from "url";
import next from "next";
import { globalA } from "./global";

const app = next({ dev: true });

globalThis.globalA = globalA;

app.prepare().then(() => {
	createServer((req, res) => {
		const parsedUrl = parse(req.url!, true);
		const handle = app.getRequestHandler();
		handle(req, res, parsedUrl);
	}).listen(4000);

	console.log(`> Server listening at http://localhost:4000`);
});

// app/api/route.ts
import { NextResponse } from "next/server";
import { globalA } from "../../global";

export async function GET() {
	if (globalThis.globalA !== globalA) {
		console.error("globalThis.globalA is not the same reference as globalA"); // fail
	}
	return NextResponse.json({ message: "Hello world" });
}

Observe that globalA is accessible via globalThis, but reference do not maintain the same. How can I pass value A from a custom server and use it in a route handler?

[thucpn]

When I try using AsyncLocalStorage, asyncLocalStorage.getStore() is undefined in Route Handler

// global.ts
import { AsyncLocalStorage } from "async_hooks";

class A {
  constructor() {}
}

export const globalA = new A();
export const asyncLocalStorage = new AsyncLocalStorage<{ globalA: A }>();

// server.ts
import { createServer } from "http";
import { parse } from "url";
import next from "next";
import { globalA, asyncLocalStorage } from "./global";

const app = next({ dev: true });

app.prepare().then(() => {
  createServer((req, res) => {
    const parsedUrl = parse(req.url!, true);
    const handle = app.getRequestHandler();
    
    // Run the request handler within AsyncLocalStorage context
    asyncLocalStorage.run({ globalA }, () => {
      handle(req, res, parsedUrl);
    });
  }).listen(4000);

  console.log(`> Server listening at http://localhost:4000/`);
});

// app/api/route.ts
import { NextResponse } from "next/server";
import { asyncLocalStorage } from "../../global";

export async function GET() {
  const store = asyncLocalStorage.getStore();
  if (!store || !store.globalA) {
    console.error("globalA not found in AsyncLocalStorage");
    return NextResponse.json({ message: "Error: globalA not available" }, { status: 500 });
  }

  // Use store.globalA instead of imported globalA
  console.log("globalA retrieved from AsyncLocalStorage:", store.globalA);
  return NextResponse.json({ message: "Hello world" });
}