AI: Gemini Bildgenerierung via html/javascript

**erich.wanker**

Hallo, ich wollte grad ein bisserl rumspielen - schaff es aber nicht ein AI Bild mit "gemini-1.5-flash" zu erstellen..

der Browser meldet 2 Fehler:
Failed to load resource: the server responded with a status of 404 ()Understand this errorAI
Fehler bei der API-Anfrage:

Die HTML-Seite schaut wie folgt aus:

markieren

Code:

			<!DOCTYPE html>

<html lang="de">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Bildgenerator-Spielerei</title>

    <style>

        body {

            font-family: Arial, sans-serif;

            margin: 20px;

        }

        #image {

            margin-top: 20px;

            max-width: 100%;

        }

    </style>

</head>

<body>

    <button onclick="generateImage()">Generieren</button>

    <img id="image" src="" alt="Generiertes Bild">

    <script>

        async function generateImage() {

            const apiKey = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';

            try {

                const response = await fetch(`https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash?key=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx`, {

                    mode: 'no-cors', method: 'POST',

                    headers: {

                        'Content-Type': 'application/json', 

                        'Authorization': `Bearer ${apiKey}`,

                        'key' : 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'

                    },

                    body: JSON.stringify({

                        prompt: "Testbild mit einer Sonneblume",

                        model: 'gemini-1.5-flash',

                        aspect_ratio: '16:9',

                        style: 'photorealistic'

                    }),

                });

                if (response.ok) {

                    const result = await response.json();

                    document.getElementById('image').src = result.image_url;

                } else {

                    console.error('Fehler bei der API-Anfrage:', response.statusText);

                }

            } catch (error) {

                console.error('Fehler bei der Bilderzeugung:', error);

            }

        }

    </script>

</body>

</html>

Mein Api-Schlüssel funktioniert.. wenn ich "händisch" im Browser die Adresse eingebe:

https://generativelanguage.googleapi...1.5-flash?key= xxxxxxxxxxxxxxxxxxxxxxx
bekomme ich:

markieren

Code:

			{

  "name": "models/gemini-1.5-flash",

  "version": "001",

  "displayName": "Gemini 1.5 Flash",

  "description": "Alias that points to the most recent stable version of Gemini 1.5 Flash, our fast and versatile multimodal model for scaling across diverse tasks.",

  "inputTokenLimit": 1000000,

  "outputTokenLimit": 8192,

  "supportedGenerationMethods": [

    "generateContent",

    "countTokens"

  ],

  "temperature": 1,

  "topP": 0.95,

  "topK": 40,

  "maxTemperature": 2

}

Hat wer eine Idee woran es liegen könnte?

LiGrü
Erich

AI: Gemini Bildgenerierung via html/javascript

AI: Gemini Bildgenerierung via html/javascript

Forumregeln