feat(storage-*): large file uploads on Vercel (#11382)

Currently, usage of Payload on Vercel has a limitation - uploads are
limited by 4.5MB file size.
This PR allows you to pass `clientUploads: true` to all existing storage
adapters
* Storage S3
* Vercel Blob
* Google Cloud Storage
* Uploadthing
* Azure Blob

And then, Payload will do uploads on the client instead. With the S3
Adapter it uses signed URLs and with Vercel Blob it does this -
https://vercel.com/guides/how-to-bypass-vercel-body-size-limit-serverless-functions#step-2:-create-a-client-upload-route.
Note that it doesn't mean that anyone can now upload files to your
storage, it still does auth checks and you can customize that with
`clientUploads.access`


https://github.com/user-attachments/assets/5083c76c-8f5a-43dc-a88c-9ddc4527d91c

Implements https://github.com/payloadcms/payload/discussions/7569
feature request.
This commit is contained in:
Sasha
2025-02-26 21:59:34 +02:00
committed by GitHub
parent c6ab312286
commit b540da53ec
54 changed files with 1548 additions and 152 deletions

View File

@@ -0,0 +1,18 @@
'use client'
import { createClientUploadHandler } from '@payloadcms/plugin-cloud-storage/client'
import { genUploader } from 'uploadthing/client'
export const UploadthingClientUploadHandler = createClientUploadHandler({
handler: async ({ apiRoute, collectionSlug, file, serverHandlerPath, serverURL }) => {
const { uploadFiles } = genUploader({
package: 'storage-uploadthing',
url: `${serverURL}${apiRoute}${serverHandlerPath}?collectionSlug=${collectionSlug}`,
})
const res = await uploadFiles('uploader', {
files: [file],
})
return { key: res[0].key }
},
})