Jak zaimplementować chatbota OpenAI na stronie internetowej?

Chcesz wdrożyć chatbota OpenAI na swojej stronie internetowej, ale nie chcesz korzystać z Composera? W tym artykule pokażemy Ci, jak to zrobić krok po kroku, wykorzystując PHP oraz API OpenAI.

1. Instalacja chatbota bez Composera

Aby skomunikować się z OpenAI, możesz użyć funkcji curl w PHP.

Plik bot.php

    <?php
    $api_key = "TWÓJ_OPENAI_API_KEY";
    
    if ($_SERVER["REQUEST_METHOD"] == "POST") {
        $userMessage = $_POST["message"];
    
        $data = [
            "model" => "gpt-3.5-turbo",
            "messages" => [["role" => "user", "content" => $userMessage]],
            "max_tokens" => 50
        ];
    
        $ch = curl_init("https://api.openai.com/v1/chat/completions");
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($ch, CURLOPT_POST, true);
        curl_setopt($ch, CURLOPT_HTTPHEADER, [
            "Content-Type: application/json",
            "Authorization: Bearer " . $api_key
        ]);
        curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));
    
        $response = curl_exec($ch);
        curl_close($ch);
    
        $response_data = json_decode($response, true);
        echo $response_data["choices"][0]["message"]["content"] ?? "Brak odpowiedzi od AI.";
    }
    ?>
    

Plik index.html

Prosty interfejs użytkownika dla chatbota.

    <div id="chatbox"></div>
    <input type="text" id="inputBox" placeholder="Napisz wiadomość...">
    
    <script>
        document.getElementById("inputBox").addEventListener("keypress", function(event) {
            if (event.key === "Enter") {
                let userMessage = this.value;
                this.value = "";
                
                let chatbox = document.getElementById("chatbox");
                chatbox.innerHTML += "<div><strong>Ty:</strong> " + userMessage + "</div>";
                
                fetch("bot.php", {
                    method: "POST",
                    body: new URLSearchParams({message: userMessage}),
                    headers: {"Content-Type": "application/x-www-form-urlencoded"}
                })
                .then(response => response.text())
                .then(botReply => {
                    chatbox.innerHTML += "<div><strong>Bot:</strong> " + botReply + "</div>";
                    chatbox.scrollTop = chatbox.scrollHeight;
                });
            }
        });
    </script>
    

2. Jak nauczyć chatbota treści z naszej strony?

Jeśli chcesz, aby chatbot znał treści z Twojej strony, masz kilka opcji:

• Przekazywanie treści w zapytaniu – pobierasz stronę i wysyłasz jej fragment jako kontekst do OpenAI.
• Baza wiedzy w MySQL – przechowujesz pytania i odpowiedzi w bazie danych.
• Przeszukiwanie plików tekstowych – chatbot szuka odpowiedzi w lokalnych plikach.

Przykładowe pobranie treści strony w PHP:

    $content = file_get_contents("https://twojastrona.pl/o-nas.html");
    $prompt = "Informacje:
    " . substr($content, 0, 2000) . "\nPytanie: " . $userMessage;
    

Pełny kod znajdziesz w artykule powyżej.

Podsumowanie

Teraz wiesz, jak wdrożyć chatbota OpenAI na swojej stronie bez Composera oraz jak nauczyć go treści ze swojej witryny. Możesz dostosować metodę do swoich potrzeb – prosta integracja API, baza danych lub pliki tekstowe.