T
TanStack•3w ago
eastern-cyan

Accessing returned middleware data in router context

I have some middleware that returns some additional context like so: 
export const exampleMiddleware = createMiddleware().server(async ({ next }) => {
  return next({ context: { foo: "bar" } })
})
export const exampleMiddleware = createMiddleware().server(async ({ next }) => {
  return next({ context: { foo: "bar" } })
})
This middleware will either be global middleware or request middleware called on the root route. Is it possible to access that returned context in my routers loader or beforeLoad context?
4 Replies
graceful-blue
graceful-blue•3w ago
yes you can. it is passed in as serverContext into loader and beforeLoad
eastern-cyan
eastern-cyanOP•3w ago
great, thanks manuel. I see that now, though typescript thinks that serverContext is undefined: 
export const Route = createRootRouteWithContext<RouterContext>()({
  server: {
    middleware: [
      createMiddleware().server(async ({ next }) => {
        return next({ context: { foo: "bar" } })
      }),
    ],
  },
  beforeLoad: async ({ serverContext }) => {
    // typed as undefined, actual value is { foo: "bar" }
  },
})
export const Route = createRootRouteWithContext<RouterContext>()({
  server: {
    middleware: [
      createMiddleware().server(async ({ next }) => {
        return next({ context: { foo: "bar" } })
      }),
    ],
  },
  beforeLoad: async ({ serverContext }) => {
    // typed as undefined, actual value is { foo: "bar" }
  },
})
is there any extra config required to get the types working correctly?
graceful-blue
graceful-blue•2w ago
i guess it does not like that createMiddleware is used inline try 
const mw = createMiddleware().server(async ({ next }) => {
        return next({ context: { foo: "bar" } })
      })
export const Route = createRootRouteWithContext<RouterContext>()({
  server: {
    middleware: [
      mw
    ],
  },
  beforeLoad: async ({ serverContext }) => {

  },
})
const mw = createMiddleware().server(async ({ next }) => {
        return next({ context: { foo: "bar" } })
      })
export const Route = createRootRouteWithContext<RouterContext>()({
  server: {
    middleware: [
      mw
    ],
  },
  beforeLoad: async ({ serverContext }) => {

  },
})
eastern-cyan
eastern-cyanOP•2w ago
copied and pasted your code and it's still typed as undefined. my tsconfig is unchanged from the starter project. very strange. any other ideas?
No description

Did you find this page helpful?