This week, I submitted a PR to ChatCraft that set DALL·E 3 generated image's format to Base64
data. Previously, we used a URL format, but it was only viable for an hour due to OpenAI's requirements.
The response_format
parameter
The format in which the generated images are returned. Must be one of
url
orb64_json
. URLs are only valid for 60 minutes after the image has been generated.
Usage examples
Suppose you have an <img>
tag in your component, and the src
attribute is populated from a variable called imgSrc
:
<img src={imgSrc} alt="..." />
We can pass the src
with the Base64 encoded image data rather than url
const imgSrc = "data:image/jpeg;base64,/9j/4AAQSkZJRgAB...";
Now, let's take a look at the API. Here's an example of a url response:
const response = await openai.images.generate({
model: "dall-e-3",
prompt: "a white siamese cat",
n: 1,
size: "1024x1024",
});
const imgSrc = response.data[0].url;
To obtain the response from OpenAI in Base64 format, we can update the code as follows:
const response = await openai.images.generate({
model: "dall-e-3",
prompt: "a white siamese cat",
n: 1,
size: "1024x1024",
response_format: "b64_json",
});
const imgSrc = `data:image/jpeg;base64,${response.data[0].b64_json}`;
I hope you find it helpful. See you in the next post!
Top comments (0)