From 1cb74fe61b93c0f503dbb7d0422c50186e89529d Mon Sep 17 00:00:00 2001 From: Dominique Delaire <102873102+nuage365@users.noreply.github.com> Date: Wed, 27 Sep 2023 01:30:44 -0400 Subject: [PATCH 1/5] Create readme.md --- samples/CustomConnecteurOpenAI/readme.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 samples/CustomConnecteurOpenAI/readme.md diff --git a/samples/CustomConnecteurOpenAI/readme.md b/samples/CustomConnecteurOpenAI/readme.md new file mode 100644 index 00000000..8b137891 --- /dev/null +++ b/samples/CustomConnecteurOpenAI/readme.md @@ -0,0 +1 @@ + From 4c030b4565a0497add2701fb8d73f9b95d9dd76d Mon Sep 17 00:00:00 2001 From: Dominique Delaire <102873102+nuage365@users.noreply.github.com> Date: Wed, 27 Sep 2023 01:33:09 -0400 Subject: [PATCH 2/5] =?UTF-8?q?Mise=20=C3=A0=20jour=20de=20la=20doc?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- samples/CustomConnecteurOpenAI/readme.md | 137 +++++++++++++++++++++++ 1 file changed, 137 insertions(+) diff --git a/samples/CustomConnecteurOpenAI/readme.md b/samples/CustomConnecteurOpenAI/readme.md index 8b137891..24c191bd 100644 --- a/samples/CustomConnecteurOpenAI/readme.md +++ b/samples/CustomConnecteurOpenAI/readme.md @@ -1 +1,138 @@ +# Powerapps_ConnecteurCustom_OpenAI +Connecteur personnalisé OpenAI pour applications PowerApps + +Le source est livré si vous ne voulez pas reproduire le mode opératoire plus bas :) +[OpenAi-Connecteur.swagger.json](/OpenAi-Connecteur.swagger.json) + +Pour importer ce connecteur personnalisé dans votre environnement, il suffit d'aller dans la section "Connecteurs personnalisés", puis choisir "Nouveau connecteur personnalisé", puis l'option "Importer un fichier OpenAPI". Puis sélectionner le fichier json. + +![Capture d’écran, le 2023-09-27 à 01 06 47](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/9c9e70d1-ea9e-4093-8f1f-eff853f5521e) + + +## Création Pas à pas du connecteur personnalisé OpenAI pour intégrer des fonctions d'OpenAI dans les applications PowerApps +Dans PowerApps, choisir "Connecteurs personnalisés" et cliquez sur **"Nouveau connecteur personnalisé"**, puis sur "Créer à partir de zéro" +![Capture d’écran, le 2023-09-26 à 14 42 35](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/66aa2f67-feac-4c75-80f3-786b53b900db) + +Lui donner un nom, ici **"OpenAI Connecteur"** + +![Capture d’écran, le 2023-09-26 à 14 43 05](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/b8f22d1e-03c5-4ce0-95cb-d720e40e5624) + +Ensuite, dans l'écran suivant, ajouter un icône pour votre connecteur. Choisir le schéma HTTPS, Puis dans le champ Hôte, indiquer l'adresse principale de notre API qui compose le connecteur. Passez ensuite à l'étape suivante en cliquant sur "Sécurité". +![Capture d’écran, le 2023-09-26 à 16 21 21](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/ce252d6f-5c3f-4048-8849-20fad83e5703) + +Choisir ensuite le type d'authentification. Pour notre Api OpenAI, on utilise une Clé API. +On indique ensuite : +* L'étiquette du paramètre (API Key) +* Le nom du paramètre (Authorization) +* L'emplacement du paramètre (En-tête) +![Capture d’écran, le 2023-09-26 à 20 40 08](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/069191c1-f90d-4885-886e-3822c58536a2) + + +Ensuite on passe à la "Définition" de notre connecteur personnalisé. +On indique : +* Un résumé : OpenAI ChatGPT API +* Un Id de l'opération : dans notre exemple APIChat + +Pour reproduire le comportement de ChatGPT pour notre connecteur, nous allons devoir saisir une demande et nous allons la créer à partir d'un exemple :) + +Cliquer sur "Importer à partir de l'exemple" + +Nous voulons utiliser la méthode "POST" pour pouvoir envoyer une requête à OpenAI dans notre connecteur. Saisir l'url de OpenAI pour lancer une requête comme sur ChatGPT. +Ici : https://api.openai.com/v1/chat/completions + +En-tête : Content-Type application/json + +Dans le corps de la requête : +Le json représentant la requête d'OpenAI. Ici le modèle et le message à envoyer. + +Cliquez sur "Importer" +![Capture d’écran, le 2023-09-26 à 20 52 15](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/616b75bd-5d96-4e63-81a3-55f0e1e1995a) + +Le détail de l'import apparaît sous la Demande. +![Capture d’écran, le 2023-09-26 à 20 53 21](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/9397600b-cf1d-46cb-8508-213a9bf0d41b) + +Cliquez ensuite sur Content-Type puis l'option "Modifier". +![Capture d’écran, le 2023-09-26 à 20 53 57](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/80fc6f2b-996d-4398-ad72-addd11819579) + +On indique la valeur par défaut (application/json), on clique sur "Oui" dans la zone "Est requis ?" et on coche "internal" dans la section Visibilité. + +![Capture d’écran, le 2023-09-26 à 20 54 49](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/0bfbbd9a-480f-495d-8111-558f0b5fb305) + +On fait la même chose dans la demande mais sur le "body". +![Capture d’écran, le 2023-09-26 à 20 55 11](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/53e9a822-a82b-46f4-bd56-82e5de633619) + +On indique que "body" (corps de la requête) est requis (Oui) et la visibilité à "important". + +Ensuite, on va rendre obligatoire les paramètres de notre opération "ApiChat". + +Pour cela, modifier le content, le role et le model : + +![Capture d’écran, le 2023-09-26 à 20 56 49](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/5852971b-9f27-4359-89b6-98cb58e45fbe) + +Dans la description "content", mettre "Est requis ?" à Oui et la visibilité à "Important". +![Capture d’écran, le 2023-09-26 à 20 59 03](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/bc7d3afe-a076-4d67-bc4c-9850d396d75e) + +Faire la même chose pour le role et le model. + +![Capture d’écran, le 2023-09-26 à 21 00 46](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/68de9b5b-5937-410b-8f2f-a8ac478ce449) + +Ensuite, on va tester notre connecteur mais avant il faut lancer la création : Cliquez sur "Créer un connecteur". +![Capture d’écran, le 2023-09-26 à 21 02 40](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/e5798dad-0368-4fb5-8205-f9e6c815b543) + +Puis, pour tester notre connecteur, nous avons besoin de créer une connexion à OpenAI. Pour cela, je vais demander à OpenAi de créer une nouvelle clé pour cette démo :) +![Capture d’écran, le 2023-09-26 à 21 05 09](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/dc3dddae-f9d2-4d49-9511-5f753bfdfd48) + +Dans l'étape de test, ajouter une nouvelle connexion. +![Capture d’écran, le 2023-09-26 à 21 06 20](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/cf52b307-a328-46f6-9556-5cbb6bf89ca9) + +On retrouve ici notre connecteur personnalisé avec notre icône. On indique notre entête qui va nous authentifier auprès de OpenAI avec la clé créée auparavant chez OpenAI. +![Capture d’écran, le 2023-09-26 à 21 07 22](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/40f8ea06-136d-4fae-b321-8d8de3dcc98b) + +Notre connecteur est maintenant connecté :) +![Capture d’écran, le 2023-09-26 à 21 07 37](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/58382c67-ca7a-48d7-af66-ffa390598dad) + +On continue maintenant le test en modifiant notre connecteur. +![Capture d’écran, le 2023-09-26 à 21 10 49](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/60c7f832-1dd7-4af5-8119-a087fbc62c58) + +Après avoir obtenu notre connexion, nous pouvons dans notre opération "ApiChat", indiquer les paramètres que l'on souhaite. +Ici, on va utiliser le modèle gpt turbo de OpenAI, le rôle user et en content une question sur mon Erp préféré :) + +![Capture d’écran, le 2023-09-26 à 21 14 30](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/e94fc92e-fbc9-44d9-85cd-2f1a1535240c) + +Une fois fait, on clique sur le bouton "Opération de test", et on va dans l'onglet "Réponse" pour voir ce qu'à donné notre appel :) +On voit bien dans "content", la réponse à notre question ! +![Capture d’écran, le 2023-09-26 à 21 19 00](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/d1d1135f-048c-438a-a979-1cf3f23174d3) + +On va maintenant capturer les éléments de la réponse pour notre connecteur afin de pouvoir l'utiliser dans une app PowerApp par exemple +Cliquez sur "Default" + +![Capture d’écran, le 2023-09-26 à 21 23 46](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/f92ed059-d801-416a-842c-d4526ed91af2) + +On obtient l'écran suivant : +Puis cliquer sur "Importer à partir de l'exemple" +![Capture d’écran, le 2023-09-26 à 21 24 08](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/c680f62d-bc75-48c7-bbf4-753bba79e910) + +Dans l'écran, dans la section "Corps", copier coller le résultat json de notre réponse (Onglet "Réponse" suite à notre "Opération de test"). + +![Capture d’écran, le 2023-09-26 à 21 25 47](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/b9b358ce-9b4b-425d-9abc-e54d95afa60f) + +Au retour, il affiche tous les éléments du json afin de pouvoir les lire plus tard dans une app PowerApps :) +![Capture d’écran, le 2023-09-26 à 21 27 23](https://github.com/nuage365/Powerapps_ConnecteurCustom_OpenAI/assets/102873102/cd6a574d-14e3-46c0-b44b-8e1258b6b2dc) + +Ne pas oublier de mettre à jour le connecteur en cliquant sur l'option en haut et c'est fini :) + +Pour utiliser ensuite le connecteur il suffit ensuite par exemple de créer une PowerApps de type canvas, +de créer un textinput, un bouton, une galerie extensible en hauteur, etc... +Dans le textinput, l'utilisateur va saisir sa question comme dans ChatGPT. + +Dans PowerFx, sur le "OnSelect" du bouton le code pourrait ressembler à cela : +>Set(varResponse,OpenAiConnecteur.APIChat("gpt-3.5-turbo", Collect(mycollectchat,{role:"user",content:TextInput1.text}))) +>Collect(mycollectionchat,First(varResponse.choices).message); +> +>Reset(TextInput1) + +Ici, on lance donc l'opération APIChat de notre connecteur personnalisé et on va récupérer le premier message de notre requête dans une collection afin d'afficher cela dans notre gallerie :) + + + From 15e363c9cca2ed4af30a273205d5110b37c2835c Mon Sep 17 00:00:00 2001 From: Dominique Delaire <102873102+nuage365@users.noreply.github.com> Date: Wed, 27 Sep 2023 01:33:32 -0400 Subject: [PATCH 3/5] Add files via upload --- .../OpenAi-Connecteur.swagger.json | 172 ++++++++++++++++++ 1 file changed, 172 insertions(+) create mode 100644 samples/CustomConnecteurOpenAI/OpenAi-Connecteur.swagger.json diff --git a/samples/CustomConnecteurOpenAI/OpenAi-Connecteur.swagger.json b/samples/CustomConnecteurOpenAI/OpenAi-Connecteur.swagger.json new file mode 100644 index 00000000..a288599d --- /dev/null +++ b/samples/CustomConnecteurOpenAI/OpenAi-Connecteur.swagger.json @@ -0,0 +1,172 @@ +{ + "swagger": "2.0", + "info": { + "title": "OpenAi Connecteur", + "description": "Connecteur vers l'API OpenAI", + "version": "1.0" + }, + "host": "api.openai.com", + "basePath": "/", + "schemes": [ + "https" + ], + "consumes": [], + "produces": [], + "paths": { + "/v1/chat/completions": { + "post": { + "responses": { + "default": { + "description": "default", + "schema": { + "type": "object", + "properties": { + "id": { + "type": "string", + "description": "id" + }, + "object": { + "type": "string", + "description": "object" + }, + "created": { + "type": "integer", + "format": "int32", + "description": "created" + }, + "model": { + "type": "string", + "description": "model" + }, + "choices": { + "type": "array", + "items": { + "type": "object", + "properties": { + "index": { + "type": "integer", + "format": "int32", + "description": "index" + }, + "message": { + "type": "object", + "properties": { + "role": { + "type": "string", + "description": "role" + }, + "content": { + "type": "string", + "description": "content" + } + }, + "description": "message" + }, + "finish_reason": { + "type": "string", + "description": "finish_reason" + } + } + }, + "description": "choices" + }, + "usage": { + "type": "object", + "properties": { + "prompt_tokens": { + "type": "integer", + "format": "int32", + "description": "prompt_tokens" + }, + "completion_tokens": { + "type": "integer", + "format": "int32", + "description": "completion_tokens" + }, + "total_tokens": { + "type": "integer", + "format": "int32", + "description": "total_tokens" + } + }, + "description": "usage" + } + } + } + } + }, + "summary": "OpenAI ChatGPT API", + "operationId": "APIChat", + "parameters": [ + { + "name": "Content-Type", + "in": "header", + "required": true, + "type": "string", + "default": "application/json", + "x-ms-visibility": "internal" + }, + { + "name": "body", + "in": "body", + "required": true, + "schema": { + "type": "object", + "properties": { + "model": { + "type": "string", + "description": "model", + "title": "", + "x-ms-visibility": "important" + }, + "messages": { + "type": "array", + "items": { + "type": "object", + "properties": { + "role": { + "type": "string", + "description": "role", + "title": "", + "x-ms-visibility": "important" + }, + "content": { + "type": "string", + "description": "content", + "title": "", + "x-ms-visibility": "important" + } + }, + "required": [ + "content", + "role" + ] + }, + "description": "messages" + } + }, + "x-ms-visibility": "important", + "required": [ + "messages", + "model" + ] + }, + "x-ms-visibility": "important" + } + ] + } + } + }, + "definitions": {}, + "parameters": {}, + "responses": {}, + "securityDefinitions": { + "api_key": { + "type": "apiKey", + "in": "header", + "name": "Authorization" + } + }, + "security": [], + "tags": [] +} \ No newline at end of file From 46b760937e3bd7ffda4d41829f83d770dae24d4e Mon Sep 17 00:00:00 2001 From: Dominique Delaire <102873102+nuage365@users.noreply.github.com> Date: Wed, 27 Sep 2023 01:34:37 -0400 Subject: [PATCH 4/5] Update readme.md --- samples/CustomConnecteurOpenAI/readme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/samples/CustomConnecteurOpenAI/readme.md b/samples/CustomConnecteurOpenAI/readme.md index 24c191bd..6fc54e0a 100644 --- a/samples/CustomConnecteurOpenAI/readme.md +++ b/samples/CustomConnecteurOpenAI/readme.md @@ -2,7 +2,7 @@ Connecteur personnalisé OpenAI pour applications PowerApps Le source est livré si vous ne voulez pas reproduire le mode opératoire plus bas :) -[OpenAi-Connecteur.swagger.json](/OpenAi-Connecteur.swagger.json) +[OpenAi-Connecteur.swagger.json](/OpenAi-Connecteur.swagger.json) Pour importer ce connecteur personnalisé dans votre environnement, il suffit d'aller dans la section "Connecteurs personnalisés", puis choisir "Nouveau connecteur personnalisé", puis l'option "Importer un fichier OpenAPI". Puis sélectionner le fichier json. From cee7f4af05625af3b8ac5dc5a3619fa0497f386a Mon Sep 17 00:00:00 2001 From: Dominique Delaire <102873102+nuage365@users.noreply.github.com> Date: Wed, 27 Sep 2023 01:35:23 -0400 Subject: [PATCH 5/5] Update readme.md --- samples/CustomConnecteurOpenAI/readme.md | 1 - 1 file changed, 1 deletion(-) diff --git a/samples/CustomConnecteurOpenAI/readme.md b/samples/CustomConnecteurOpenAI/readme.md index 6fc54e0a..617af9f3 100644 --- a/samples/CustomConnecteurOpenAI/readme.md +++ b/samples/CustomConnecteurOpenAI/readme.md @@ -2,7 +2,6 @@ Connecteur personnalisé OpenAI pour applications PowerApps Le source est livré si vous ne voulez pas reproduire le mode opératoire plus bas :) -[OpenAi-Connecteur.swagger.json](/OpenAi-Connecteur.swagger.json) Pour importer ce connecteur personnalisé dans votre environnement, il suffit d'aller dans la section "Connecteurs personnalisés", puis choisir "Nouveau connecteur personnalisé", puis l'option "Importer un fichier OpenAPI". Puis sélectionner le fichier json.