Bilder in Base64 konvertieren für Vision-API-Anfragen

Warum Vision-APIs Base64 benötigen

Moderne Vision-APIs wie OpenAI GPT-4o, Google Cloud Vision, Anthropic Claude und Qwen-VL akzeptieren Bilder auf zwei Wegen: über eine öffentliche URL, die auf das Bild verweist, oder als Base64-kodierte Zeichenkette, die direkt im JSON-Body der Anfrage eingebettet ist.

Die URL-Methode ist unkompliziert, wenn Ihr Bild bereits online gehostet ist. In vielen praxisnahen Szenarien liegt das Bild jedoch lokal vor: ein gerade gemachter Screenshot, ein eingescanntes Dokument, ein Einzelbild aus einem Video oder ein Testbild aus Ihrer Entwicklungspipeline. Für diese Fälle ist die Base64-Kodierung der richtige Ansatz. Sie ermöglicht es, das Bild direkt in die API-Anfrage einzubetten, ohne es vorher auf einen Server hochladen zu müssen.

Eine typische Vision-API-Anfrage mit Base64 sieht so aus:

{
  "model": "gpt-4o",
  "messages": [
    {
      "role": "user",
      "content": [
        {
          "type": "text",
          "text": "What's in this image?"
        },
        {
          "type": "image_url",
          "image_url": {
            "url": "data:image/png;base64,iVBORw0KGgo..."
          }
        }
      ]
    }
  ]
}

Die Herausforderung besteht darin, von Ihrer lokalen Datei zu diesem Base64-String zu gelangen – insbesondere, wenn Sie den Vorgang während der Entwicklung und beim Testen häufig wiederholen müssen.

Gängige Methoden (und ihre Nachteile)

1. Python-Skript

import base64

with open("screenshot.png", "rb") as f:
    encoded = base64.b64encode(f.read()).decode()
print(encoded)

Funktioniert gut, setzt aber eine Python-Installation voraus. Sie müssen das Skript schreiben (oder finden) und die Ausgabe dann aus dem Terminal kopieren. Bei wiederholtem Testen mit verschiedenen Bildern führen Sie das Skript jedes Mal erneut aus und fügen die Ausgabe manuell in Ihr JSON ein.

2. Kommandozeile

# macOS / Linux
base64 -i screenshot.png | pbcopy

# Windows PowerShell
[Convert]::ToBase64String([IO.File]::ReadAllBytes("screenshot.png")) | Set-Clipboard

Schnell, wenn man die Syntax kennt, aber die Ausgabe ist ein reiner String. Es gibt keine Möglichkeit zur Überprüfung: Ist es das richtige Bild? War die Kodierung korrekt? Das erfahren Sie erst, wenn Sie die API-Anfrage abschicken und das Ergebnis prüfen.

3. Online-Base64-Konverter

Zahlreiche Websites bieten Datei-zu-Base64-Konvertierung per Drag & Drop an. Das offensichtliche Problem: Sie laden Ihre Datei auf einen fremden Server hoch. Für einen Test-Screenshot mag das akzeptabel sein. Für proprietäre Daten, interne Dokumente, medizinische Bilder oder andere NDA-geschützte Inhalte ist es keine Option.

Ein besserer Weg: Einfügen, Vorschau, Kopieren

ViewJSON bietet einen einfacheren Ablauf. Fügen Sie ein Bild direkt in den Editor ein, erhalten Sie sofort den Base64-String – und alles bleibt in Ihrem Browser:

1. ViewJSON öffnen — Besuchen Sie viewjson.net
2. Bild einfügen — Kopieren Sie ein Bild von beliebiger Stelle (Datei-Explorer, Screenshot-Tool, Browser, Design-App) und fügen Sie es mit Strg+V direkt in den JSON-Editor ein
3. Vorschau ansehen — ViewJSON konvertiert das Bild automatisch in Base64 und fügt es als JSON-String-Wert ein. Eine integrierte Vorschau erscheint sofort, damit Sie prüfen können, ob es das richtige Bild ist.
4. Base64 kopieren — Klicken Sie auf die Kopieren-Schaltfläche oder wählen Sie den String-Wert aus. Sie erhalten den vollständigen Base64-String, bereit zum Einfügen in Ihren API-Request-Payload.

Der komplette Ablauf in Aktion:

Umgang mit langen Base64-Strings

Base64-kodierte Bilder können extrem lang sein. Ein einzelnes hochauflösendes JPEG kann über 100 000 Zeichen erzeugen. Um den Editor flüssig zu halten, kürzt ViewJSON die Anzeige langer Strings automatisch. Die Kürzung betrifft jedoch nur die Darstellung.

Wenn Sie einen gekürzten Base64-Wert kopieren, greift ViewJSONs verlustfreie Clipboard-Wiederherstellung. Sie erkennt, dass Sie einen gekürzten String kopieren, und stellt automatisch den vollständigen Originalinhalt in Ihrer Zwischenablage wieder her. Sie erhalten stets den vollständigen, unveränderten Base64-String – niemals eine gekürzte Version, die zu einer beschädigten Datei führen würde.

Den vollständigen API-Payload zusammenstellen

Sobald Sie Ihren Base64-String haben, müssen Sie ihn im richtigen API-Format einbetten. Hier Beispiele für die gängigsten Vision-APIs:

OpenAI GPT-4o Vision

{
  "model": "gpt-4o",
  "messages": [
    {
      "role": "user",
      "content": [
        { "type": "text", "text": "Describe this image" },
        {
          "type": "image_url",
          "image_url": {
            "url": "data:image/png;base64,<IHR_BASE64_HIER>"
          }
        }
      ]
    }
  ],
  "max_tokens": 300
}

Google Cloud Vision

{
  "requests": [
    {
      "image": {
        "content": "<IHR_BASE64_HIER>"
      },
      "features": [
        { "type": "TEXT_DETECTION" }
      ]
    }
  ]
}

Nachdem Sie das Bild in ViewJSON eingefügt haben, kopieren Sie den erzeugten Base64-String und fügen ihn in Ihren API-Request-Payload ein. Sie können auch den API-Anfrage-Builder von ViewJSON verwenden, um URL, Methode, Header und Body zu konfigurieren und die gesamte Anfrage als cURL-Befehl zu exportieren.

Datenschutz: Kein Datei-Upload nötig

Anders als bei Online-Base64-Konvertern funktioniert ViewJSON vollständig in Ihrem Browser. Die Bild-zu-Base64-Konvertierung erfolgt lokal über die integrierte FileReader-API des Browsers. Ihr Bild wird niemals an einen Server gesendet.

Das macht ViewJSON geeignet für die Konvertierung sensibler Bilder: medizinische Scans für KI-Gesundheits-APIs, interne Dokumente für OCR-Dienste, proprietäre Produktbilder für visuelle Suchsysteme oder jede Datei, die Sie keinem Drittanbieter-Konverter anvertrauen würden.

Methodenvergleich