Delphi-PRAXiS - AI: Gemini Bildgenerierung via html/javascript

Delphi-PRAXiS (https://www.delphipraxis.net/forum.php)

- Programmieren allgemein (https://www.delphipraxis.net/40-programmieren-allgemein/)

- - AI: Gemini Bildgenerierung via html/javascript (https://www.delphipraxis.net/216364-ai-gemini-bildgenerierung-via-html-javascript.html)

AI: Gemini Bildgenerierung via html/javascript

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:

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:

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

AW: AI: Gemini Bildgenerierung via html/javascript

Nutzt du hier TWebbrowser.
Immer mehr Webseiten werden nicht mehr mit diesen abgekündigten Browser laufen.

AW: AI: Gemini Bildgenerierung via html/javascript

Verstehe ich das richtig dass du die Seite "Bildgenerator-Spielerei" bei dir lokal im Browser ausführst? So dass der Browser dann das generierte Bild nachlädt?
Wäre es nicht besser auf das ganze drumrum zu verzichten und den post via REST selber zu machen?
Die Bilder kommen meißt als B64 embedded zurück, das macht keinen Spass das selber aufzudrusseln, soweit kann ich verstehen dass du einen Browser bemühst.
Was passiert wenn du FF oder so mit den Script aufrufst?

AW: AI: Gemini Bildgenerierung via html/javascript

Also Gemini 1.5 flash kann laut Google docs nur text generieren (

https://ai.google.dev/gemini-api/docs/models/gemini).

Dort steht:
Input(s): Audio, images, videos and text
Output: Text

Bei Gemini 2.0 Flash steht:
Inputs(s): Audio, images, videos and text
Output: Text, images (coming soon), and audio (coming soon)

Aber grundsätzlich, auch um text zu generieren:

Nehm erstmal den `Authorization` und den `key`-Header raus. Gemini will den Key wohl als Query-Parameter, und den dann nochmal mehrfach in den Headern mitschicken hilft nicht.

Zweitens sieht der Body falsch aus.
Das sollte in etwa so aussehen:

Code:

			{

  "contents": [{

    "parts": [{"text": "Write a story about a magic unicorn."}]

  }]

}

Da sollte nix mit Model, aspect ratio etc. drin stehen.

Schau Dir am besten mal die Gemini API Dokumentation im Detail an.