Image File in Variations/Edit Request in Frontend?

General API discussion
1

Hey, new here, and am having some trouble on the developer side, maybe someone can help me?

I’m calling OpenAI APIs in my frontend code using Fetch requests and Kor Connect as a proxy to hide my API Key.

I’ve been having a lot of fun using text and generation endpoints, but now I want to experiment with the variations and editing endpoints for images.

How can I upload a source image (for variations, or mask, for inpainting) from my frontend using an HTML File form? I want to be able to upload an image using the standard HTML file form, then pass the result of that upload as the “image” parameter in the body payload of the fetch request. I keep getting 415 error codes because I can’t figure out what the format should be since I’m not using the OpenAI node package.

Any help would be appreciated!
Thanks in advance!

2

This StackOverflow post was super helpful.

Basically, if I use a FormData object and not include a “Content-Type” header, and put the inputForm.files[0] directly in the formData, then it works well!

I hope this helps someone else with this trouble :slight_smile: