Entwickeln einer visionbasierten Chat-App

Um eine Client-App zu entwickeln, die visionsbasierte Chats mit einem multimodalen Modell verwendet, können Sie dieselben grundlegenden Techniken verwenden, die für textbasierte Chats verwendet werden. Sie benötigen eine Verbindung mit dem Endpunkt, an dem das Modell bereitgestellt wird, und Sie verwenden diesen Endpunkt, um Eingabeaufforderungen zu senden, die aus Nachrichten an das Modell bestehen und die Antworten verarbeiten.

Der Hauptunterschied besteht darin, dass Aufforderungen für einen visionbasierten Chat mehrteilige Benutzernachrichten enthalten, die sowohl ein Textinhaltselement als auch ein Bildinhaltselement enthalten.

Senden einer bildbasierten Eingabeaufforderung mithilfe der Antwort-API

Um ein Bild in eine Eingabeaufforderung mithilfe der Antwort-API einzuschließen , geben Sie eine URL für eine webbasierte Bilddatei an, oder laden Sie ein lokales Bild, und codieren Sie seine Daten im Base64-Format, und übermitteln Sie eine URL im Format data:image/jpeg;base64,{image_data} (ersetzen Sie "jpeg" durch "png" pr anderen Formaten entsprechend).

Das folgende Python-Beispiel zeigt, wie Sie ein Bild in einer Eingabeaufforderung mithilfe der Antwort-API übermitteln:

# Read the image data from a local file
image_path = Path("dragon-fruit.jpeg")
image_format = "jpeg"
with open(image_path, "rb") as image_file:
    image_data = base64.b64encode(image_file.read()).decode("utf-8")

data_url = f"data:image/{image_format};base64,{image_data}" # You can also use a web URL

# Send the image data in a prompt to the model
response = client.responses.create(
    model="gpt-4.1",
    input=[
        {"role": "developer", "content": "You are an AI assistant for chefs planning recipes."},
        {"role": "user", "content": [  
            { "type": "input_text", "text": "What desserts could I make with this?"},
            { "type": "input_image", "image_url": data_url}
        ] } 
    ]
)
print(response.output_text)

Senden einer bildbasierten Eingabeaufforderung mithilfe der ChatCompletions-API

Wenn Sie den Azure OpenAI-Endpunkt verwenden, um Aufforderungen an Modelle zu übermitteln, die die Antwort-API nicht unterstützen, können Sie die CatCompletions-API verwenden. So:

# Read the image data from a local file
image_path = Path("orange.jpeg")
image_format = "jpeg"
with open(image_path, "rb") as image_file:
    image_data = base64.b64encode(image_file.read()).decode("utf-8")

data_url = f"data:image/{image_format};base64,{image_data}" # You can also use a web URL

# Send the image data in a prompt to the model
response = client.chat.completions.create(
    model="Phi-4-multimodal-instruct",
    messages=[
        {"role": "system", "content": "You are an AI assistant for chefs planning recipes."},
        { "role": "user", "content": [  
            { "type": "text", "text": "What can I make with this fruit?"},
            { "type": "image_url", "image_url": {"url": data_url}}
        ] }
    ]
)
print(response.choices[0].message.content)