על ידי dezgo | מְעוּדכָּן hace 6 meses | Artificial Intelligence/Machine Learning

9.9 / 10



רמת שירות


חזרה לכל הדיונים

How to display the generated image using React.js?

Rapid account: Vegaslancer 1025
hace 6 meses

Hello, thanks for your reading.
I generated image using text input and get the result successfully.
But I can’t display the result image in img tag.
The getting response is success and now I don’t know how can I process this result and how can I display this result as image.
I checked the response in browser inspect window and the response is good. It seems to look as binary data.
So I want to know about how to display the image using React.js?
Please solve this problem. Best regards.

Rapid account: Davidzuk 94
davidzuk94 Commented hace 6 meses

Hi. i have encountered the same problem and after consulting with chat gpt we came up with this.
hope it will help you

function from the component -

async function getTextToImage() {
try {
const { data, headers } = await textToImage();
if (headers && headers[“content-type”]) {
const blob = new Blob([data], { type: headers[“content-type”] });
const imageSrc = URL.createObjectURL(blob);
} else {
console.error(“Error: Content-Type header is missing or undefined.”);
} catch (error) {
console.error(“Error:”, error);

service function -

export async function textToImage() {
const params = {
“magical dolphin , masterpiece, highly detailed , photorealistic , trending, HQ”,
guidance: 10,
steps: 30,
sampler: “euler_a”,
upscale: 1,
negative_prompt: “face”,
model: “epic_diffusion_1_1”,
try {
const response = await"/api/text2image", params, {
responseType: “arraybuffer”,

return response;

} catch (error) {
return error;

Best of luck

Rapid account: Dezgo
dezgo Commented hace 6 meses

thanks for reaching out and for using the API!

I do not have experience with React.js in particular, but here’s a link that explains how to do it in vanilla JS:

The most common cause could be that the response is interpreted as a string of text, instead of as a binary blob.

Hope this helps!

Best regards

הצטרף לדיון - הוסף תגובה למטה:

התחבר / הירשם כדי לפרסם תגובות חדשות