Unable to upload image asset (as Blob) from NextJS Route Handler #135
Comments
|
Hi there, i am facing the same issue, i am using pdfMake to spill out the blob and sending it as part of the client's upload function throws the same error: Upload failed: Error: Request body must be a string, buffer or stream, got object const invoiceTemplateData = await getInvoiceTemplate(result.invoice.uniqueReferenceNumber);
const invoiceJson = JSON.parse(invoiceTemplateData);
const pdf = pdfMake.createPdf(invoiceJson.data);
pdf.getBlob((blob) => {
createClient.assets
.upload('file', blob, {
filename: `${customer?.name} - ${result.invoice.uniqueReferenceNumber}.pdf`,
title: `${customer?.name} - ${result.invoice.uniqueReferenceNumber}`
}).then((document) => {
console.log('====================================')
console.log('The file was uploaded!', document)
console.log('====================================')
})
.catch((error) => {
console.log('====================================')
console.error('Upload failed:', error)
console.log('====================================')
})
});It says body can contain string, but when i send a string part of the body, it says function can't accept string. Did you manage to solve this? Mind sharing how you solve this problem? Thanks. |
|
I did not solve the problem and I don't think I can. More disappointing is the fact that this issue is open for three weeks already but there was not a single comment yet whether there is any plan to address it. |
|
Hi there, Ya, I also got frustrated, anyhow, I managed to get it work with below approach, not sure if this will help you. I first get the base64 string, since i use pdfMake, i can convert to buffer as below: pdf.getBase64((base64) => {
const bufferValue = Buffer.from(base64, "base64"); // this will get the buffer value, then can be passed to the upload function.
});Below is the file upload function: createClient.assets
.upload('file', bufferValue, {
filename: `${customer?.name} - ${result.invoice.uniqueReferenceNumber}.pdf`,
title: `${customer?.name} - ${result.invoice.uniqueReferenceNumber}`
}).then((file) => {
console.log('====================================')
console.log('The file was uploaded!', file)
console.log('====================================')
})
.catch((error) => {
console.log('====================================')
console.error('Upload failed:', error)
console.log('====================================')
})
});Let me know if it works for you. :) |
|
Hi 👋 |
|
@stipsan thank you for looking into this. Is it something that will be also addressed by the #176 ? |
|
It might be addressed by #176, but I'll guess it probably won't since I can see it's loading the You can test this before #176 lands though by |
|
I'm perplexed, I can't find any 'buffer' reference in here: https://unpkg.com/[email protected]/dist/middleware.browser.cjs or here https://unpkg.com/[email protected]/dist/middleware.browser.cjs 🤔 🤔 Can you show me what line 162 and its surroundings looks like @benderillo ? |
|
Here is an excerpt of contents of the
Here is the version info from yarn.lock |
|
@benderillo yeah I can see a reference to the import Buffer from 'buffer'anywhere in the code we're shipping. Which means there's something happening in the NextJS pipeline that attempts to polyfill |
|
We have shipped #176 https://github.com/sanity-io/client/releases/tag/v5.4.0 and perhaps it's enough to trigger the right behavior in the Edge runtime 🙇 |
|
@am79041 your comment is off-topic. |
|
@benderillo and @am79041: I sense some frustration on both sides in your interaction above here. While we’re trying to figure out what’s going on and hopefully be able to help, I ask you to consider that other folks are reading this thread as well and that kindness goes a long way. Thanks for understanding! |
|
Just a quick update, we're tracking this issue as part of a larger problem in A possible workaround, while we look into this and work on a proper fix, is to use |
When trying to upload an image as Blob using the
client.assets.uploadmethod inside the Nextjs 13 Route Handler, the method throws error:The code is as following:
The route handler file
/app/api/myform/route.tsI checked that the blob is valid and has the proper image file.
I guess the
get-itpackage under the hood always expects Nodejs type of body (not the browser/Web API)There is a duplicate issue submitted for the same problem on
next-sanityrepo sanity-io/next-sanity#348The text was updated successfully, but these errors were encountered: