N
Nuxt2mo ago
JohnBoblem

404 middleware

Is it possible to create some server side middleware for handling 404 errors? I have a website I migrated from an old app and I want to 301 redirect some urls that are currently a 404
6 Replies
kapa.ai
kapa.ai2mo ago
Hi @JohnBoblem. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Yes, you can handle 404 errors and perform 301 redirects for specific URLs using server-side middleware in Nuxt (both Nuxt 3 and Nuxt 4), thanks to the Nitro server engine. How to implement: 1. Create server middleware:
Place a file in the server/middleware/ directory (e.g., server/middleware/redirects.ts). This middleware will run on every request before your API endpoints and pages. 2. Check the request URL and redirect as needed:
Use the Nitro event handler utilities to inspect the request and perform a redirect for specific legacy URLs. 3. Return a 404 for other unmatched routes:
If the URL does not match any of your redirect rules or existing routes, you can set the response status to 404. Example:
// server/middleware/redirects.ts
export default defineEventHandler((event) => {
const url = event.node.req.url

// Example: Redirect old URL to new one
if (url === '/old-path') {
// 301 redirect
event.node.res.writeHead(301, { Location: '/new-path' })
event.node.res.end()
return
}

// You can add more redirect rules here

// If not matched, do nothing and let Nuxt handle the route (which may result in a 404)
})
// server/middleware/redirects.ts
export default defineEventHandler((event) => {
const url = event.node.req.url

// Example: Redirect old URL to new one
if (url === '/old-path') {
// 301 redirect
event.node.res.writeHead(301, { Location: '/new-path' })
event.node.res.end()
return
}

// You can add more redirect rules here

// If not matched, do nothing and let Nuxt handle the route (which may result in a 404)
})
Notes: - This middleware will run for every request. If you want to only handle 404s, you may need to place your logic after all other routes have been checked, or use a catch-all route handler. - For more advanced or dynamic redirects, you can use the addServerHandler utility in a Nuxt module to register custom handlers or middleware for specific patterns or fallback cases Docs: Nitro server handlers. - You can also use the setResponseStatus utility to set the status code for custom 404 pages if you want to handle the response in a more Nuxt-native way Docs: setResponseStatus. References:
- Server Endpoints & Middleware - Nitro server handlers - setResponseStatus utility This approach allows you to intercept requests, perform redirects for legacy URLs, and let Nuxt handle 404s for all other unmatched routes. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai2mo ago
<@447739038250565642> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
JohnBoblem
JohnBoblemOP2mo ago
Is it possible to run the middleware only in case of 404? @kapa.ai Is it possible to run the middleare only on 404?
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: ---------------------- Based on the provided knowledge sources, Nuxt's server middleware (in server/middleware/) runs on every request, not just on 404s. The documentation states:
Middleware under server/middleware/ is executed for every request. Middleware can be used for tasks such as authentication, logging, or request transformation. Returning a value from middleware will terminate the request and send the returned value as the response. This behavior should generally be avoided to ensure proper request handling!
Nuxt 4 Server Middleware There is no built-in mechanism in Nuxt to run server middleware only when a 404 occurs. Middleware is not aware of whether a route will resolve or not at the time it runs. If you want to handle only 404s, you would need to implement a custom catch-all server handler (using addServerHandler with a wildcard route) that runs after all other routes, but this is not described in the official documentation. In summary:
No, according to the official Nuxt documentation, server middleware cannot be configured to run only on 404 errors. Middleware runs on every request, and there is no documented way to restrict it to 404s only.
Nuxt 4 Server Middleware ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai2mo ago
<@447739038250565642> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Did you find this page helpful?