Power App – Eigene App mit KI AzureOpenAI

Ausgangslage ist eine App (Canvas App) die verbunden mit Auze OpenAI Services die Individuelle Nutzung einer KI für Fragen anbietet, welche im Unternehmen individuelle Einsätze ermöglicht.

Die Umsetzung erfolgt mit nachfolgender Erläuterung.

In Power Apps wird zunächst eine Canvas App erstellt.

Per Eingabe in ein Testeingabe-Steuerelement wird die Frage gestellt. Mit einem Klick auf die Schaltfläche startet ein Power Automate Flow. Dieser ist mit Azure Diensten verbunden, sendet die Frage an den Dienst als http-Anforderung, der Flow empfängt die Antwort und übergibt sie als Variable an die App zurück.

Die Antwort wird nach wenigen Sekunden im Antwort-Bereich darunter zurückgegeben.

Nachfolgend beschreibe ich die Vorgehensweise, um einen solchen Dienst einzurichten und dann mittels Power Apps und Power Automate umzusetzen.

1. Schritt: Azure Konto

Erstelle dir, sofern noch nicht vorhanden, im Azure Portal ein Konto auf:

https://portal.azure.com/

Es wird ein Abonnement erforderlich sein für die Abrechnung. Hierfür kann immer zu Begin der Arbeit auf Azure ein kostenloses Guthaben verbraucht werden (in der Regel 150-190 Euro).

2. Schritt: Ressource erstellen

Um das Konzept umzusetzen, ist es Erforderlich in Azure ein Konto anzulegen, eine Ressource zu erstellen mit dem entsprechenden Dienst.

· Erstelle als nächsten Schritt eine Ressource.

· Die auszuwählende Ressource ist ein „Azure AI Service“

· Nach dem Erstellen der Ressource wird der Azure Open AI Service erstellt

3. Schritt: Modell erstellen und bereitstellen

In diesem Service gilt es ein entsprechendes Modell bereitzustellen. Im vorliegenden Beispiel ist es das gpt 4o mini Modell, da es aus Kostengründen vollkommen ausreichend ist.

Nach dem Modell, folgt die Implementierung des Dienstes in die Power App als Verknüpfung mittels eines Flows.

Hierfür ist es erforderlich die Ziel-URI aus dem Dienst samt Key bereitzuhalten.

4. Schritt: Power Automate Flow

Jetzt kommt der Flow zum Einsatz. Dieser übernimmt die Anfrage aus der App. Nachfolgend die Erläuterung zum Flow.

Die Konfiguration des Flows:

Der Trigger (Auslöser)

Die Eingabe „query“ ist erforderlich, damit der vom Benutzer eingebeben Text (Promt) übergeben werden kann.

Die HTTP- Anfrage

Komponenten und Funktionsweise

1. HTTP-Trigger/Aktion
   • URI: Verbindung zur Azure OpenAI-Instanz mit spezifischem Deployment (gpt-4o-mini) und API-Version (2024-08-01-preview).
   • Methode: POST – sendet Daten zur Verarbeitung an die API.
2. Header
   • Content-Type: application/json: Definiert das Datenformat der Anfrage.
   • api-key: Der Authentifizierungsschlüssel für den API-Zugriff.
     Hinweis: Der Schlüssel sollte in Power Automate als geheime Variable oder über Azure Key Vault gesichert werden, um Sicherheitsrisiken zu vermeiden.
3. Body (JSON-Struktur)
   • Messages:
     • role: system: Startet die Konversation mit einer Systemanweisung („Sie sind KI-Assistent...“).
     • role: user: Platzhalter ([ ] query x) für die Benutzereingabe, die dynamisch in Power Automate ersetzt wird.
   • Parameter zur Antwortsteuerung:
     • temperature: 0.7: Balanciert zwischen Kreativität (höhere Werte) und Fokus (niedrigere Werte).
     • top_p: 0.95: Filtert Token basierend auf kumulativer Wahrscheinlichkeit.
     • max_tokens: 800: Begrenzt die Antwortlänge auf ca. 800 Wörter/Token.

Hier der im Body befindliche Text zum hineinkopieren:

{ "messages": [ { "role": "system", "content": "Sie sind KI-Assistent und helfen Personen, Informationen zu finden." }, { "role": "user", "content": } ], "temperature": 0.7, "top_p": 0.95, "max_tokens": 800 }

Aktion „Verfassen“

Die Funktion in der Aktion:

Hier die Syntax als Text zum hineinkopieren:

first(body('HTTP')?['choices'])?['message']?['content']

Im Einzelnen passiert Folgendes:

1. body('HTTP'): Greift auf den Body (also den Hauptinhalt) der Antwort zu, die vom HTTP-Request zurückkommt.
2. ?['choices']: Geht in der Antwort zum Property „choices“. Das Fragezeichen (?) bedeutet in Power Automate, dass der Zugriff optional ist und bei nicht vorhandenen Daten keinen Fehler verursacht, sondern stattdessen null zurückgibt.
3. first(...): Wendet die first()-Funktion auf das Array an, das unter „choices“ liegt. Damit wird das erste Element aus diesem Array ausgewählt.
4. ?['message']?['content']: Nachdem das erste Element gefunden wurde, greift die Expression auf das Property „message“ und darin auf das Property „content“ zu (wieder mit optionalem Zugriff).

Funktionsweise:

Zusammengefasst holt sich diese Expression also den ersten Eintrag aus dem Feld „choices“ und extrahiert daraus den Inhalt („content“) unterhalb von „message“. Das ist häufig bei API-Antworten von OpenAI oder ähnlichen Services der Fall, wo das Ergebnis unter body('HTTP')?['choices']?[0]?.['message']?.['content'] oder eben mit first() zu finden ist.

Damit kannst du z.B. den generierten Text aus einer KI-Antwort im weiteren Flow verarbeiten oder in einer Variable speichern.

Aktion: Auf eine Power App oder einen Flow reagieren

Diese Aktion speichert die Ausgabe der zuvor ausgeführten Aktion ab und übergibt diese Information als Variable an Power Apps.

5. Schritt: Übergabe der Antwort aus dem Flow und Ausgabe in der App

Die Schaltfläche in der App löst den Flow aus und generiert eine Variable mit der auszugebenden Antwort für den Verwender.

Der Klick auf die Schaltfläche löst den Flow aus:

Abschließend wird die Antwort von der Variable an das darunterliegende Steuerelement übergeben.