Server middleware execution timing unclear in Nuxt 3

Answer the Core Questions First

• Does Nuxt 3 always invoke server/middleware handlers before rendering the page component, regardless of exposeRoute settings? Yes. Middleware placed in server/middleware is handled by Nitro at the very start of the request lifecycle, before any route handler or Vue component is instantiated.
• If exposeRoute: false is used, does the middleware still run on every request? Yes. exposeRoute only controls whether the route is exposed as a standalone API endpoint; it does not affect the execution of Nitro middleware.
• How can the execution order be confirmed without altering the rendering output? Insert a console.log in the middleware and in a page‑side defineNuxtPlugin, or set a custom header in the middleware and read it with useRequestHeader inside the component. The log or header will appear before any rendering‑time code runs.

Why Middleware Runs First

Nuxt 3’s server layer is built on Nitro. The request pipeline is:

1. Incoming HTTP request → Nitro receives it.
2. All files in server/middleware (sorted alphabetically) are executed.
3. Route handlers (including those with exposeRoute: false) are matched.
4. The Nuxt rendering engine builds the Vue component tree.

Because middleware runs at step 2, any modifications you make to event (headers, params, context) are available to the page component during its creation.

Practical Verification Steps

// server/middleware/timezone.js
export default defineEventHandler((event) => {
  console.log('Middleware executed – converting timezone');
  event.context.tz = 'America/New_York'; // example
});

// plugins/verifyOrder.client.ts
export default defineNuxtPlugin(() => {
  console.log('Plugin executed – after middleware, before render');
});

// pages/index.vue

Run npm run dev and observe the console order: middleware → plugin → component. If you prefer to avoid console output, set a custom header in the middleware:

event.node.res.setHeader('x-tz', 'America/New_York');

Then read it in the component:

const tz = useRequestHeader('x-tz');

The value will be present before any client‑side rendering logic executes.

Key Take‑Away

Nuxt 3 guarantees that server/middleware runs on every request, even when exposeRoute: false is set. Use the header‑or‑log trick to confirm the order without changing the UI.