adrianhajdin / project_ai_mern_image_generation

Build and Deploy a Full Stack MERN AI Image Generation App MidJourney & DALL E Clone
https://jsmastery.pro
1.08k stars 302 forks source link

Error: Failed to fetch when generating an image #16

Open jhaakshita27 opened 1 year ago

jhaakshita27 commented 1 year ago

I can't move onto further steps because of this issue, someone please resolve this..

dalleRoutes.js

import express from 'express'; import * as dotenv from 'dotenv'; import { Configuration, OpenAIApi } from 'openai';

dotenv.config();

const router = express.Router();

const configuration = new Configuration({ apiKey: process.env.OPENAI_API_KEY, });

const openai = new OpenAIApi(configuration);

router.route('/').get((req, res) => { res.send('Hello from DALL-E!' ); });

router.route('/').post(async (req, res) => { try { const { prompt } = req.body;

const aiResponse = await openai.createImage({
  prompt,
  n: 1,
  size: '1024x1024',
  response_format: 'b64_json'
});

const image = aiResponse.data.data[0].b64_json;
res.status(200).json({ photo: image });

} catch (error) { console.error(error); res.status(500).send(error?.response.data.error.message); } });

export default router;

CreatePost.jsx const generateImage = async () => { if (form.prompt) { try { setGeneratingImg(true); const response = await fetch('http://localhost:8080/api/v1/dalle', { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ prompt: form.prompt, }), })

    const data = await response.json();
    setForm({ ...form, photo: `data:image/jpeg;base64,${data.photo}` })
  } catch (error) {
    alert(error);
  } finally {
    setGeneratingImg(false);
  }
} else {
  alert('Please provide proper prompt')
}

}

image

jhaakshita27 commented 1 year ago

Sometimes it's working and sometimes not Why is this happening? How to resolve?

justaskulkarni commented 1 year ago

Even I'm facing the same issue. Were you able to resolve it?

Antonio-Ramon commented 1 year ago

Same here, and I thought was just me, still looking for some way to resolve that

Azzam1503 commented 1 year ago

Instead of alert use console.log(error) in the createPost page then see in detail what the issue is then solve or ask.

lalitkumawat1m commented 1 year ago

I have fixed this issue by create new api key from openai and use it in .env file.

muskan-Bansal commented 1 year ago

I got the same error and created new api key from openai too but this didnt solve my problem

Komal-J04 commented 1 year ago

Same issue...tried using 4 different api keys but doesn't work

jhaakshita27 commented 1 year ago

Keep trying with new API keys, my issue was resolved like this only.

abdul3909 commented 1 year ago

Try reinstalling the nodemon:

For Linux: sudo npm install -g nodemon

For Windows: npm install -g nodemon

Komal-J04 commented 1 year ago

But there's no url in the Home. jsx file..

On Tue, 28 Mar, 2023, 10:01 pm Abdul Basit, @.***> wrote:

My issue was resolved by changing the localhost URL as follows, Change the localhost URL in the client/src/pages/Home.jsx to: " http://localhost:8080/api/v1/post". Change the localhost URL in the client/src/pages/CreatePost.jsx to: " http://localhost:8080/api/v1/dalle"

— Reply to this email directly, view it on GitHub https://github.com/adrianhajdin/project_ai_mern_image_generation/issues/16#issuecomment-1487249917, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXZJXR234RASMNCFP4H7V73W6MG7VANCNFSM6AAAAAAUKMMAVY . You are receiving this because you commented.Message ID: @.*** .com>

abdul3909 commented 1 year ago

But there's no url in the Home. jsx file.. On Tue, 28 Mar, 2023, 10:01 pm Abdul Basit, @.> wrote: My issue was resolved by changing the localhost URL as follows, Change the localhost URL in the client/src/pages/Home.jsx to: " http://localhost:8080/api/v1/post". Change the localhost URL in the client/src/pages/CreatePost.jsx to: " http://localhost:8080/api/v1/dalle" — Reply to this email directly, view it on GitHub <#16 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXZJXR234RASMNCFP4H7V73W6MG7VANCNFSM6AAAAAAUKMMAVY . You are receiving this because you commented.Message ID: @. .com>

There is in the line 29.