Побудуйте клон Chatgpt з Laravel

OpenAI випустила абсолютно новий API, який дозволяє використовувати потужну модель штучного інтелекту, яка також підтримує ChatGPT. Давайте подивимося, як ми можемо використовувати його та створити клон ChatGPT за допомогою Laravel 10. Якщо ви хочете перейти безпосередньо до вихідного коду, ви можете знайти його на GitHub.

Нова модель ШІ називається gpt-3.5-turbo і в 10 разів (!) дешевше найпотужнішої моделі DaVinci, що дивно.

Підказка для цієї моделі працює трохи інакше, так як спрямована на автозавершення «чату». Це означає, що ви не просто надсилаєте простий рядок як підказку, а натомість надсилаєте розмову в чаті, яку модель ШІ потім автоматично завершить.

Ось подивіться на готову версію нашого клону ChatGPT:

Починаючи

Для початку ми збираємося створити нову програму Laravel 10 за допомогою laravel new chatgpt-clone, а потім встановити клієнт OpenAI PHP за допомогою composer require openai-php/laravel.

Наступне, що нам потрібно зробити, це опублікувати файл конфігурації пакета та налаштувати наш ключ OpenAI API.

Щоб опублікувати файл конфігурації, запустіть таку команду:

php artisan vendor:publish --provider="OpenAI\Laravel\ServiceProvider"

Після цього ви можете встановити свій ключ OpenAI API у своєму файлі .env, як це:

OPENAI_API_KEY=sk-...

Створення простого інтерфейсу користувача

Оскільки нам потрібен інтерфейс стилю чату, давайте додамо просте поле введення до нашого файлу welcome.blade.php а також кнопку «Скинути розмову», як і в ChatGPT, щоб скинути поточну розмову. Ми також обертаємо поле введення у форму, яка просто публікується на основному маршруті нашого додатка Laravel.

<form class="p-4 flex space-x-4 justify-center items-center" action="/" method="post">
    @csrf
    <label for="message">Laravel Question:</label>
    <input id="message" type="text" name="message" autocomplete="off" class="border rounded-md  p-2 flex-1" />
    <a class="bg-gray-800 text-white p-2 rounded-md" href="/reset">Reset Conversation</a>
</form>

побудова «підказки»

Як я вже згадував вище, підказка в даному випадку працює трохи інакше. Це поєднання повідомлень, які надходять від користувача, а також відповідей, які ми отримуємо від OpenAI. Це дозволяє нам задавати питання, які посилаються на попередні повідомлення та відповіді.

Новий API чату також дозволяє нам визначити «системне» повідомлення, яке є якоюсь загальною інструкцією для моделі чату, щоб розповісти йому, яким має бути його загальне призначення.

Оскільки ці «повідомлення» повинні з часом зростати, нам потрібно їх десь зберігати. Для цього простого клону ми просто збираємося зберігати повідомлення в сеансі. Як значення за замовчуванням, ми розмістимо там наше "системне" повідомлення:

Route::post('/', function (Request $request) {
    $messages = $request->session()->get('messages', [
        ['role' => 'system', 'content' => 'You are LaravelGPT - A ChatGPT clone. Answer as concisely as possible.']
    ]);
    
    $messages[] = ['role' => 'user', 'content' => $request->input('message')];
    
    // ...
});

Як ви можете бачити, ми також негайно додаємо повідомлення користувача до цього $messages масиву.

Далі ми можемо використовувати цей масив і виконувати запит API.

$response = OpenAI::chat()->create([
    'model' => 'gpt-3.5-turbo',
    'messages' => $messages
]);

Це дасть нам відповідь чату OpenAI, яку ми також хочемо додати до нашого масиву повідомлень.

$messages[] = ['role' => 'assistant', 'content' => $response->choices[0]->message->content];

Зауважте, що цього разу ми додали повідомлення з роллю «помічник» до масиву, щоб вказати, що цей прийшов з API замість користувача.

Тепер наш $messages масив містить усі потрібні нам повідомлення, і ми можемо зберігати їх назад у сеансі та перенаправляти назад.

$request->session()->put('messages', $messages);

return redirect('/');

і... Ось і все! Наступного разу, коли користувач надішле повідомлення, ми збираємося повторно використовувати повідомлення з сеансу та додати до нього нове повідомлення - так само, як це робить ChatGPT.

Завершення інтерфейсу користувача

Оскільки тепер у нас є всі повідомлення (від відповіді OpenAI та від користувача) у сеансі, все, що нам потрібно зробити, це передати їх перегляду та відобразити користувачеві.

Щоб не відображати внутрішнє "системне" повідомлення, ми можемо видалити його з масиву повідомлень, перш ніж передавати його до нашого подання.

Route::get('/', function () {
    $messages = collect(session('messages', []))->reject(fn ($message) => $message['role'] === 'system');

    return view('welcome', [
        'messages' => $messages
    ]);
});

У поданні я зараз просто зациклююся на повідомленнях, надаючи їм інший колір фону залежно від того, чи надходить він від користувача чи від помічника, а потім використовую аналізатор Markdown для вмісту:

@foreach($messages as $message)
    <div class="flex rounded-lg p-4 @if ($message['role'] === 'assistant') bg-green-200 flex-reverse @else bg-blue-200 @endif ">
        <div class="ml-4">
            <div class="text-lg">
                @if ($message['role'] === 'assistant')
                    <a href="#" class="font-medium text-gray-900">LaravelGPT</a>
                @else
                    <a href="#" class="font-medium text-gray-900">You</a>
                @endif
            </div>
            <div class="mt-1">
                <p class="text-gray-600">
                    {!! \Illuminate\Mail\Markdown::parse($message['content']) !!}
                </p>
            </div>
        </div>
    </div>
@endforeach

І це все, що вам потрібно зробити, завдяки новому API OpenAI Chat, щоб самостійно створити клон ChatGPT. Досить запаморочливо, правда?