Does Express Work With UploadThing?
Express and UploadThing work together seamlessly for building full-stack file upload systems with TypeScript support.
Quick Facts
How Express Works With UploadThing
Express pairs naturally with UploadThing through UploadThing's Node.js runtime support and flexible webhook handling. You set up UploadThing routes on your Express backend using the createRouteHandler function, which integrates directly into Express middleware. The workflow involves uploading files from the client-side UploadThing component, which sends files to UploadThing's servers, then UploadThing triggers webhooks back to your Express app to handle post-upload logic like database updates or processing. Express handles the webhook routes and business logic, while UploadThing manages the actual file storage infrastructure. This separation of concerns keeps your Express app lightweight. The developer experience is smooth with TypeScript support throughout—you get full type safety on file metadata, callbacks, and server functions. One architectural note: UploadThing handles S3 storage by default, so you're not storing files on your Express server, which is ideal for scalability.
Best Use Cases
Quick Setup
npm install express uploadthingimport express from 'express';
import { createRouteHandler } from 'uploadthing/express';
import { ourFileRouter } from './uploadthing';
const app = express();
app.use(express.json());
// Mount UploadThing routes
app.use('/api/uploadthing', createRouteHandler({ router: ourFileRouter }));
// Handle webhook for post-upload processing
app.post('/api/webhooks/uploadthing', express.json(), async (req, res) => {
const { data, type } = req.body;
if (type === 'fs.ready') {
console.log('File uploaded:', data.files[0].name);
// Update database, trigger processing, etc.
}
res.json({ received: true });
});
app.listen(3000, () => console.log('Server running on :3000'));Known Issues & Gotchas
UploadThing webhook secret validation is required but not always obvious in Express setup
Fix: Always verify the webhook signature using UploadThing's provided utilities before processing webhook events, and store the secret in environment variables
CORS configuration is needed on Express when client makes direct calls to UploadThing, which can cause confusion about where CORS should be configured
Fix: Enable CORS on your Express app's webhook routes, but note that client-to-UploadThing communication doesn't require Express CORS configuration
File size limits and allowed MIME types must be configured in UploadThing, not Express, leading to developers mistakenly adding validation in the wrong place
Fix: Configure all file restrictions in UploadThing's route builder, not Express middleware, for consistency and security
Alternatives
- •Next.js with UploadThing - provides built-in API route handling and better TypeScript integration than bare Express
- •Express with Multer + AWS S3 - more manual setup but gives you complete control over storage and processing
- •Express with Cloudinary - simpler image handling but less flexibility for arbitrary file types and post-processing
Resources
Related Compatibility Guides
Explore more compatibility guides