Ryan Gillie•7d ago

How to forward headers (cookies) w/ Tanstack Start

I followed the example repository to get up and running, but I can't seem to get cookie-based authentication to work during the ssr pass. Just doesn't look like the headers are being forwarded on to the fetch call. I tried attaching ...(typeof window === 'undefined' && headers: getHeaders()}) to the createTRPCClient call in router.tsx which works in dev and fails in build (probably because that function isn't supposed to be used there). Any help would be appreciated!

Solution:

After playing around some more, I was able to simplify it to ```ts const getIncomingHeaders = createIsomorphicFn() .client(() => ({})) .server(() => getHeaders());...

Jump to solution

2 Replies

Maky•7d ago

I was working earlier today and i managed to get it running, https://github.com/makyinmars/tan-stack-start-full-stack/tree/main. This is the file: https://github.com/makyinmars/tan-stack-start-full-stack/blob/main/app/router.tsx I'm using auth lucia, i need to clean up the repo a little bit

GitHub

tan-stack-start-full-stack/app/router.tsx at main · makyinmars/tan...

Contribute to makyinmars/tan-stack-start-full-stack development by creating an account on GitHub.

Solution

Ryan Gillie•7d ago

After playing around some more, I was able to simplify it to

const getIncomingHeaders = createIsomorphicFn()
    .client(() => ({}))
    .server(() => getHeaders());

// ...

const trpcClient = createTRPCClient<TRPCRouter>({
    links: [
        httpBatchStreamLink({
            headers: getIncomingHeaders(),
            transformer: superjson,
            url: getUrl(),
        }),
    ],
});

const getIncomingHeaders = createIsomorphicFn()
    .client(() => ({}))
    .server(() => getHeaders());

// ...

const trpcClient = createTRPCClient<TRPCRouter>({
    links: [
        httpBatchStreamLink({
            headers: getIncomingHeaders(),
            transformer: superjson,
            url: getUrl(),
        }),
    ],
});

How to forward headers (cookies) w/ Tanstack Start

Did you find this page helpful?