Chapitre 25: Amélioration et Personnalisation du Chatbot

25.1 Introduction

Une fois que vous avez créé un chatbot de base, l'étape suivante consiste à l'améliorer et à le personnaliser pour qu'il réponde mieux aux besoins des utilisateurs et offre une expérience plus engageante et utile. Ce chapitre explore diverses stratégies et techniques pour améliorer et personnaliser votre chatbot basé sur l'API Chat GPT d'OpenAI.

25.2 Suivi de Conversation et Contexte

25.2.1 Conservation de l'Historique des Messages

Pour permettre des interactions plus naturelles et contextuelles, conservez l'historique des messages entre l'utilisateur et le chatbot.

Backend (Express.js) : Modifiez le gestionnaire de requêtes pour inclure l'historique des messages.

let conversationHistory = [];

app.post('/api/chat', async (req, res) => {
  const { prompt } = req.body;

  // Ajouter le nouveau message utilisateur à l'historique
  conversationHistory.push({ role: "user", content: prompt });

  try {
    const response = await openai.createChatCompletion({
      model: "gpt-4",
      messages: conversationHistory,
      max_tokens: 150,
      temperature: 0.7,
    });

    const assistantMessage = response.data.choices[0].message.content.trim();
    conversationHistory.push({ role: "assistant", content: assistantMessage });

    res.json({ message: assistantMessage });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

25.2.2 Gestion de l'Historique

Limitez la longueur de l'historique pour éviter d'atteindre les limites de tokens de l'API.

const MAX_HISTORY = 10; // Nombre maximum de messages à conserver

app.post('/api/chat', async (req, res) => {
  const { prompt } = req.body;

  conversationHistory.push({ role: "user", content: prompt });

  // Limiter l'historique
  if (conversationHistory.length > MAX_HISTORY) {
    conversationHistory = conversationHistory.slice(-MAX_HISTORY);
  }

  try {
    const response = await openai.createChatCompletion({
      model: "gpt-4",
      messages: conversationHistory,
      max_tokens: 150,
      temperature: 0.7,
    });

    const assistantMessage = response.data.choices[0].message.content.trim();
    conversationHistory.push({ role: "assistant", content: assistantMessage });

    res.json({ message: assistantMessage });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

25.3 Personnalisation des Réponses

25.3.1 Ajustement des Paramètres de l'API

Modifiez les paramètres de l'API pour obtenir des réponses plus adaptées à vos besoins.

Temperature : Contrôle la créativité des réponses. Une valeur plus élevée (jusqu'à 1) rend les réponses plus créatives et variées. Max Tokens : Définissez le nombre maximal de tokens pour contrôler la longueur des réponses. Top_p : Utilise la sélection nucleus pour limiter les réponses aux tokens les plus probables.

const response = await openai.createChatCompletion({
  model: "gpt-4",
  messages: conversationHistory,
  max_tokens: 200, // Réponses plus longues
  temperature: 0.5, // Réponses plus cohérentes et moins aléatoires
  top_p: 0.9, // Utilisation de la sélection nucleus
});

25.4 Filtrage et Sécurité des Contenus

25.4.1 Implémentation de Filtres de Contenu

Filtrez les réponses pour éviter les contenus inappropriés ou indésirables.

const containsProhibitedContent = (text) => {
  const prohibitedWords = ["violence", "harassment", "hate", "fraud"];
  return prohibitedWords.some(word => text.includes(word));
}

app.post('/api/chat', async (req, res) => {
  const { prompt } = req.body;

  conversationHistory.push({ role: "user", content: prompt });

  if (conversationHistory.length > MAX_HISTORY) {
    conversationHistory = conversationHistory.slice(-MAX_HISTORY);
  }

  try {
    const response = await openai.createChatCompletion({
      model: "gpt-4",
      messages: conversationHistory,
      max_tokens: 150,
      temperature: 0.7,
    });

    const assistantMessage = response.data.choices[0].message.content.trim();

    if (containsProhibitedContent(assistantMessage)) {
      return res.status(400).json({ error: "Le contenu généré contient des éléments interdits." });
    }

    conversationHistory.push({ role: "assistant", content: assistantMessage });
    res.json({ message: assistantMessage });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

25.5 Personnalisation des Interactions Utilisateur

25.5.1 Utilisation des Contextes Spécifiques

Utilisez des contextes spécifiques pour orienter les réponses du chatbot.

const CONTEXT = "You are a helpful assistant that provides detailed and accurate answers.";

app.post('/api/chat', async (req, res) => {
  const { prompt } = req.body;

  conversationHistory.push({ role: "user", content: prompt });

  if (conversationHistory.length > MAX_HISTORY) {
    conversationHistory = conversationHistory.slice(-MAX_HISTORY);
  }

  const messagesWithContext = [{ role: "system", content: CONTEXT }, ...conversationHistory];

  try {
    const response = await openai.createChatCompletion({
      model: "gpt-4",
      messages: messagesWithContext,
      max_tokens: 150,
      temperature: 0.7,
    });

    const assistantMessage = response.data.choices[0].message.content.trim();
    conversationHistory.push({ role: "assistant", content: assistantMessage });
    res.json({ message: assistantMessage });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

25.5.2 Ajout de Fonctionnalités Spécifiques

Ajoutez des fonctionnalités spécifiques telles que des suggestions automatiques, des recommandations personnalisées, ou des actions automatisées.

const getSuggestions = (input) => {
  // Exemple de logique simple pour générer des suggestions basées sur l'input de l'utilisateur
  const suggestions = [];

  if (input.toLowerCase().includes("weather")) {
    suggestions.push("What's the weather like today?");
    suggestions.push("Will it rain tomorrow?");
    suggestions.push("What's the forecast for this weekend?");
  } else if (input.toLowerCase().includes("news")) {
    suggestions.push("What's the latest news?");
    suggestions.push("Show me technology news.");
    suggestions.push("What's happening in sports?");
  } else if (input.toLowerCase().includes("sports")) {
    suggestions.push("Who won the game last night?");
    suggestions.push("Show me the latest sports scores.");
    suggestions.push("Tell me about upcoming sports events.");
  } else {
    suggestions.push("Tell me a joke.");
    suggestions.push("What's the capital of France?");
    suggestions.push("How do I make a cake?");
  }

  return suggestions;
};


app.post('/api/chat', async (req, res) => {
  const { prompt } = req.body;

  conversationHistory.push({ role: "user", content: prompt });

  if (conversationHistory.length > MAX_HISTORY) {
    conversationHistory = conversationHistory.slice(-MAX_HISTORY);
  }

  const messagesWithContext = [{ role: "system", content: CONTEXT }, ...conversationHistory];

  try {
    const response = await openai.createChatCompletion({
      model: "gpt-4",
      messages: messagesWithContext,
      max_tokens: 150,
      temperature: 0.7,
    });

    const assistantMessage = response.data.choices[0].message.content.trim();
    conversationHistory.push({ role: "assistant", content: assistantMessage });

    const suggestions = getSuggestions(prompt);

    res.json({ message: assistantMessage, suggestions });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

25.6 Personnalisation de l'Interface Utilisateur

25.6.1 Amélioration de l'Interface

Ajoutez des fonctionnalités interactives et améliorez l'interface utilisateur pour rendre le chatbot plus engageant.

Frontend (React) : Ajoutez des éléments interactifs comme des boutons de suggestions.

import React, { useState } from 'react';
import axios from 'axios';
import './App.css';

function App() {
  const [prompt, setPrompt] = useState('');
  const [response, setResponse] = useState('');
  const [suggestions, setSuggestions] = useState([]);

  const handleSubmit = async (e) => {
    e.preventDefault();
    try {
      const res = await axios.post('http://localhost:3001/api/chat', { prompt });
      setResponse(res.data.message);
      setSuggestions(res.data.suggestions || []);
    } catch (error) {
      console.error("Erreur :", error);
    }
  };

  return (
    <div className="App">
      <header className="App-header">
        <h1>GPT Chatbot</h1>
        <form onSubmit={handleSubmit}>
          <textarea
            value={prompt}
            onChange={(e) => setPrompt(e.target.value)}
            placeholder="Posez votre question ici..."
          />
          <button type="submit">Envoyer</button>
        </form>
        <div className="response">
          <h2>Réponse :</h2>
          <p>{response}</p>
        </div>
        <div className="suggestions">
          {suggestions.map((suggestion, index) => (
            <button key={index} onClick={() => setPrompt(suggestion)}>{suggestion}</button>
          ))}
        </div>
      </header>
    </div>
  );
}

export default App;

Conclusion

L'amélioration et la personnalisation d'un chatbot basé sur l'API Chat GPT d'OpenAI permettent de créer une expérience utilisateur plus riche et plus engageante. En conservant l'historique des conversations, en ajustant les paramètres de l'API, en filtrant les contenus, et en personnalisant les interactions et l'interface utilisateur, vous pouvez développer un chatbot qui répond mieux aux besoins spécifiques de vos utilisateurs. Ce chapitre vous a fourni des techniques et des exemples concrets pour améliorer et personnaliser votre chatbot.

Last modified: Monday, 1 July 2024, 9:08 AM