Using authClient in nextjs server components / actions

Hello everyone! I am working on a side project, and I have set up a turborepo monorepo with a hono backend and a nextjs frontend. I have set up better auth in hono, and the client library in nextjs, and I can successfuly communicate. However, I have found a note that we shouldn't call the authClient on the server. However, I was wondering if it was okay to call it on the server if we're using a separate backend? My reasoning for calling it on the server is to utilize the RSC an SSR.

For instance, is this a safe thing to do on a route handler level in nextjs?

import { headers } from "next/headers";
import { notFound, redirect } from "next/navigation";

import { authClient } from "@/lib/auth-client";
import { verifySession } from "@/lib/session";

import ApiKeysTemplate from "./api-keys-template";

export default async function ApiKeys() {
  const { isAuthenticated } = await verifySession();

  if (!isAuthenticated) {
    return redirect("/sign-in");
  }

  const { data: apiKeys, error } = await authClient.apiKey.list({
    fetchOptions: {
      headers: await headers(),
    },
  });

  if (error) {
    return notFound();
  }

  return (
    <ApiKeysTemplate initialApiKeys={apiKeys} />
  );
}


Could somebody explain? 😕

Also, for checking the auth state on the next server, is this a safe thing to do?

export const getSession = cache(async (): Promise<Session | null> => {
  try {
    const { data, error } = await authClient.getSession({
      fetchOptions: {
        headers: await headers(),
      },
    });

    if (error || !data) {
      return null;
    }

    return data as Session;
  }
  catch (error) {
    console.error("Error fetching session:", error);
    return null;
  }
});

export async function verifySession() {
  const session = await getSession();

  return {
    isAuthenticated: !!session,
    session,
    user: session?.user || null,
  };
}
Was this page helpful?