BA
Better Auth•2mo ago
MaveriX89

Better Auth + Solid Start

When using Better Auth within Solid Start -- after doing all the required configuration, do we simply use the Better Auth server client (instead of the client one) to invoke all auth related matters? So given a Solid Start action like below: 
export const logIn = action((formData: FormData) => {
  "use server"
  const username = String(formData.get("username"));
  const password = String(formData.get("password"));

  let error = validateUsername(username) || validatePassword(password);

  if (error) {
    return new Error(error);
  }

  try {
    // Better Auth Server client
    const response = await auth.api.signInUsername({ body: { username, password } });
    // other stuff..
  } catch (err) {
    return err as Error;
  }

  throw redirect("/");
}, "logIn");
export const logIn = action((formData: FormData) => {
  "use server"
  const username = String(formData.get("username"));
  const password = String(formData.get("password"));

  let error = validateUsername(username) || validatePassword(password);

  if (error) {
    return new Error(error);
  }

  try {
    // Better Auth Server client
    const response = await auth.api.signInUsername({ body: { username, password } });
    // other stuff..
  } catch (err) {
    return err as Error;
  }

  throw redirect("/");
}, "logIn");
Is the above the expected way we interface with Better Auth on the server? Or is there some other behind the scenes stuff happening due to the below configuration? 
// routes/api/*auth.ts
import { auth } from "~/lib/auth";
import { toSolidStartHandler } from "better-auth/solid-start";

export const { GET, POST } = toSolidStartHandler(auth);
// routes/api/*auth.ts
import { auth } from "~/lib/auth";
import { toSolidStartHandler } from "better-auth/solid-start";

export const { GET, POST } = toSolidStartHandler(auth);
Or lastly, should we still be using the Better Auth client on the frontend and do: 
const response = await authClient.signIn.username(credentials));
const response = await authClient.signIn.username(credentials));
2 Replies
Unknown User
Unknown User•2mo ago
Message Not Public
Sign In & Join Server To View
MaveriX89
MaveriX89OP•5w ago
@JaspaJones I wish I could say I did -- I ended up pivoting to a normal SolidJS SPA + Elysia backend setup. I was fighting Solid Start with things related to authenticated states and protected routes. I may revisit it down the line when I have more time. I feel the Better Auth documentation wasn't exactly clear what to do next post setting up this config here for Solid Start: 
// routes/api/*auth.ts
import { auth } from "~/lib/auth";
import { toSolidStartHandler } from "better-auth/solid-start";

export const { GET, POST } = toSolidStartHandler(auth);
// routes/api/*auth.ts
import { auth } from "~/lib/auth";
import { toSolidStartHandler } from "better-auth/solid-start";

export const { GET, POST } = toSolidStartHandler(auth);
I don't know if there is supposed to be some magic that happens, but my suspicion is that we lean on the Better Auth server client if you're relying on server actions from Solid Start. So like you saw me post above, I think the interaction pattern would be: 
export const logIn = action((formData: FormData) => {
  "use server"
  const username = String(formData.get("username"));
  const password = String(formData.get("password"));

  let error = validateUsername(username) || validatePassword(password);

  if (error) {
    return new Error(error);
  }

  try {
    // Better Auth Server client
    const response = await auth.api.signInUsername({ body: { username, password } });
    // other stuff..
  } catch (err) {
    return err as Error;
  }

  throw redirect("/");
}, "logIn");
export const logIn = action((formData: FormData) => {
  "use server"
  const username = String(formData.get("username"));
  const password = String(formData.get("password"));

  let error = validateUsername(username) || validatePassword(password);

  if (error) {
    return new Error(error);
  }

  try {
    // Better Auth Server client
    const response = await auth.api.signInUsername({ body: { username, password } });
    // other stuff..
  } catch (err) {
    return err as Error;
  }

  throw redirect("/");
}, "logIn");
Unless of course you're doing something client side, then you would lean on the Better Auth web client instead. I think it would be good if we, as a community, could build some crowd-sourced documentation on Better Auth patterns with Solid Start.

Did you find this page helpful?