"Payload has transformed the way our clients manage content. It's an indispensable tool for any modern agency."
Microsoft chose Payload to tell the world about AI.
How do you upload an image using the payload client?
I just can't get it to work. I am always getting TypeError: Cannot read properties of null (reading 'width')
I am uploading like this:
const payload = await getPayloadClient();
const media = await payload.create({
collection: "media",
data: {
alt: fileData.name
},
file: fileData
});
Seems like payload is treating the file as an image (and trying to access width). I am passing the data in this format (as required/specified by the payload client)
export type File = {
data: Buffer;
mimetype: string;
name: string;
size: number;
};
Where are you reading in
fileData? Can you show that code? There is an example of how to do this in our uploads tests here:
https://github.com/payloadcms/payload/blob/master/test/uploads/config.ts#L218This is my Next.js route. I got it to work now, but somehow it only works when using local file upload. Once i enable the cloud storage plugin that is needed for production the file is not ending up in its supposed S3 bucket
it fails with this error message
Can you show me where you're configuring the cloud storage plugin?
File uploads work when using the payload admin dashboard or when the plugin ist disabled. It
onlyfails when uploading through the payload client when using the cloud storage plugin
Looks like
An issue here
https://github.com/payloadcms/plugin-cloud-storage/blob/3d5858ca6d45d73c22e9bb97c2b443758d93400b/src/adapters/s3/handleUpload.ts#L34Since you're using s3... also here:
https://github.com/payloadcms/plugin-cloud-storage/blob/3d5858ca6d45d73c22e9bb97c2b443758d93400b/src/adapters/s3/index.ts#L29So something with the intilization of your storage client is messed up
This could be due to incorrect env vars
Unlikely an issue with how Payload sets up the client in the plugin, but possible
@teamkube It definitely looks like your adapter may not be getting configured properly. I don't see the code for your adapter above, just the plugin. Can you provide that?
Not doing anything fancy in the adapter
the thing is when uploading through the cms admin panel it also works
it only happens when using the api + cloud
so i dont think there is something fundamentally wrong with the adapter?
Yes, that does narrow it down a bit. I don't see anything wrong with your adapter. Are you deploying this somewhere, or is this behavior showing locally?
we deploy to vercel but this also happens when we use the s3 adapter locally on our development machines (all team members)
seems to be a general issue with upload through the api + cloud plugin & s3Adapter
That definitely seems odd. Can you do a writeup as an issue here?
https://github.com/payloadcms/plugin-cloud-storage/issuesI can look into recreating.
Jup, setting up a minimal reproducable example atm
Star
Discord
online
Get dedicated engineering support directly from the Payload team.