Tutorial 04 Aug 2026 29 Kali Dibaca

Cara Membuat Chatbot AI Laravel Menggunakan OpenAI API

Gugun Nurdiansyah
Penulis
Cara Membuat Chatbot AI Laravel Menggunakan OpenAI API

Perkembangan Artificial Intelligence membuat chatbot tidak lagi terbatas pada jawaban yang sudah ditentukan secara manual.

Chatbot berbasis AI dapat memahami pertanyaan pengguna dalam bahasa sehari-hari, menghasilkan jawaban berdasarkan konteks percakapan, merangkum informasi, membantu pencarian produk, dan memberikan respons yang lebih fleksibel.

Bagi developer Laravel, fitur chatbot AI dapat ditambahkan ke dalam:

  • Website perusahaan

  • Aplikasi customer service

  • Sistem informasi klinik

  • Aplikasi kasir

  • Sistem inventory

  • Platform e-commerce

  • Aplikasi SaaS

  • Portal pelanggan

  • Sistem internal perusahaan

  • Learning Management System

Salah satu cara membuatnya adalah dengan menghubungkan aplikasi Laravel ke OpenAI API.

OpenAI menyediakan Responses API untuk mengirim input kepada model dan menerima teks yang dihasilkan. Parameter instructions dapat digunakan untuk mengatur perilaku chatbot, sedangkan input digunakan untuk mengirim pertanyaan atau isi percakapan.

Apa Itu Chatbot AI?

Chatbot AI adalah aplikasi yang menggunakan kecerdasan buatan untuk memahami input pengguna dan menghasilkan jawaban secara otomatis.

Berbeda dengan chatbot berbasis aturan, chatbot AI tidak hanya mencari jawaban dari pilihan yang telah disiapkan.

Chatbot AI dapat digunakan untuk:

  • Menjawab pertanyaan umum

  • Memberikan informasi produk

  • Membantu pelanggan memilih layanan

  • Menjelaskan cara menggunakan aplikasi

  • Membuat ringkasan

  • Mengubah gaya penulisan

  • Membantu pencarian informasi

  • Mengumpulkan kebutuhan pelanggan

  • Menyusun respons customer service

  • Membantu pekerjaan administratif

Walaupun demikian, jawaban model tetap perlu dibatasi menggunakan instruksi, validasi, data pendukung, dan aturan aplikasi.

Bagaimana Cara Kerja Chatbot AI Laravel?

Alur sederhana chatbot AI menggunakan Laravel adalah sebagai berikut:

  1. Pengguna menulis pesan pada halaman chat.

  2. Browser mengirim pesan ke route Laravel.

  3. Controller melakukan validasi input.

  4. Laravel mengirim request ke OpenAI API.

  5. Model memproses pertanyaan pengguna.

  6. OpenAI API mengembalikan respons.

  7. Laravel mengambil teks jawaban.

  8. Jawaban ditampilkan pada halaman chatbot.

  9. Riwayat atau ID percakapan disimpan apabila diperlukan.

API key tidak boleh diletakkan pada JavaScript, browser, atau aplikasi mobile. Request sebaiknya dikirim melalui backend Laravel agar API key tetap berada di server. OpenAI juga merekomendasikan penggunaan environment variable dan melarang penyimpanan key secara langsung di source code.

Persiapan Membuat Chatbot Laravel

Sebelum memulai, siapkan beberapa komponen berikut:

  • Project Laravel

  • PHP dan Composer

  • Database apabila percakapan akan disimpan

  • Akun OpenAI API

  • OpenAI API key

  • Koneksi internet dari server

  • Halaman frontend untuk chatbot

Struktur yang akan dibuat:

app/
├── Http/
│   └── Controllers/
│       └── ChatController.php
└── Services/
    └── OpenAIChatService.php

resources/
└── views/
    └── chat/
        └── index.blade.php

config/
└── services.php

1. Membuat Project Laravel

Buat project Laravel melalui terminal:

composer create-project laravel/laravel chatbot-ai
cd chatbot-ai

Jalankan development server:

php artisan serve

Aplikasi biasanya dapat diakses melalui:

http://127.0.0.1:8000

2. Menambahkan OpenAI API Key

Tambahkan API key ke dalam file .env:

OPENAI_API_KEY=masukkan_api_key_anda
OPENAI_MODEL=gpt-5.6

Contoh ini menggunakan model gpt-5.6, sesuai contoh pada dokumentasi OpenAI saat artikel ini disusun. Nama model dapat diubah melalui konfigurasi apabila aplikasi memerlukan model yang berbeda.

Jangan menulis API key seperti berikut di dalam controller:

$apiKey = 'sk-api-key-asli';

API key yang ditulis langsung di source code dapat ikut masuk ke repository atau terbaca oleh pihak yang tidak berwenang.

Pastikan file .env tercantum pada .gitignore:

.env

Laravel menggunakan file konfigurasi dan environment variable untuk menyimpan nilai yang berbeda pada setiap lingkungan aplikasi. Nilai dari .env sebaiknya dipanggil melalui file dalam direktori config, terutama ketika aplikasi menggunakan configuration cache.

3. Menambahkan Konfigurasi OpenAI

Buka file:

config/services.php

Tambahkan konfigurasi berikut:

'openai' => [
    'api_key' => env('OPENAI_API_KEY'),
    'model' => env('OPENAI_MODEL', 'gpt-5.6'),
    'base_url' => env(
        'OPENAI_BASE_URL',
        'https://api.openai.com/v1'
    ),
],

Setelah mengubah .env pada server produksi, bersihkan dan bangun ulang configuration cache:

php artisan config:clear
php artisan config:cache

4. Membuat OpenAI Chat Service

Agar controller tetap rapi, proses komunikasi dengan OpenAI API sebaiknya ditempatkan pada service khusus.

Buat folder dan file berikut:

app/Services/OpenAIChatService.php

Isi file:

<?php

namespace App\Services;

use Illuminate\Http\Client\ConnectionException;
use Illuminate\Http\Client\Response;
use Illuminate\Support\Collection;
use Illuminate\Support\Facades\Http;
use RuntimeException;

class OpenAIChatService
{
    /**
     * Mengirim pesan pengguna ke OpenAI Responses API.
     *
     * @return array{
     *     response_id: string|null,
     *     answer: string,
     *     usage: array<string, mixed>
     * }
     */
    public function send(
        string $message,
        ?string $previousResponseId = null
    ): array {
        $apiKey = config('services.openai.api_key');
        $model = config('services.openai.model');

        if (! is_string($apiKey) || $apiKey === '') {
            throw new RuntimeException(
                'OPENAI_API_KEY belum dikonfigurasi.'
            );
        }

        $payload = [
            'model' => $model,
            'instructions' => $this->instructions(),
            'input' => [
                [
                    'role' => 'user',
                    'content' => $message,
                ],
            ],
            'store' => true,
        ];

        if ($previousResponseId !== null) {
            $payload['previous_response_id'] = $previousResponseId;
        }

        try {
            $response = Http::baseUrl(
                config('services.openai.base_url')
            )
                ->withToken($apiKey)
                ->acceptJson()
                ->asJson()
                ->connectTimeout(10)
                ->timeout(60)
                ->retry(3, 500, throw: false)
                ->post('/responses', $payload);
        } catch (ConnectionException $exception) {
            report($exception);

            throw new RuntimeException(
                'Tidak dapat terhubung ke layanan AI.'
            );
        }

        $this->ensureRequestWasSuccessful($response);

        $answer = $this->extractOutputText(
            collect($response->json('output', []))
        );

        if ($answer === '') {
            throw new RuntimeException(
                'Model tidak menghasilkan jawaban teks.'
            );
        }

        return [
            'response_id' => $response->json('id'),
            'answer' => $answer,
            'usage' => $response->json('usage', []),
        ];
    }

    private function instructions(): string
    {
        return <<<'PROMPT'
Anda adalah asisten virtual untuk website perusahaan.

Gunakan bahasa Indonesia yang profesional, ramah, dan mudah dipahami.
Berikan jawaban yang ringkas tetapi tetap informatif.
Jangan mengarang harga, kebijakan, stok, atau informasi perusahaan.
Jika informasi tidak tersedia, katakan bahwa informasi tersebut perlu dikonfirmasi.
Jangan meminta password, PIN, OTP, atau data kartu pembayaran pengguna.
PROMPT;
    }

    private function ensureRequestWasSuccessful(
        Response $response
    ): void {
        if ($response->successful()) {
            return;
        }

        $message = $response->json(
            'error.message',
            'Permintaan ke OpenAI API gagal.'
        );

        logger()->error('OpenAI API request failed', [
            'status' => $response->status(),
            'error_type' => $response->json('error.type'),
            'error_code' => $response->json('error.code'),
        ]);

        throw new RuntimeException($message);
    }

    private function extractOutputText(
        Collection $output
    ): string {
        return $output
            ->where('type', 'message')
            ->flatMap(function (array $item): array {
                return $item['content'] ?? [];
            })
            ->where('type', 'output_text')
            ->pluck('text')
            ->filter()
            ->implode("\n");
    }
}

Laravel menyediakan HTTP client untuk melakukan request ke layanan eksternal. HTTP client tersebut mendukung bearer token, timeout, connection timeout, dan percobaan ulang request.

Endpoint yang digunakan pada service tersebut adalah:

POST https://api.openai.com/v1/responses

Payload utamanya terdiri dari:

{
    "model": "gpt-5.6",
    "instructions": "Instruksi perilaku chatbot",
    "input": [
        {
            "role": "user",
            "content": "Pesan pengguna"
        }
    ]
}

OpenAI mengingatkan bahwa properti output dapat memiliki lebih dari satu item, termasuk message atau pemanggilan tool. Karena itu, aplikasi tidak sebaiknya langsung mengasumsikan bahwa teks selalu berada pada output[0].content[0].text. Service di atas mencari seluruh konten dengan tipe output_text agar pemrosesan respons lebih aman.

5. Membuat Chat Controller

Buat controller:

php artisan make:controller ChatController

Buka file:

app/Http/Controllers/ChatController.php

Isi dengan kode berikut:

<?php

namespace App\Http\Controllers;

use App\Services\OpenAIChatService;
use Illuminate\Http\JsonResponse;
use Illuminate\Http\Request;
use Illuminate\View\View;
use RuntimeException;
use Throwable;

class ChatController extends Controller
{
    public function index(Request $request): View
    {
        return view('chat.index', [
            'messages' => $request->session()->get(
                'chat_messages',
                []
            ),
        ]);
    }

    public function send(
        Request $request,
        OpenAIChatService $chatService
    ): JsonResponse {
        $validated = $request->validate([
            'message' => [
                'required',
                'string',
                'min:2',
                'max:4000',
            ],
        ]);

        try {
            $result = $chatService->send(
                message: $validated['message'],
                previousResponseId: $request->session()->get(
                    'openai_previous_response_id'
                ),
            );

            $messages = $request->session()->get(
                'chat_messages',
                []
            );

            $messages[] = [
                'role' => 'user',
                'content' => $validated['message'],
            ];

            $messages[] = [
                'role' => 'assistant',
                'content' => $result['answer'],
            ];

            /*
             * Batasi jumlah pesan yang disimpan dalam session
             * agar session tidak terus bertambah.
             */
            $request->session()->put(
                'chat_messages',
                array_slice($messages, -20)
            );

            $request->session()->put(
                'openai_previous_response_id',
                $result['response_id']
            );

            return response()->json([
                'success' => true,
                'answer' => $result['answer'],
            ]);
        } catch (RuntimeException $exception) {
            report($exception);

            return response()->json([
                'success' => false,
                'message' => $exception->getMessage(),
            ], 422);
        } catch (Throwable $exception) {
            report($exception);

            return response()->json([
                'success' => false,
                'message' => 'Terjadi kesalahan pada layanan chatbot.',
            ], 500);
        }
    }

    public function reset(Request $request): JsonResponse
    {
        $request->session()->forget([
            'chat_messages',
            'openai_previous_response_id',
        ]);

        return response()->json([
            'success' => true,
            'message' => 'Percakapan berhasil dihapus.',
        ]);
    }
}

Controller tersebut menjalankan beberapa proses:

  • Memvalidasi pesan pengguna

  • Mengambil ID respons sebelumnya

  • Mengirim pesan ke service

  • Menyimpan riwayat percakapan dalam session

  • Menyimpan ID respons terbaru

  • Mengembalikan jawaban dalam bentuk JSON

  • Menangani kegagalan request

6. Menjaga Konteks Percakapan

Chatbot membutuhkan konteks agar dapat memahami pesan lanjutan.

Contoh percakapan:

Pengguna: Saya mencari aplikasi kasir.

AI: Aplikasi kasir dapat membantu mengelola transaksi dan stok.

Pengguna: Apakah bisa untuk tiga cabang?

Pada pesan terakhir, model perlu memahami bahwa kata “bisa” merujuk pada aplikasi kasir yang dibicarakan sebelumnya.

Responses API menyediakan parameter previous_response_id untuk melanjutkan percakapan berdasarkan respons sebelumnya. Aplikasi dapat menyimpan ID tersebut pada session atau database, kemudian mengirimkannya pada pesan berikutnya.

Contoh payload pesan lanjutan:

{
    "model": "gpt-5.6",
    "previous_response_id": "resp_xxxxxxxxx",
    "instructions": "Jawab sebagai asisten perusahaan.",
    "input": [
        {
            "role": "user",
            "content": "Apakah bisa untuk tiga cabang?"
        }
    ]
}

Instruksi tetap dikirim pada setiap request agar perilaku chatbot tetap konsisten.

OpenAI menjelaskan bahwa objek respons disimpan selama periode tertentu secara default dan penyimpanan dapat dinonaktifkan menggunakan store: false. Pilihan penyimpanan harus disesuaikan dengan kebutuhan privasi, kebijakan perusahaan, dan jenis informasi yang diproses.

7. Membuat Route Chatbot

Buka file:

routes/web.php

Tambahkan route:

<?php

use App\Http\Controllers\ChatController;
use Illuminate\Support\Facades\Route;

Route::get('/chatbot', [ChatController::class, 'index'])
    ->name('chat.index');

Route::post('/chatbot/send', [ChatController::class, 'send'])
    ->middleware('throttle:20,1')
    ->name('chat.send');

Route::delete('/chatbot/reset', [
    ChatController::class,
    'reset',
])
    ->name('chat.reset');

Middleware berikut membatasi jumlah request:

->middleware('throttle:20,1')

Artinya, endpoint dapat dibatasi hingga sekitar 20 request dalam satu menit untuk setiap identitas yang dikenali oleh rate limiter.

Laravel menyediakan rate limiting yang bekerja bersama sistem cache untuk membatasi tindakan dalam periode tertentu. Pembatasan penting untuk mengurangi spam, request berulang, dan penggunaan biaya API yang tidak terkendali.

Untuk chatbot khusus pelanggan atau karyawan, tambahkan middleware autentikasi:

Route::middleware(['auth'])->group(function () {
    Route::get('/chatbot', [
        ChatController::class,
        'index',
    ])->name('chat.index');

    Route::post('/chatbot/send', [
        ChatController::class,
        'send',
    ])
        ->middleware('throttle:20,1')
        ->name('chat.send');
});

8. Membuat Tampilan Chatbot

Buat file:

resources/views/chat/index.blade.php

Isi dengan tampilan sederhana berikut:

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta
        name="viewport"
        content="width=device-width, initial-scale=1.0"
    >

    <meta
        name="csrf-token"
        content="{{ csrf_token() }}"
    >

    <title>Chatbot AI Laravel</title>

    <style>
        * {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            padding: 24px;
            background: #f3f4f6;
            font-family: Arial, sans-serif;
        }

        .chat-container {
            width: 100%;
            max-width: 760px;
            margin: 0 auto;
            background: #ffffff;
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
        }

        .chat-header {
            padding: 20px;
            border-bottom: 1px solid #e5e7eb;
        }

        .chat-header h1 {
            margin: 0 0 6px;
            font-size: 22px;
        }

        .chat-header p {
            margin: 0;
            color: #6b7280;
            font-size: 14px;
        }

        .chat-messages {
            height: 520px;
            padding: 20px;
            overflow-y: auto;
            background: #f9fafb;
        }

        .message {
            display: flex;
            margin-bottom: 14px;
        }

        .message.user {
            justify-content: flex-end;
        }

        .bubble {
            max-width: 80%;
            padding: 12px 14px;
            border-radius: 14px;
            line-height: 1.55;
            white-space: pre-wrap;
        }

        .message.user .bubble {
            color: #ffffff;
            background: #111827;
            border-bottom-right-radius: 4px;
        }

        .message.assistant .bubble {
            color: #111827;
            background: #ffffff;
            border: 1px solid #e5e7eb;
            border-bottom-left-radius: 4px;
        }

        .chat-form {
            display: flex;
            gap: 10px;
            padding: 16px;
            border-top: 1px solid #e5e7eb;
        }

        .chat-form textarea {
            width: 100%;
            min-height: 48px;
            max-height: 130px;
            padding: 12px;
            resize: vertical;
            border: 1px solid #d1d5db;
            border-radius: 10px;
        }

        .chat-form button {
            min-width: 100px;
            border: 0;
            border-radius: 10px;
            color: #ffffff;
            background: #111827;
            cursor: pointer;
        }

        .chat-form button:disabled {
            opacity: .6;
            cursor: not-allowed;
        }

        .chat-actions {
            padding: 0 16px 16px;
            text-align: right;
        }

        .reset-button {
            border: 0;
            color: #b91c1c;
            background: transparent;
            cursor: pointer;
        }
    </style>
</head>

<body>
    <main class="chat-container">
        <header class="chat-header">
            <h1>Asisten AI</h1>
            <p>
                Silakan tanyakan informasi yang Anda butuhkan.
            </p>
        </header>

        <section
            id="chatMessages"
            class="chat-messages"
            aria-live="polite"
        >
            @forelse ($messages as $message)
                <div class="message {{ $message['role'] }}">
                    <div class="bubble">
                        {{ $message['content'] }}
                    </div>
                </div>
            @empty
                <div class="message assistant">
                    <div class="bubble">
                        Halo, ada yang bisa saya bantu?
                    </div>
                </div>
            @endforelse
        </section>

        <form id="chatForm" class="chat-form">
            <textarea
                id="messageInput"
                name="message"
                maxlength="4000"
                placeholder="Tulis pertanyaan Anda..."
                required
            ></textarea>

            <button id="sendButton" type="submit">
                Kirim
            </button>
        </form>

        <div class="chat-actions">
            <button
                id="resetButton"
                type="button"
                class="reset-button"
            >
                Hapus percakapan
            </button>
        </div>
    </main>

    <script>
        const chatForm = document.getElementById('chatForm');
        const chatMessages = document.getElementById('chatMessages');
        const messageInput = document.getElementById('messageInput');
        const sendButton = document.getElementById('sendButton');
        const resetButton = document.getElementById('resetButton');
        const csrfToken = document
            .querySelector('meta[name="csrf-token"]')
            .getAttribute('content');

        function addMessage(role, content) {
            const wrapper = document.createElement('div');
            const bubble = document.createElement('div');

            wrapper.className = `message ${role}`;
            bubble.className = 'bubble';

            /*
             * Gunakan textContent, bukan innerHTML,
             * agar respons tidak dijalankan sebagai HTML.
             */
            bubble.textContent = content;

            wrapper.appendChild(bubble);
            chatMessages.appendChild(wrapper);

            chatMessages.scrollTop = chatMessages.scrollHeight;

            return wrapper;
        }

        chatForm.addEventListener('submit', async (event) => {
            event.preventDefault();

            const message = messageInput.value.trim();

            if (!message) {
                return;
            }

            addMessage('user', message);

            messageInput.value = '';
            sendButton.disabled = true;
            sendButton.textContent = 'Menunggu...';

            const loadingMessage = addMessage(
                'assistant',
                'Sedang menyiapkan jawaban...'
            );

            try {
                const response = await fetch(
                    '{{ route('chat.send') }}',
                    {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'Accept': 'application/json',
                            'X-CSRF-TOKEN': csrfToken,
                        },
                        body: JSON.stringify({ message }),
                    }
                );

                const data = await response.json();

                if (!response.ok || !data.success) {
                    throw new Error(
                        data.message || 'Chatbot gagal menjawab.'
                    );
                }

                loadingMessage
                    .querySelector('.bubble')
                    .textContent = data.answer;
            } catch (error) {
                loadingMessage
                    .querySelector('.bubble')
                    .textContent = error.message;
            } finally {
                sendButton.disabled = false;
                sendButton.textContent = 'Kirim';
                messageInput.focus();
            }
        });

        resetButton.addEventListener('click', async () => {
            const confirmed = window.confirm(
                'Hapus seluruh percakapan?'
            );

            if (!confirmed) {
                return;
            }

            const response = await fetch(
                '{{ route('chat.reset') }}',
                {
                    method: 'DELETE',
                    headers: {
                        'Accept': 'application/json',
                        'X-CSRF-TOKEN': csrfToken,
                    },
                }
            );

            if (response.ok) {
                window.location.reload();
            }
        });

        chatMessages.scrollTop = chatMessages.scrollHeight;
    </script>
</body>
</html>

Pada bagian JavaScript, jawaban chatbot dimasukkan menggunakan:

bubble.textContent = content;

Penggunaan textContent membantu mencegah respons model diperlakukan sebagai HTML yang dapat dijalankan oleh browser.

9. Menguji Chatbot

Jalankan Laravel:

php artisan serve

Buka halaman:

http://127.0.0.1:8000/chatbot

Coba masukkan pertanyaan:

Apa manfaat aplikasi kasir untuk toko kecil?

Apabila konfigurasi berhasil, Laravel akan:

  1. Menerima pertanyaan pengguna.

  2. Mengirim request ke OpenAI API.

  3. Mengambil teks jawaban.

  4. Menampilkan jawaban pada halaman chatbot.

  5. Menyimpan ID respons untuk percakapan berikutnya.

10. Menyimpan Riwayat Chat ke Database

Session cocok untuk contoh sederhana. Untuk aplikasi produksi, percakapan sebaiknya disimpan dalam database agar dapat:

  • Dibuka kembali oleh pengguna

  • Dikelola oleh customer service

  • Digunakan pada banyak perangkat

  • Dipisahkan berdasarkan pelanggan

  • Diberi status aktif atau selesai

  • Dianalisis untuk meningkatkan pelayanan

Buat model conversation:

php artisan make:model Conversation -m
php artisan make:model ChatMessage -m

Contoh migration conversations:

Schema::create('conversations', function ($table) {
    $table->id();
    $table->foreignId('user_id')
        ->nullable()
        ->constrained()
        ->nullOnDelete();

    $table->string('title')->nullable();
    $table->string('openai_response_id')->nullable();
    $table->string('status')->default('active');
    $table->timestamps();
});

Contoh migration chat_messages:

Schema::create('chat_messages', function ($table) {
    $table->id();
    $table->foreignId('conversation_id')
        ->constrained()
        ->cascadeOnDelete();

    $table->string('role');
    $table->longText('content');
    $table->json('usage')->nullable();
    $table->timestamps();

    $table->index([
        'conversation_id',
        'created_at',
    ]);
});

Nilai role dapat berisi:

  • user

  • assistant

Apabila sistem menggunakan SaaS multi-tenant, tambahkan tenant_id pada tabel conversation dan message agar data percakapan setiap pelanggan tetap terpisah.

11. Menambahkan Informasi Bisnis ke Chatbot

Chatbot pada contoh sebelumnya hanya mengandalkan kemampuan umum model.

Agar chatbot dapat menjawab informasi perusahaan, terdapat beberapa pendekatan.

Instruksi Statis

Informasi singkat dapat dimasukkan ke dalam instructions:

private function instructions(): string
{
    return <<<'PROMPT'
Anda adalah asisten OVLA Media.

OVLA Media menyediakan:
- Jasa pembuatan website
- Aplikasi custom
- Aplikasi SaaS
- Sistem POS
- Sistem inventory
- Integrasi API

Jangan membuat harga sendiri.
Arahkan pelanggan menghubungi tim apabila meminta penawaran.
PROMPT;
}

Cara ini cocok untuk informasi yang singkat dan jarang berubah.

Mengambil Data dari Database

Untuk informasi produk, paket, layanan, atau status pesanan, Laravel dapat mengambil data dari database sebelum menyusun input.

Contoh:

$productInformation = Product::query()
    ->where('is_active', true)
    ->limit(10)
    ->get(['name', 'description', 'price'])
    ->toJson();

$message = <<<PROMPT
Pertanyaan pelanggan:
{$validated['message']}

Data produk yang tersedia:
{$productInformation}

Jawab hanya berdasarkan data yang tersedia.
PROMPT;

Menggunakan RAG

Untuk dokumen yang banyak, chatbot dapat dikembangkan menggunakan Retrieval-Augmented Generation atau RAG.

Alurnya:

  1. Dokumen perusahaan dipecah menjadi beberapa bagian.

  2. Dokumen diubah menjadi embedding.

  3. Embedding disimpan dalam vector database.

  4. Pertanyaan pengguna digunakan untuk mencari dokumen relevan.

  5. Dokumen tersebut dikirim sebagai konteks kepada model.

  6. Model menyusun jawaban berdasarkan sumber yang ditemukan.

Pendekatan RAG cocok untuk:

  • Knowledge base perusahaan

  • SOP

  • Dokumentasi produk

  • Informasi layanan

  • Panduan penggunaan

  • Kebijakan perusahaan

  • Frequently Asked Questions

12. Menambahkan Streaming Jawaban

Pada implementasi biasa, pengguna harus menunggu hingga seluruh jawaban selesai dibuat.

OpenAI API mendukung streaming menggunakan Server-Sent Events dengan mengaktifkan stream: true. Streaming memungkinkan bagian awal jawaban diproses ketika model masih menghasilkan bagian berikutnya.

Contoh payload:

{
    "model": "gpt-5.6",
    "input": "Jelaskan manfaat aplikasi kasir.",
    "stream": true
}

Implementasi streaming di Laravel membutuhkan penanganan response stream dan pengiriman potongan teks ke browser.

Fitur ini berguna untuk:

  • Jawaban yang panjang

  • Pengalaman chat yang lebih responsif

  • Efek teks muncul secara bertahap

  • Mengurangi kesan aplikasi berhenti bekerja

Untuk tahap awal, respons JSON biasa lebih mudah dibuat dan dipelihara.

13. Menangani Error OpenAI API

Beberapa kegagalan yang mungkin terjadi antara lain:

  • API key tidak valid

  • Saldo atau batas penggunaan tidak mencukupi

  • Model tidak tersedia untuk project

  • Request terlalu banyak

  • Input terlalu panjang

  • Server tidak dapat terhubung

  • OpenAI API mengalami gangguan

  • Respons tidak menghasilkan teks

Jangan menampilkan detail teknis sensitif kepada pengguna.

Respons untuk pengguna:

{
    "success": false,
    "message": "Layanan AI sedang tidak tersedia."
}

Detail teknis dapat dicatat pada log:

logger()->error('OpenAI request failed', [
    'status' => $response->status(),
    'error_code' => $response->json('error.code'),
]);

Jangan memasukkan API key, password, token pengguna, atau data sensitif ke log.

14. Cara Mengamankan Chatbot AI Laravel

Keamanan harus diperhatikan karena setiap request API dapat menimbulkan penggunaan sumber daya dan biaya.

Simpan API Key di Backend

API key hanya boleh digunakan oleh Laravel pada sisi server. Jangan mengirimkannya ke browser atau menaruhnya dalam file JavaScript.

Gunakan Environment Variable

Simpan key pada .env atau secret manager dan jangan commit ke repository. Apabila key diduga bocor, segera lakukan rotasi.

Validasi Panjang Pesan

Batasi input pengguna:

'message' => [
    'required',
    'string',
    'min:2',
    'max:4000',
],

Gunakan Rate Limiting

Batasi jumlah pesan yang dapat dikirim dalam satu menit:

->middleware('throttle:20,1')

Gunakan Autentikasi

Untuk aplikasi internal atau SaaS, pastikan hanya pengguna yang sudah login yang dapat mengakses chatbot.

Batasi Penggunaan per Pengguna

Sistem dapat mencatat:

  • Jumlah request

  • Jumlah token

  • Batas harian

  • Batas bulanan

  • Paket pelanggan

  • Waktu request terakhir

Jangan Memercayai Output Secara Langsung

Jawaban AI tidak boleh langsung digunakan untuk:

  • Menghapus data

  • Menyetujui pembayaran

  • Mengubah hak akses

  • Menjalankan query database

  • Mengirim dana

  • Menjalankan perintah server

Tindakan penting harus melewati validasi aplikasi dan pemeriksaan izin.

Lindungi Data Pribadi

Hindari mengirim informasi yang tidak diperlukan, seperti:

  • Password

  • PIN

  • OTP

  • Nomor kartu pembayaran

  • Dokumen identitas lengkap

  • Data kesehatan yang tidak diperlukan

  • Rahasia perusahaan

15. Cara Mengontrol Biaya OpenAI API

Beberapa strategi yang dapat diterapkan untuk mengendalikan penggunaan antara lain:

  • Batasi panjang pertanyaan

  • Batasi jumlah pesan per pengguna

  • Gunakan rate limiting

  • Simpan jawaban pertanyaan umum dalam cache

  • Gunakan model sesuai tingkat kebutuhan

  • Hapus konteks yang tidak diperlukan

  • Pantau penggunaan token

  • Tetapkan batas penggunaan per paket

  • Gunakan queue untuk proses noninteraktif

  • Catat penggunaan berdasarkan tenant

Contoh menyimpan informasi penggunaan:

ChatMessage::create([
    'conversation_id' => $conversation->id,
    'role' => 'assistant',
    'content' => $result['answer'],
    'usage' => $result['usage'],
]);

16. Contoh Penerapan Chatbot AI dalam Bisnis

Chatbot AI Laravel dapat diterapkan pada berbagai kebutuhan.

Customer Service

Menjawab pertanyaan umum mengenai:

  • Produk

  • Layanan

  • Jam operasional

  • Cara pembayaran

  • Status pesanan

  • Kebijakan perusahaan

Rekomendasi Produk

Chatbot dapat menanyakan kebutuhan pelanggan, kemudian memberikan rekomendasi berdasarkan database produk.

Asisten Aplikasi SaaS

Chatbot dapat membantu pengguna memahami:

  • Cara membuat transaksi

  • Cara mengelola produk

  • Cara melihat laporan

  • Cara menambah pengguna

  • Cara mengatur cabang

Knowledge Base Internal

Karyawan dapat mencari:

  • SOP perusahaan

  • Panduan teknis

  • Kebijakan operasional

  • Dokumentasi sistem

  • Prosedur pelayanan

Pembuatan Konten

Chatbot dapat membantu membuat:

  • Deskripsi produk

  • Ide artikel

  • Ringkasan laporan

  • Draf email

  • Caption media sosial

Konten yang dihasilkan tetap perlu diperiksa sebelum dipublikasikan.

17. Pengembangan Lanjutan Chatbot

Setelah chatbot dasar berhasil dibuat, sistem dapat dikembangkan dengan fitur:

  • Riwayat percakapan

  • Login pengguna

  • Multi-tenant

  • Streaming jawaban

  • Upload dokumen

  • RAG dan vector database

  • Voice input

  • Text-to-speech

  • Integrasi WhatsApp

  • Integrasi Telegram

  • Human handoff ke customer service

  • Dashboard penggunaan

  • Pembatasan berdasarkan paket

  • Analisis kepuasan pengguna

  • Function calling

  • Integrasi data produk

  • Integrasi status pesanan

Checklist Chatbot AI Laravel

Sebelum chatbot digunakan pada server produksi, pastikan:

  • API key tersimpan di server

  • .env tidak masuk repository

  • Request melewati backend

  • Input sudah divalidasi

  • Rate limiting sudah aktif

  • Timeout sudah dikonfigurasi

  • Error ditangani dengan aman

  • Penggunaan token dicatat

  • Riwayat chat dibatasi

  • Data pengguna dilindungi

  • Output ditampilkan sebagai teks aman

  • Informasi bisnis berasal dari sumber yang benar

  • Tersedia prosedur penghapusan percakapan

  • Penggunaan API dipantau

  • Jawaban penting dapat dialihkan ke petugas manusia

Kesimpulan

Chatbot AI Laravel dapat dibuat dengan menghubungkan backend Laravel ke OpenAI Responses API.

Komponen utama yang diperlukan meliputi:

  • OpenAI API key

  • Konfigurasi environment

  • OpenAI service

  • Chat controller

  • Route

  • Tampilan chatbot

  • Session atau database percakapan

  • Rate limiting

  • Validasi dan error handling

Laravel mengirim pertanyaan pengguna melalui HTTP request, kemudian OpenAI API memproses input dan mengembalikan jawaban yang dapat ditampilkan pada website.

Untuk menjaga percakapan tetap terhubung, aplikasi dapat menyimpan previous_response_id. Untuk chatbot berbasis data perusahaan, Laravel dapat mengambil informasi dari database atau menggunakan pendekatan RAG.

Keamanan harus menjadi prioritas. API key harus disimpan pada backend, input pengguna perlu dibatasi, penggunaan API harus dipantau, dan jawaban AI tidak boleh langsung menjalankan tindakan penting tanpa validasi.

Bagi perusahaan yang membutuhkan chatbot AI, integrasi OpenAI API, customer service otomatis, chatbot WhatsApp, aplikasi berbasis Artificial Intelligence, atau pengembangan aplikasi custom Laravel, OVLA Media dapat membantu merancang dan mengembangkan solusi sesuai kebutuhan bisnis.

#chatbot AI Laravel #cara membuat chatbot Laravel #OpenAI API Laravel #integrasi OpenAI Laravel #Laravel Responses API #chatbot OpenAI #membuat chatbot AI #aplikasi chatbot Laravel #Artificial Intelligence Laravel #AI customer service #chatbot website #chatbot bisnis #API OpenAI PHP #Laravel HTTP client #previous response ID #streaming OpenAI API #aplikasi AI #chatbot SaaS #integrasi AI #pengembangan aplikasi Laravel #Laravel developer #software development #aplikasi custom
Beranda Produk Artikel
Konsultasi
OVLA

Navigasi Utama

Hubungi Kami

Mulai Konsultasi Sekarang