Metadata not being inserted - R2 Presigned URLs

hello, i've included metadata during the url presigning, but the uploaded file doesn't have custom metadata on r2 dashboard
const command = new PutObjectCommand({
Bucket: ENV_VARIABLES.R2.R2_BUCKET_NAME,
Key: key,
ContentLength: fileSizeInBytes,
ContentType: contentType,
ContentMD5: md5_checksum,
CacheControl: "private, max-age=2592000", // 30 days
Metadata: {
"userr": "userr"
}
});
return await getSignedUrl(FileStorage._s3Client, command, { expiresIn: expiresInSeconds });
const command = new PutObjectCommand({
Bucket: ENV_VARIABLES.R2.R2_BUCKET_NAME,
Key: key,
ContentLength: fileSizeInBytes,
ContentType: contentType,
ContentMD5: md5_checksum,
CacheControl: "private, max-age=2592000", // 30 days
Metadata: {
"userr": "userr"
}
});
return await getSignedUrl(FileStorage._s3Client, command, { expiresIn: expiresInSeconds });
e.g of presigned url
https://xxxx.xxxx.r2.cloudflarestorage.com/user%20b/testt.txt?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=35f5366333f47becddfdad106108c512%2F20240821%2Fauto%2Fs3%2Faws4_request&X-Amz-Date=20240821T081129Z&X-Amz-Expires=600&X-Amz-Signature=27c05c8c21582732108d5caee42cbcbba1f43068547655729041445ad0509248&X-Amz-SignedHeaders=content-length%3Bcontent-md5%3Bhost&x-amz-meta-userr=userr&x-id=PutObject
https://xxxx.xxxx.r2.cloudflarestorage.com/user%20b/testt.txt?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=35f5366333f47becddfdad106108c512%2F20240821%2Fauto%2Fs3%2Faws4_request&X-Amz-Date=20240821T081129Z&X-Amz-Expires=600&X-Amz-Signature=27c05c8c21582732108d5caee42cbcbba1f43068547655729041445ad0509248&X-Amz-SignedHeaders=content-length%3Bcontent-md5%3Bhost&x-amz-meta-userr=userr&x-id=PutObject
No description
14 Replies
yuvraj
yuvrajOP3mo ago
hello
harshil1712
harshil17123mo ago
You need to pass the meta data in the header as well. After you create the pre-signed URL this what you have to do:
const uploadRes = await fetch(PRESIGNED_URL, {
method: "PUT",
body: file,
headers: {
'x-amz-meta-userr":"userr"
},
});
const uploadRes = await fetch(PRESIGNED_URL, {
method: "PUT",
body: file,
headers: {
'x-amz-meta-userr":"userr"
},
});
yuvraj
yuvrajOP3mo ago
I did add that header previously, but I get 403 http error
yuvraj
yuvrajOP3mo ago
No description
No description
yuvraj
yuvrajOP3mo ago
as soon as I comment that header, it works, but no metadata gets added ok I tested with direct uploads with PutObjectCommands without using presigned urls, and metadata works how do I make it work with presigned urls?
harshil1712
harshil17123mo ago
Hmm, that's interesting. I haven't tried it pre-signed URL yet. Let me try and get back to you
yuvraj
yuvrajOP3mo ago
any updates?
harshil1712
harshil17123mo ago
I tried and running into issues. Asked for some intputs from the team
deletos
deletos2mo ago
i am running into this as well
Flask
Flask2mo ago
I run into the same issue months ago with the AWS SDK on AWS S3 (the product was not Cloudflare R2 but the SDK was the same I think), and after a research I thought the possible issue was about that the headers were not presigned properly. It was common at that moment, not sure if there is any workaround for now when it's necessary to use a presigned url.
deletos
deletos3w ago
any updates for this issue?
harshil1712
harshil17123w ago
I learned that it has to do with the AWS SDK. Some of these SDKs don't work well enough to add Metadata. Alright, so I got something working. I'll upload the code on GitHub soon, but here's what you want to do:
const command = new PutObjectCommand({
Bucket: 'demos',
Key: filename,
ContentType: filetype,
Metadata: {
METADATA: 'John Doe',
},
});
const signedUrl = await getSignedUrl(S3, command, { expiresIn: 3600, unhoistableHeaders: new Set(['x-amz-meta-METADATA']) });

const upload = await fetch(signedUrl, {
method: 'PUT',
body: file,
headers: {
'Content-Type': filetype,
'x-amz-meta-METADATA': 'John Doe',
},
});
const command = new PutObjectCommand({
Bucket: 'demos',
Key: filename,
ContentType: filetype,
Metadata: {
METADATA: 'John Doe',
},
});
const signedUrl = await getSignedUrl(S3, command, { expiresIn: 3600, unhoistableHeaders: new Set(['x-amz-meta-METADATA']) });

const upload = await fetch(signedUrl, {
method: 'PUT',
body: file,
headers: {
'Content-Type': filetype,
'x-amz-meta-METADATA': 'John Doe',
},
});
Replace METADATA with your metadata key.
harshil1712
harshil17123w ago
GitHub
GitHub - harshil1712/r2-pre-signed-upload-metadata: This project de...
This project demonstrates a Cloudflare Worker that handles file uploads to R2 storage using pre-signed URLs with custom metadata. - harshil1712/r2-pre-signed-upload-metadata
deletos
deletos3w ago
this worked. thank you!
Want results from more Discord servers?
Add your server