Fetch the url of the uploaded file.

[kj-1809]

how to get the url of the uploaded file in the code ?

[OrJDev]

You can get access to the url of the file from the onUploadComplete method:

import { createUploadthing, type FileRouter } from "uploadthing/server";
const f = createUploadthing();

const auth = (req: Request) => ({ id: "fakeId" }); // Fake auth function

// FileRouter for your app, can contain multiple FileRoutes
export const ourFileRouter = {
  // Define as many FileRoutes as you like, each with a unique routeSlug
  imageUploader: f
    // Set permissions and file types for this FileRoute
    .fileTypes(["image", "video"])
    .maxSize("1GB")
    .middleware(async (req) => {
      // 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 Error("Unauthorized");

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

      console.log("file url", file.url);
    }),
} satisfies FileRouter;

export type OurFileRouter = typeof ourFileRouter;

[georgeosutton]

How would you get access to the URL client side?

[markflorkowski]

We're adding this soon! Here's a canary if you want to try it out:

pnpm add uploadthing@3.0.2-canary.9ebcffa @uploadthing/react@3.0.2-canary.9ebcffa

See #51 for more details on how to use it!

[t3dotgg]

Added, will be in next release!