I can't get middleware stacking to work on next14 app router (for i18 and auth)
Answered
Spectacled bear posted this in #help-forum
Spectacled bearOP
I'm working on a next14 project, I currently have middleware set for i18 and am trying to add a second middleware for authentication using auth.js (next-auth).
I've now gotten both middleware to work (i think?) but it looks like props are missing from my locale middleware.
Here's a github gist with all my code related to middlewares, including the file's location and any errors that are present in any file: [code](https://gist.github.com/xXnikosXx/94235d82e30d5a86109b6c3f663c5b4a)
in the screenshots you can find the errors that nextjs is throwing.
in localeMiddleware.ts, when logging, I get the following results:
console.log(request) -> [Function]
console.log(request.nextUrl) -> undefined
The locale middleware by itself worked, with no errors, so I don't think there's anything wrong with my code there, but I guess I could be wrong...
Should I be passing props to the individual middleware files somehow? Also, is there any way I can check that the middleware work as expected?
I've now gotten both middleware to work (i think?) but it looks like props are missing from my locale middleware.
Here's a github gist with all my code related to middlewares, including the file's location and any errors that are present in any file: [code](https://gist.github.com/xXnikosXx/94235d82e30d5a86109b6c3f663c5b4a)
in the screenshots you can find the errors that nextjs is throwing.
in localeMiddleware.ts, when logging, I get the following results:
console.log(request) -> [Function]
console.log(request.nextUrl) -> undefined
The locale middleware by itself worked, with no errors, so I don't think there's anything wrong with my code there, but I guess I could be wrong...
Should I be passing props to the individual middleware files somehow? Also, is there any way I can check that the middleware work as expected?
Answered by gin
have one middleware and pass the request object to your desired functions
24 Replies
have one middleware and pass the request object to your desired functions
Answer
Spectacled bearOP
functions that are in the middleware.ts file, you mean?
Instead of my current implementation?
Instead of my current implementation?
@Spectacled bear functions that are in the middleware.ts file, you mean?
Instead of my current implementation?
u dont need to have the functions in your middleware
u can use any ss functions defined in your app in your middleware
Spectacled bearOP
ss as in server-side?
ye
Spectacled bearOP
wait, so I don't need to use stackMiddlweares to do this?
what is even a stackMiddleware
Spectacled bearOP
na I mean
all the code is obsolete?
in theory, i could just have the 2 functions in middleware.ts and just pass the request object to the functions and that's it?
yes
exactly
Spectacled bearOP
wait holup
i've run into this because I had some middleware for i18
and I wanted to add
I couldve just added the line to middleware.ts with my existing code for i18?
i've run into this because I had some middleware for i18
and I wanted to add
export { auth as authMiddleware } from "@/auth" to middlewareI couldve just added the line to middleware.ts with my existing code for i18?
if u have a function that decided if u get authed or not
u can pass in the request object
and red the cookies and headers
Spectacled bearOP
damn
well then
is there any way I can check if my middleware are running as expected other than console.log() ?
is there any way I can check if my middleware are running as expected other than console.log() ?
@Spectacled bear well then
is there any way I can check if my middleware are running as expected other than console.log() ?
depends on what u want to check
Spectacled bearOP
yeah true
well imma move on to implementing auth anbd once i get there I will check it out
thanks for your help mate ❤️
well imma move on to implementing auth anbd once i get there I will check it out
thanks for your help mate ❤️