API - POST: Body settings - Help

Kodiak · February 4, 2022, 4:25pm

Hey guys,

I would think this is super simple but been struggling with this for about 1 month now.

See image of postman settings for testing api which is exactly what I need to do in Wappler.

The problem is I cannot figure out for the life of me how to send the POST Api with the file data.

I have tried to convert to base64, tried the custom “API File Upload module” someone recommended but still just at a loss here.

The API guide is here for what I am trying to do but postman should explain it pretty well as it’s super simple.

Any ideas on what I am doing wrong or things to try?

Apple · February 4, 2022, 4:46pm

You try this again

You can use Beeceptor to create a test endpoint, and you post to it from Postman and from the API Action file upload module and compare if the requests are equal

P.S.: Are you a Kodak fan?

Kodiak · February 4, 2022, 7:10pm

Hahah not Kodak KODIAK, my business / brand www.kodiak-wholesale.com

Anyway, I did end up using Beeceptor (great tool btw) and it looks like the request body is the same for both.

I receive this error when running to to the actual Photoroom API however (error in JSON position 1) from my web app (not postman).

{"status":"500","message":"invalid json response body at https://sdk.photoroom.com/v1/segment reason: Unexpected token � in JSON at position 0","stack":"FetchError: invalid json response body at https://sdk.photoroom.com/v1/segment reason: Unexpected token � in JSON at position 0\n    at /Users/robbydiederich/Kodiak POD - MASTER/node_modules/node-fetch/lib/index.js:273:32\n    at processTicksAndRejections (node:internal/process/task_queues:96:5)\n    at async App.exports.APIFileUploadAction (/Users/robbydiederich/Kodiak POD - MASTER/extensions/server_connect/modules/FileUploadModule.js:170:16)\n    at async App._exec (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:485:30)\n    at async App._exec (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:456:17)\n    at async App.exec (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:425:9)\n    at async App.define (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:415:9)"}

Is this 500 response maybe me not taking the response from the API correctly? Each call I run is registering as an API call on the Photoroom API Tracker so they are receiving data.

Apple · February 4, 2022, 7:29pm

Seems like you’re doing everything right, this is probably a bug within that module you’re using for the API request.

Can you show me the response of the API on Postman? I want to see the beginning of the JSON response as well as the response headers. I would bet it’s something related to compression

Edit: Actually, what does the API returns? Is it an image? If yes, the problem is the module is trying to JSON decode the API answer - when in fact it’s not JSON, but an image file

You need to change this line in the module:

return res.json()

To this:

return res.body()

I’m not sure how you’d handle this variable within Wappler, as it’s literally an image stored in a variable (I’ve never worked with this in Wappler, so I can’t guide you here)

Kodiak · February 4, 2022, 7:47pm

Thanks!

Yes POSTMAN returns an image so the console does not have a way to display anything...

I did try to change this as you mentioned but it responds as "is not a function" see response below:

Blockquote You need to change this line in the module:

return res.json()

To this:

return res.body()

{"status":"500","message":"res.body is not a function","stack":"TypeError: res.body is not a function\n    at /Users/robbydiederich/Kodiak POD - MASTER/extensions/server_connect/modules/FileUploadModule.js:178:20\n    at processTicksAndRejections (node:internal/process/task_queues:96:5)\n    at async App.exports.APIFileUploadAction (/Users/robbydiederich/Kodiak POD - MASTER/extensions/server_connect/modules/FileUploadModule.js:170:16)\n    at async App._exec (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:485:30)\n    at async App._exec (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:456:17)\n    at async App.exec (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:425:9)\n    at async App.define (/Users/robbydiederich/Kodiak POD - MASTER/lib/core/app.js:415:9)"}

Not sure if you have any other ideas! Thanks for the help thus far!

@slashash @slashash.dev @slashash.sanjay

Apple · February 4, 2022, 10:22pm

Actually, try res.body instead of res.body()

Happy to help! Thought your username was a misspelled “Kodak”, since you were dealing with a photo API

Kodiak · February 7, 2022, 7:59pm

That deff helped!

I did get a 200 response but getting this response now so not sure how to handle this…

{"testing_module_copy":{"_readableState":{"objectMode":false,"highWaterMark":16384,"buffer":{"head":{"data":{"type":"Buffer","data":[10,72,101,121,32,121,97,33,32,71,114,101,97,116,32,116,111,32,115,101,101,32,121,111,117,32,104,101,114,101,46,32,66,116,119,44,32,110,111,116,104,105,110,103,32,105,115,32,99,111,110,102,105,103,117,114,101,100,32,102,111,114,32,116,104,105,115,32,114,101,113,117,101,115,116,32,112,97,116,104,46,32,67,114,101,97,116,101,32,97,32,114,117,108,101,32,97,110,100,32,115,116,97,114,116,32,98,117,105,108,100,105,110,103,32,97,32,109,111,99,107,32,65,80,73,46,10]},"next":null},"tail":{"data":{"type":"Buffer","data":[10,72,101,121,32,121,97,33,32,71,114,101,97,116,32,116,111,32,115,101,101,32,121,111,117,32,104,101,114,101,46,32,66,116,119,44,32,110,111,116,104,105,110,103,32,105,115,32,99,111,110,102,105,103,117,114,101,100,32,102,111,114,32,116,104,105,115,32,114,101,113,117,101,115,116,32,112,97,116,104,46,32,67,114,101,97,116,101,32,97,32,114,117,108,101,32,97,110,100,32,115,116,97,114,116,32,98,117,105,108,100,105,110,103,32,97,32,109,111,99,107,32,65,80,73,46,10]},"next":null},"length":1},"length":127,"pipes":[],"flowing":null,"ended":true,"endEmitted":false,"reading":false,"constructed":true,"sync":false,"needReadable":false,"emittedReadable":false,"readableListening":false,"resumeScheduled":false,"errorEmitted":false,"emitClose":true,"autoDestroy":true,"destroyed":false,"errored":null,"closed":false,"closeEmitted":false,"defaultEncoding":"utf8","awaitDrainWriters":null,"multiAwaitDrain":false,"readingMore":false,"dataEmitted":false,"decoder":null,"encoding":null},"_events":{},"_eventsCount":2,"_writableState":{"objectMode":false,"highWaterMark":16384,"finalCalled":true,"needDrain":false,"ending":true,"ended":true,"finished":true,"destroyed":false,"decodeStrings":true,"defaultEncoding":"utf8","length":0,"writing":false,"corked":0,"sync":false,"bufferProcessing":false,"writecb":null,"writelen":0,"afterWriteTickInfo":null,"buffered":[],"bufferedIndex":0,"allBuffers":true,"allNoop":true,"pendingcb":0,"constructed":true,"prefinished":true,"errorEmitted":false,"emitClose":true,"autoDestroy":true,"errored":null,"closed":false,"closeEmitted":false},"allowHalfOpen":true}}

Any thoughts

Apple · February 7, 2022, 8:11pm

I can point you to the nearest blog article that fits your situation:

So, instead of res.body, you have to:

    const arrayBuffer = await res.arrayBuffer();
    const buffer = Buffer.from(arrayBuffer);
    const fileType = await FileType.fromBuffer(buffer);
    if (fileType.ext) {
        const outputFileName = `yourfilenamehere.${fileType.ext}`
        fs.createWriteStream(outputFileName).write(buffer);
    } else {
        console.log('File type could not be reliably determined! The binary data may be malformed! No file saved!')
    }

You’ll probably need to play a bit to get the image stored on the location you want to store it

You can use ../ to go to a previous directory, e.g.:

const outputFileName = `../yourfilenamehere.${fileType.ext}`
const outputFileName = `../../public/yourfilenamehere.${fileType.ext}`

Kodiak · February 7, 2022, 8:29pm

Great thanks for the insights!

I’ll play around and see.

Yeah upon some further research I stumbled across this buffer deal and am diving in.

Once i get this thing all solved I’ll post how I did it so others hopefully don’t struggle as much as I did!

Kodiak · February 9, 2022, 2:18am

It looks like that buffer was not the response from the API (as far as I can tell)

Going to create a new thread looking for Paid help on this one as I’ve spent more than 20 hours trying to figure a way to make this work and it’s not worth banging my head against the wall!

Thanks for your help! @Apple

kryo91 · March 18, 2022, 8:08am

Hello Did you manage to display the results returned from the API?