CodeWrangler_
CodeWrangler_
TTCTheo's Typesafe Cult
Created by CodeWrangler_ on 5/7/2025 in #questions
NextJS customId support in /api/uploadthing route
Hi everyone, I've checked the docs and I can't find the correct way to use customId values in nextjs app router. @theo (t3.gg) what an I doing wrong? Here is my core.ts:
// FileRouter for your app, can contain multiple FileRoutes
export const uploadRouter = {
// Define as many FileRoutes as you like, each with a unique routeSlug


// Video Uploader
videoUploader: f({
video: {
maxFileSize: "32MB",
maxFileCount: 1,
},

})
.input(z.object({ customId: z.string() }))
.middleware(async ({ req, input }) => {
// This code runs on your server before upload
const user = await auth(req);

// If you throw, the user will not be able to upload
if (!user) throw new UploadThingError("Unauthorized");

// Whatever is returned here is accessible in onUploadComplete as `metadata`
return { userId: user.id, customId: input.customId };
})
.onUploadComplete(async ({ metadata, file }) => {
// This code RUNS ON YOUR SERVER after upload
console.log("Upload complete for userId:", metadata.userId);

console.log("file url (ufsUrl):", file.ufsUrl);
console.log("customId:", metadata.customId);

return {
uploadedBy: metadata.userId,
customId: metadata.customId,
fileUrl: file.ufsUrl,
};
})
,
} satisfies FileRouter;

export type UploadRouter = typeof uploadRouter;
// FileRouter for your app, can contain multiple FileRoutes
export const uploadRouter = {
// Define as many FileRoutes as you like, each with a unique routeSlug


// Video Uploader
videoUploader: f({
video: {
maxFileSize: "32MB",
maxFileCount: 1,
},

})
.input(z.object({ customId: z.string() }))
.middleware(async ({ req, input }) => {
// This code runs on your server before upload
const user = await auth(req);

// If you throw, the user will not be able to upload
if (!user) throw new UploadThingError("Unauthorized");

// Whatever is returned here is accessible in onUploadComplete as `metadata`
return { userId: user.id, customId: input.customId };
})
.onUploadComplete(async ({ metadata, file }) => {
// This code RUNS ON YOUR SERVER after upload
console.log("Upload complete for userId:", metadata.userId);

console.log("file url (ufsUrl):", file.ufsUrl);
console.log("customId:", metadata.customId);

return {
uploadedBy: metadata.userId,
customId: metadata.customId,
fileUrl: file.ufsUrl,
};
})
,
} satisfies FileRouter;

export type UploadRouter = typeof uploadRouter;
3 replies