conventional-tan

cookie issue in production

I'm using the below code after setting up ssr in my root page so i thought of validating the session of the user in the server side only, I'm using the following code below for the session fetching which I am calling from beforeload function of __root.tsx file, it works totally fine on localhost but when i pushed it to prod it doesn't work, I guess the issue happened as both backend and frontend are deployed on different addresses. Before ssr everything works fine . Here's the sample of my code.

import { createServerFn } from "@tanstack/react-start";
import { getHeaders } from "@tanstack/react-start/server";
import { authClient } from "./auth";
import { client } from "./client";

export const getSessionServer = createServerFn({
  method: 'GET'
})
  .validator(() => ({}))
  .handler(async () => {
    try {
      const headers: any = getHeaders();
      console.log("headers", headers);
      const session = await authClient.getSession({
        fetchOptions: {
          headers,
          credentials: 'include'
        }
      });

      console.log("session=======>", session);
      
      return {
        user: session?.data?.user || null,
        session: session?.data?.session || null,
      };
    } catch (error) {
      console.error('Failed to get session:', error);
      return {
        user: null,
        session: null,
      };
    }
  });

import { createServerFn } from "@tanstack/react-start";
import { getHeaders } from "@tanstack/react-start/server";
import { authClient } from "./auth";
import { client } from "./client";

export const getSessionServer = createServerFn({
  method: 'GET'
})
  .validator(() => ({}))
  .handler(async () => {
    try {
      const headers: any = getHeaders();
      console.log("headers", headers);
      const session = await authClient.getSession({
        fetchOptions: {
          headers,
          credentials: 'include'
        }
      });

      console.log("session=======>", session);
      
      return {
        user: session?.data?.user || null,
        session: session?.data?.session || null,
      };
    } catch (error) {
      console.error('Failed to get session:', error);
      return {
        user: null,
        session: null,
      };
    }
  });

Am i missing anything ?

23 Replies

conventional-tanOP•4mo ago

whenever i log headers sometimes it gets the cookie and sometimes it don't like in the first call it gets the cookie and after that it won't Hey @Manuel Schiller can you please look at this once? or @Maintainer

optimistic-gold•4mo ago

that role‘s for every library‘s maintainers, not just start.

conventional-tanOP•4mo ago

Ah!, got it

deep-jade•4mo ago

please provide a complete minimal example repo, e.g. by modifying the start-basic example

conventional-tanOP•4mo ago

Hey @Manuel Schiller https://github.com/Shinchan3102/tanstack-start-auth-sample here is the minimal setup for the issue, it would work fine when you would be running both on localhost but if they run on different origins the session wouldn't work

GitHub

GitHub - Shinchan3102/tanstack-start-auth-sample

Contribute to Shinchan3102/tanstack-start-auth-sample development by creating an account on GitHub.

conventional-tanOP•4mo ago

Hey @Manuel Schiller can you check this once?

deep-jade•4mo ago

lots to do, sorry. please describe in more detail what you mean by different origins

conventional-tanOP•4mo ago

different origin as in my server(hono js) and frontend(tanstack start) are deployed separately

deep-jade•4mo ago

i wont be able to run your example anytime soon, sorry however if you have different origins, it might just be that the browser does not send the cookie along to start if thats on a different domain etc

conventional-tanOP•4mo ago

yeah that one is the issue and due to that i'm unable to get user session, also i don't know why but some redundant calls is being made likely by the browser itself as it don't contain the cookies but how can i handle that issue? i'm using better auth btw

deep-jade•4mo ago

redundant calls ?

conventional-tanOP•4mo ago

yeah it was likely due to the browser calls for sitemap or something but its not of a issue for now, is there any way that i can wait the call till the cookie being set and i can get the cookie in ssr? by the way that redundant calls are not happening in the sample example which i created

deep-jade•4mo ago

who sets the cookie? on which domain? on which domains are the two systems deployed?

conventional-tanOP•4mo ago

Its being set from the backend itself I'm using betterauth for authentication, i have deployed the app on cloudflare or you can consider any different ip address for both basically my backend code is not inside the tanstack start its a separate codebase

deep-jade•4mo ago

did you specify SameSite ? https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/Cookies#controlling_third-party_cookies_with_samesite probably doesnt matter even why do you have better auth on a different backend btw? why not integrated in start?

conventional-tanOP•4mo ago

Backend is hosted differently to frontend I had migrated my frontend to tanstack start recently from tanstack router and integrated that with my current backend... Was trying to add ssr mode but facing this cookie issue

deep-jade•4mo ago

so does the browser send the cookie even to start?

conventional-tanOP•4mo ago

Didn't get it... My frontend is in start and i guess we can access the browser cookie through getwebrequest or getHeaders fn in the createserver fn

deep-jade•4mo ago

have a look at the browser devtools. does the request contain the cookie there?

conventional-tanOP•4mo ago

Nope, in server side api calls it won't be visible i guess? I have added consoles to check and it's being able to fetch the cookies if it's set before I think the main issue is the call is being made before the cookie is being set in the browser

deep-jade•4mo ago

i dont follow here. if the browser does not send the cookie to start, it cannot read it.

conventional-tanOP•4mo ago

but the browser send the cookie to start, I guess the issue is session call is made before the cookie is set in the browser as far as i have checked Hey @Manuel Schiller did you checked this once?

deep-jade•4mo ago

no. still unclear what happens in which order and who sets what.

Gaming

Programming

cookie issue in production

Did you find this page helpful?