T
TanStack5mo ago
distinguished-blush

Global Middleware not working after devinxi?

I'm finally getting around to updating my production app with the devinxi updates (1.120.3 --> 1.123.2). Everything seems to be working so far except my global middleware.
I've searched and found two GH Issues about global middleware not working (opened in Feb/Mar but have recent comments - e.g., https://github.com/TanStack/router/issues/3869) and at least one Discord post mentioning that global middleware isn't working.
I haven't seen anything concrete though about this being a known/accepted issue across the board. Maybe I just missed an Issue or something. Is it working for some people? Or is it not working at all post-1.121? If this is a known issue with 1.121+, please let me know if there's anything I can do to help!
45 Replies
foreign-sapphire
foreign-sapphire5mo ago
import the global middleware file somewhere i took the habit of importing it everywhere i create a server function
afraid-scarlet
afraid-scarlet5mo ago
yes this is a known issue, we still need to implement global middlware registration now that devinxi has happened
distinguished-blush
distinguished-blushOP5mo ago
Okay, thanks for the confirmation! I tried adding import "@/global-middleware"; in __root.tsx just to see what happened. My logging middleware did start running but I was getting many duplicate executions (10-20x). I can hold out for the fix. I'd rather not manually add logging middleware to a few dozen individual server functions just to remove it later.
flat-fuchsia
flat-fuchsia5mo ago
try importing it from router.tsx instead
distinguished-blush
distinguished-blushOP5mo ago
Thanks. I tried that but I still get duplicates. It stops at the 11th due to MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 data listeners added to [IncomingMessage]. MaxListeners is 10. Use emitter.setMaxListeners() to increase limit.
No rush on my end. I've been running fine in production on 1.120.3 for a month so I don't mind holding out longer for the official fix.
extended-salmon
extended-salmon5mo ago
I ran into the same issue. @Manuel Schiller You are probably busy, so no rush or pressure. But do you have any estimation of when this might be fixed? It would really help! 😄
afraid-scarlet
afraid-scarlet5mo ago
it will take some more time I am sorry. but it is not forgotten
foreign-sapphire
foreign-sapphire5mo ago
This helped a lot. I had to import it into the server fxn file. Ready to also help with documentation if this is ready ☺️
unwilling-turquoise
unwilling-turquoise4mo ago
Any updates? I think it should have a warning in the docs
afraid-scarlet
afraid-scarlet4mo ago
not yet.
unwilling-turquoise
unwilling-turquoise4mo ago
Is there a workaround? And is it possible to use AsyncLocalStorage from Node with it? It works with loeaders?
afraid-scarlet
afraid-scarlet4mo ago
start uses async local storage already internally, so yes it works what do you want to do with ALS here?
unwilling-turquoise
unwilling-turquoise4mo ago
I am trying to integrate ts start with paraglide: https://github.com/IgorSzymanski/tanstack-start-paraglide
GitHub
GitHub - IgorSzymanski/tanstack-start-paraglide
Contribute to IgorSzymanski/tanstack-start-paraglide development by creating an account on GitHub.
unwilling-turquoise
unwilling-turquoise4mo ago
As in my example, the loaders does not read from AsyncLocalStorage: https://github.com/juliomuhlbauer/tanstack-start-paraglide
GitHub
GitHub - juliomuhlbauer/tanstack-start-paraglide
Contribute to juliomuhlbauer/tanstack-start-paraglide development by creating an account on GitHub.
unwilling-turquoise
unwilling-turquoise4mo ago
getLocale() does not work with the loader. It would be nice to see an example of TS Start with ASL
afraid-scarlet
afraid-scarlet4mo ago
where is getLocale() defined?
unwilling-turquoise
unwilling-turquoise4mo ago
It is compiled from paraglide
afraid-scarlet
afraid-scarlet4mo ago
and what is it? what does it do?
unwilling-turquoise
unwilling-turquoise4mo ago
I will commit the generated files
afraid-scarlet
afraid-scarlet4mo ago
why wouldnt an ordinary function work in a loader? does it never "work" or just not on the client or server?
unwilling-turquoise
unwilling-turquoise4mo ago
Actually it works on the first visit, but when changing locale it does not work properly
afraid-scarlet
afraid-scarlet4mo ago
so it does not work on the client then? i mean after a client navigation?
unwilling-turquoise
unwilling-turquoise4mo ago
When I switch the locale in the client, the loader gets the old locale I will come up with the complete example
afraid-scarlet
afraid-scarlet4mo ago
ALS wont help you on the client as this is a server only thing
unwilling-turquoise
unwilling-turquoise4mo ago
But subquent navigations on the loader always come from server right?
afraid-scarlet
afraid-scarlet4mo ago
the loader runs on the client after the initial SSR response
unwilling-turquoise
unwilling-turquoise4mo ago
If I have a server only function that invokes my db with envs, it will run on the client after the inital SSR?
afraid-scarlet
afraid-scarlet4mo ago
no. a server function always runs on the server but the loader that invokes the server function runs on the client
unwilling-turquoise
unwilling-turquoise4mo ago
I am not using server functions As I am concerned, the loader runs only on the server when ssr: true
unwilling-turquoise
unwilling-turquoise4mo ago
Selective Server-Side Rendering (SSR) | TanStack Start React Docs
What is Selective SSR? In TanStack Start, routes matching the initial request are rendered on the server by default. This means beforeLoad and loader are executed on the server, followed by rendering...
unwilling-turquoise
unwilling-turquoise4mo ago
Full example with the paraglide files:
unwilling-turquoise
unwilling-turquoise4mo ago
GitHub
GitHub - juliomuhlbauer/tanstack-start-paraglide at paraglide-full-...
Contribute to juliomuhlbauer/tanstack-start-paraglide development by creating an account on GitHub.
unwilling-turquoise
unwilling-turquoise4mo ago
TanStack Start | Type-Safe, Client-First, Full-Stack React Framework
TanStack Start is a type-safe, client-first, full-stack React framework.
afraid-scarlet
afraid-scarlet4mo ago
but only for the initial request
unwilling-turquoise
unwilling-turquoise4mo ago
will test this, but getLocale works on the client and the server try switching the locale The locale from client works, but the locale from loades does not
afraid-scarlet
afraid-scarlet4mo ago
it lags behind?
unwilling-turquoise
unwilling-turquoise4mo ago
Yeah, it gets the old locale
afraid-scarlet
afraid-scarlet4mo ago
how are path param and lingqui connected? i dont understand what this should do here
afraid-scarlet
afraid-scarlet4mo ago
afraid-scarlet
afraid-scarlet4mo ago
can you explain what you are trying to do please?
unwilling-turquoise
unwilling-turquoise4mo ago
unwilling-turquoise
unwilling-turquoise4mo ago
I am trying to integrate Paraglide with TS Start. It seems that global middleware is not working. So I am using the start file to configure it.
unwilling-turquoise
unwilling-turquoise4mo ago
Paraglide JS | inlang
Simple, adaptable and tiny i18n library that integrates with any framework
optimistic-gold
optimistic-gold4mo ago
Same issue here, as a workaround, i put the registerGlobalMiddleware calls into __root.tsx, which seems to work
unwilling-turquoise
unwilling-turquoise4mo ago
It works importing in the router for me But I think the loader is loading before the midleware and the server entry point If I do this: beforeLoad: ({ params }) => { overwriteGetLocale(() => params.locale); }, It works. But overwriting get locale in the server entry point and midleware does not work because the loader invokes before it Also, it is creating trailing slashes. Which is default never, right? @Manuel Schiller is it normal that the server.tsx runs after the loader of the route?

Did you find this page helpful?