สร้าง Chatbot เพื่อบริการ ถามตอบอ้ตโนมัต

โค้ดเพื่อจัดเก็บและเรียกใช้คำถาม-คำตอบ (Q&A) จากฐานข้อมูล MySQL แทนการเก็บในโค้ดโดยตรง (Hardcode) เป็นการปรับปรุงที่ยอดเยี่ยม ทำให้ระบบสามารถขยายและจัดการได้ง่ายขึ้นมาก

การเปลี่ยนแปลงนี้ต้องทำใน 2 ส่วนหลักๆ คือ:

1. Backend (ฝั่งเซิร์ฟเวอร์): สร้างไฟล์ API เพื่อเชื่อมต่อกับฐานข้อมูล MySQL และจัดการข้อมูล (เพิ่ม, ลบ, แก้ไข, ดึงข้อมูล) ผมจะใช้ภาษา PHP เป็นตัวอย่าง لأنهเป็นที่นิยมและใช้งานง่ายกับเว็บโฮสติ้งส่วนใหญ่

2. Frontend (ฝั่งผู้ใช้): แก้ไขโค้ด JavaScript ในไฟล์ index.html เดิม ให้เรียกใช้งาน API ที่เราสร้างขึ้นแทนการอ้างอิงจากตัวแปร responses ที่อยู่ในโค้ด

---

ขั้นตอนที่ 1: เตรียมฐานข้อมูล (MySQL)

ก่อนอื่น ให้สร้างตารางในฐานข้อมูล MySQL ของคุณเพื่อเก็บข้อมูลคำถาม-คำตอบ โดยใช้คำสั่ง SQL นี้:

SQL

CREATE TABLE `chatbot_responses` (
  `id` INT AUTO_INCREMENT PRIMARY KEY,
  `category` VARCHAR(50) NOT NULL,
  `question` TEXT NOT NULL,
  `answer` TEXT NOT NULL,
  `keywords` VARCHAR(255) NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

คำอธิบายตาราง:

• id: รหัสเฉพาะของแต่ละแถว (Primary Key)

• category: หมวดหมู่ของคำถาม (เช่น home, admission, curriculum)

• question: คำถามหลัก

• answer: คำตอบสำหรับคำถามนั้น

• keywords: คำสำคัญที่เกี่ยวข้อง (เก็บในรูปแบบข้อความที่คั่นด้วยจุลภาค เช่น "หอพัก,ค่าใช้จ่าย,ที่พัก")

---

ขั้นตอนที่ 2: สร้าง Backend API (ไฟล์ api.php)

สร้างไฟล์ใหม่ชื่อ api.php แล้ววางโค้ดข้างล่างนี้ลงไป ไฟล์นี้จะทำหน้าที่เป็นตัวกลางระหว่าง Frontend กับฐานข้อมูล

สำคัญ: แก้ไขข้อมูลการเชื่อมต่อฐานข้อมูล ($servername, $username, $password, $dbname) ให้ตรงกับการตั้งค่าของคุณ

PHP

<?php
header("Content-Type: application/json; charset=UTF-8");
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");

// --- แก้ไขข้อมูลการเชื่อมต่อฐานข้อมูลของคุณที่นี่ ---
$servername = "localhost";
$username = "root";       //  <-- ชื่อผู้ใช้ฐานข้อมูล
$password = "";           //  <-- รหัสผ่าน
$dbname = "school_db";  //  <-- ชื่อฐานข้อมูล

// สร้างการเชื่อมต่อ
$conn = new mysqli($servername, $username, $password, $dbname);

// ตั้งค่า character set
$conn->set_charset("utf8mb4");

// ตรวจสอบการเชื่อมต่อ
if ($conn->connect_error) {
    die(json_encode(["error" => "Connection failed: " . $conn->connect_error]));
}

$action = $_GET['action'] ?? '';
$method = $_SERVER['REQUEST_METHOD'];

switch ($action) {
    case 'get_responses':
        if ($method == 'GET') {
            $sql = "SELECT * FROM chatbot_responses ORDER BY category, id";
            $result = $conn->query($sql);
            $responses = [];
            if ($result->num_rows > 0) {
                while($row = $result->fetch_assoc()) {
                    // จัดกลุ่มตาม category
                    if (!isset($responses[$row['category']])) {
                        $responses[$row['category']] = [];
                    }
                    $responses[$row['category']][] = [
                        'id' => (int)$row['id'],
                        'question' => $row['question'],
                        'answer' => $row['answer'],
                        'keywords' => $row['keywords'] ? explode(',', $row['keywords']) : []
                    ];
                }
            }
            echo json_encode($responses);
        }
        break;

    case 'add_response':
        if ($method == 'PO