T
TanStack•3w ago
conservative-teal

How to currently access request headers?

I see some old suggestions linking to a page in server functions that no longer exists. https://tanstack.com/start/latest/docs/framework/react/server-functions#accessing-the-request-context SSR is causing issues with better-auth and i was attempting to create an isomorphic function that would correctly fetch the user's session like so: 
export const getSession = createIsomorphicFn()
  .server(async () => {
    const session = await auth.api.getSession({ 
      headers: NEED_HEADERS_HERE 
    });
    return session;
  })
  .client(async () => {
    const session = await authClient.getSession();
    return session;
  });
export const getSession = createIsomorphicFn()
  .server(async () => {
    const session = await auth.api.getSession({ 
      headers: NEED_HEADERS_HERE 
    });
    return session;
  })
  .client(async () => {
    const session = await authClient.getSession();
    return session;
  });
2 Replies
xenial-black
xenial-black•3w ago
Here => import { createMiddleware, createServerFn } from "@tanstack/react-start"; import { auth } from "./auth"; export const authMiddleware = createMiddleware().server( async ({ next, request }) => { const session = await auth.api.getSession({ headers: request.headers, }); return next({ context: { session }, }); } ); export const getCurrentUserFn = createServerFn({ method: "GET" }) .middleware([authMiddleware]) .handler(async ({ context }) => context.session);
yammering-amber
yammering-amber•2w ago
This worked for me: 
import { LoginForm } from "@/components/LoginForm";
import { createFileRoute } from "@tanstack/react-router";
import { createServerFn } from "@tanstack/react-start";
import { getRequestHeaders } from "@tanstack/react-start/server";

const serverFn = createServerFn({ method: "GET" }).handler(async () => {
  const headers = await getRequestHeaders();
  console.log(headers);
  return { test: true };
});

export const Route = createFileRoute("/login")({
  component: RouteComponent,
  beforeLoad: async () => {
    const test = await serverFn();
    console.log(test);
import { LoginForm } from "@/components/LoginForm";
import { createFileRoute } from "@tanstack/react-router";
import { createServerFn } from "@tanstack/react-start";
import { getRequestHeaders } from "@tanstack/react-start/server";

const serverFn = createServerFn({ method: "GET" }).handler(async () => {
  const headers = await getRequestHeaders();
  console.log(headers);
  return { test: true };
});

export const Route = createFileRoute("/login")({
  component: RouteComponent,
  beforeLoad: async () => {
    const test = await serverFn();
    console.log(test);

Did you find this page helpful?