BA
Better Auth•2mo ago
Maqed

Do I need crossSubDomainCookies?

Hello, everyone, so I'm building my application as following: - frontend: app.mydomain.com - backend: api.mydomain.com should I use crossSubDomainCookies? or should I just keep it as is? And also, How can I set this up in development? Here is my current setup:
import { betterAuth } from "better-auth";
import { prismaAdapter } from "better-auth/adapters/prisma";
import prisma from "../../prisma";

export const auth = betterAuth({
database: prismaAdapter(prisma, {
provider: "postgresql",
}),
trustedOrigins: [process.env.CORS_ORIGIN || ""],
socialProviders: {
google: {
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
},
},
advanced: {
useSecureCookies: true,
crossSubDomainCookies: {
enabled: true,
domain: "http://localhost:3000", // change them to env variables
},
trustedOrigins: ["http://localhost:3000", "http://localhost:3001"], // change them to env variables
},
});
import { betterAuth } from "better-auth";
import { prismaAdapter } from "better-auth/adapters/prisma";
import prisma from "../../prisma";

export const auth = betterAuth({
database: prismaAdapter(prisma, {
provider: "postgresql",
}),
trustedOrigins: [process.env.CORS_ORIGIN || ""],
socialProviders: {
google: {
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
},
},
advanced: {
useSecureCookies: true,
crossSubDomainCookies: {
enabled: true,
domain: "http://localhost:3000", // change them to env variables
},
trustedOrigins: ["http://localhost:3000", "http://localhost:3001"], // change them to env variables
},
});
4 Replies
sik
sik•2mo ago
yes you should enable cross domain cookies but for development you can disable it. useSecureCookies by default is set to true on production and false on development I think. But if you are passing it just set it to true on production
Maqed
MaqedOP•2mo ago
For some reason, It works without enabling it. This is my deployed code:
import { betterAuth } from "better-auth";
import { prismaAdapter } from "better-auth/adapters/prisma";
import prisma from "../../prisma";

export const auth = betterAuth({
database: prismaAdapter(prisma, {
provider: "postgresql",
}),
trustedOrigins: [process.env.CORS_ORIGIN || ""],
socialProviders: {
google: {
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
},
},
});
import { betterAuth } from "better-auth";
import { prismaAdapter } from "better-auth/adapters/prisma";
import prisma from "../../prisma";

export const auth = betterAuth({
database: prismaAdapter(prisma, {
provider: "postgresql",
}),
trustedOrigins: [process.env.CORS_ORIGIN || ""],
socialProviders: {
google: {
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
},
},
});
and it works in the frontend without enabling the cross domain cookies, This is my express app index.ts:
import "dotenv/config";
import { createExpressMiddleware } from "@trpc/server/adapters/express";
import { createContext } from "./lib/context";
import { appRouter } from "./routers/index";
import cors from "cors";
import express from "express";
import { auth } from "./lib/auth";
import { toNodeHandler } from "better-auth/node";

const app = express();

app.use(
cors({
origin: process.env.CORS_ORIGIN || "",
methods: ["GET", "POST", "OPTIONS"],
allowedHeaders: ["Content-Type", "Authorization"],
credentials: true,
}),
);

app.all("/api/auth{/*path}", toNodeHandler(auth));

app.use(
"/trpc",
createExpressMiddleware({
router: appRouter,
createContext,
}),
);

app.use(express.json());

app.get("/", (_req, res) => {
res.status(200).send("OK");
});

const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Server is running on port ${port}`);
});
import "dotenv/config";
import { createExpressMiddleware } from "@trpc/server/adapters/express";
import { createContext } from "./lib/context";
import { appRouter } from "./routers/index";
import cors from "cors";
import express from "express";
import { auth } from "./lib/auth";
import { toNodeHandler } from "better-auth/node";

const app = express();

app.use(
cors({
origin: process.env.CORS_ORIGIN || "",
methods: ["GET", "POST", "OPTIONS"],
allowedHeaders: ["Content-Type", "Authorization"],
credentials: true,
}),
);

app.all("/api/auth{/*path}", toNodeHandler(auth));

app.use(
"/trpc",
createExpressMiddleware({
router: appRouter,
createContext,
}),
);

app.use(express.json());

app.get("/", (_req, res) => {
res.status(200).send("OK");
});

const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Server is running on port ${port}`);
});
Am I doing anything wrong? It's set to true on both: development and production
sik
sik•2mo ago
Looks correct to me idk why its working even though you have crossDomainCookie disabled lol. For me it was not working.
Maqed
MaqedOP•2mo ago
Yeah I've no idea why it's working either 😂

Did you find this page helpful?