Bearer token with social login
Plugins related
Next.js
Next.jsHi, I am having trouble setting up bearer tokens with social login. The server sends the token back in the header set-auth-token but the client is not receiving it.
auth.ts:
export const auth = betterAuth({
database: prismaAdapter(db, { provider: "postgresql" }),
emailAndPassword: {
enabled: true,
disableSignUp: true,
},
socialProviders: {
google: {
clientId: process.env.GOOGLE_CLIENT_ID!,
clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
},
},
trustedOrigins: [
...(process.env.NODE_ENV === "development"
? ["http://localhost:3000", "http://localhost:5001"]
: []),
],
plugins: [bearer()],
});
Login handler:
const handleGoogleSignIn = async () => {
await authClient.signIn.social({
provider: "google",
callbackURL:
});
};
authClient.ts:
"use client";
import { createAuthClient } from "better-auth/react";
export const authClient: ReturnType<typeof createAuthClient> = createAuthClient({
baseURL: "http://localhost:4001",
fetchOptions: {
auth: {
type: "Bearer",
token: () => localStorage.getItem("bearer_token") || "",
},
onSuccess: (ctx) => {
const authToken = ctx.response.headers.get("set-auth-token");
if (authToken) {
localStorage.setItem("bearer_token", authToken);
}
},
},
});
When I log response.headers it never contains set-auth-token.
Setup:
Next.js client at localhost:3000
Fastify backend at localhost:4001
CORS:
void server.register(cors, {
origin: ["http://localhost:5001", "http://localhost:3000"],
credentials: true,
exposedHeaders: ["set-auth-token", "Set-Auth-Token"],
});
I am new to authentication and still learning. Any help would be appreciated.
auth.ts:
export const auth = betterAuth({
database: prismaAdapter(db, { provider: "postgresql" }),
emailAndPassword: {
enabled: true,
disableSignUp: true,
},
socialProviders: {
google: {
clientId: process.env.GOOGLE_CLIENT_ID!,
clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
},
},
trustedOrigins: [
...(process.env.NODE_ENV === "development"
? ["http://localhost:3000", "http://localhost:5001"]
: []),
],
plugins: [bearer()],
});
Login handler:
const handleGoogleSignIn = async () => {
await authClient.signIn.social({
provider: "google",
callbackURL:
${process.env.NEXT_PUBLIC_APP_URL}/register});
};
authClient.ts:
"use client";
import { createAuthClient } from "better-auth/react";
export const authClient: ReturnType<typeof createAuthClient> = createAuthClient({
baseURL: "http://localhost:4001",
fetchOptions: {
auth: {
type: "Bearer",
token: () => localStorage.getItem("bearer_token") || "",
},
onSuccess: (ctx) => {
const authToken = ctx.response.headers.get("set-auth-token");
if (authToken) {
localStorage.setItem("bearer_token", authToken);
}
},
},
});
When I log response.headers it never contains set-auth-token.
Setup:
Next.js client at localhost:3000
Fastify backend at localhost:4001
CORS:
void server.register(cors, {
origin: ["http://localhost:5001", "http://localhost:3000"],
credentials: true,
exposedHeaders: ["set-auth-token", "Set-Auth-Token"],
});
I am new to authentication and still learning. Any help would be appreciated.
