Singleton - globalThis property reset on request
Unanswered
Charmants posted this in #help-forum
Hello 👋
I want to instantiate prisma with a singleton to avoid creating several instances in development mode.
I have a problem with the singleton. When the page compiles, globalThis.prisma has the prisma instance, but as soon as I refresh the page, the globalThis.prisma becomes undefined, and remains undefined on every request even if it's set again to the prisma instance. The globalThis is not used in any other file, and db.ts is not imported in any other file. This problem only occurs in development mode.
I've searched on Google and the messages on this server, and no one seems to have mentioned the same problem as mine. If you need more information, please let me know.
Here are the relevant chunks of code :
db.ts
vanity.ts
/[locale]/leaderboard/[id]/page.tsx
I want to instantiate prisma with a singleton to avoid creating several instances in development mode.
I have a problem with the singleton. When the page compiles, globalThis.prisma has the prisma instance, but as soon as I refresh the page, the globalThis.prisma becomes undefined, and remains undefined on every request even if it's set again to the prisma instance. The globalThis is not used in any other file, and db.ts is not imported in any other file. This problem only occurs in development mode.
I've searched on Google and the messages on this server, and no one seems to have mentioned the same problem as mine. If you need more information, please let me know.
Here are the relevant chunks of code :
db.ts
function createSingleton<Instance>(name: string, instantiate: () => Instance) {
const globalAny = globalThis as any;
const singleton = (globalAny[name] as Instance) ?? instantiate();
if (process.env.NODE_ENV !== "production") {
console.log("globalThis is set :");
console.log("globalAny[name]: ", typeof globalAny[name]);
console.log("singleton: ", typeof singleton);
globalAny[name] = singleton;
}
return singleton;
}
export const prisma = createSingleton("prisma", () => new PrismaClient());vanity.ts
"use server";
import { prisma } from "@/lib/server/database/db";
export async function getVanity(id: string) {
const vanity = await prisma.leveling.findUnique({
...
});
...
}/[locale]/leaderboard/[id]/page.tsx
import { getVanity } from "@/actions/vanity";
import initTranslations from "@/app/i18n";
const ns = ["leaderboard"];
export async function generateMetadata({ params }: { params: { locale: string } }): Promise<Metadata> {
...
}
type Params = {
readonly id: string;
readonly locale: string;
};
export default async function LeaderboardPage({ params }: { readonly params: Params }) {
const { resources, t, i18n } = await initTranslations(params.locale, ns);
const vanity = await getVanity(params.id);
return (...);
}3 Replies
I've found some issues that are talking about the same problem :
https://github.com/vercel/next.js/issues/45483
https://github.com/vercel/next.js/issues/52165
https://github.com/vercel/next.js/issues/44330
https://github.com/vercel/next.js/issues/45483
https://github.com/vercel/next.js/issues/52165
https://github.com/vercel/next.js/issues/44330
Sage Thrasher
Weird thing for us is that this only happens with dynamic routes captured here https://github.com/vercel/next.js/issues/74204
I didn't expect someone to find this a year later haha. I found the solution since then. If I remember correctly, it's just not a problem and the singleton works correctly. I think that it replaces the current connection by a new one, but I may be wrong. It's not intuitive if you log it, but the singleton works