🤖 Chào đón các nhà phát triển bên thứ 3

Trang này hỗ trợ 2 trường hợp nhúng VietBot Live vào website của bạn. Chọn trường hợp phù hợp bên dưới.

Case 1: Admin cấu hình sẵn — User không được tùy biến bot

Phù hợp khi bạn muốn nhúng một bot cố định (của bạn) vào website. Tất cả visitor đều chat với cùng 1 bot (cùng prompt, voice, role). Visitor KHÔNG cần đăng ký, KHÔNG thấy màn hình bind.

📋 Các bước hướng dẫn cụ thể:
Bước 1:
🌐 Vào web.vietbot.vn hoặc mobile.vietbot.vn
Đăng nhập (Google 1 chạm hoặc đăng ký username và mật khẩu). Cả 2 trang đều có đầy đủ chức năng.
Bước 2:
🤖 Tạo Agent & chọn Role
Ấn nút tạo Agent → Tạo Agent mới → đặt tên + chọn Role hoặc tạo Role cho nhân vật (tính cách, giọng nói, giọng vùng miền).
Bước 3:
📋 Mở "Quản lý thiết bị" → "Liên kết thiết bị"
Trong Agent vừa tạo, vào mục Quản lý thiết bị → Liên kết thiết bị. Để màn hình sẵn sàng nhập mã 6 số.
Bước 4:
🌐 Mở live.vietbot.vn
Trên trình duyệt khác (hoặc tab khác), vào live.vietbot.vn → bấm Bắt đầu.
Bước 5:
🔑 Nhập mã 6 số
Popup live.vietbot.vn hiển thị mã 6 số → Nhập mã này vào ô "Liên kết thiết bị" ở Bước 3
Bước 6:
Trên web.vietbot.vn hoặc mobile.vietbot.vn vào mục quản lý thiết bị, copy lấy địa chỉ MAC
Bước 7:
Quay lại trang này → nhập MAC Address + Whitelist domains → Generate Token
Format: aa:bb:cc:dd:ee:ff (lấy từ web.vietbot.vn sau khi bind thiết bị)
Mỗi domain 1 dòng. Hỗ trợ:
example.com — chỉ match chính xác
*.example.com — match example.com và tất cả subdomain
* — cho phép mọi domain (KHÔNG AN TOÀN)
✅ Token đã được tạo
🚀 Cách nhúng widget vào website của bạn:

1. Tải file widget.js từ GitHub:
curl -o widget.js https://raw.githubusercontent.com/phanmemkhoinghiep/vietbot_client/main/JS_SITE/widget.js
2. Mở file, tìm dòng const SITE_WS_ENDPOINT = '__SITE_WS_ENDPOINT__'; và paste token vừa copy vào:
const SITE_WS_ENDPOINT = 'YOUR_TOKEN_HERE';
3. Upload widget.js lên hosting/CDN của bạn
4. Thêm vào HTML (cuối ):

⚙️ Tùy chỉnh widget (tùy chọn): Sửa trong file widget.js:
const CONFIG = {
    botUrl: 'https://live.vietbot.vn/embeddable_bot.html',
    siteEndpoint: SITE_WS_ENDPOINT,
    width: '400px',        // chiều rộng iframe
    height: '600px',       // chiều cao iframe
    position: 'bottom-left', // 'bottom-right' (default) | 'bottom-left'
};

🔒 Bảo mật — Whitelist Protection

Câu hỏi: Nếu visitor bật F12 và lấy trộm token, họ có dùng token trên website khác được không?

Trả lời: KHÔNG. Token của bạn chứa whitelist được mã hóa AES-ECB. Khi visitor truy cập từ domain không có trong whitelist:

1. Server decrypt token → lấy whitelist
2. Server check Origin: https://attacker.com vs whitelist
3. Không match → trả về 403 Forbidden
4. Bot KHÔNG bao giờ chạy trên website giả mạo

Whitelist được mã hóa trong token nên attacker không thể sửa đổi mà không có key bí mật.

Case 2: User tự cấu hình bot của họ

Phù hợp khi bạn muốn cho mỗi visitor tự bind bot của mình. Visitor sẽ thấy màn hình "Liên kết thiết bị" nhập mã 6 số, sau đó chat với bot riêng của họ (của visitor). Widget dùng file JS/widget.js (khác với Case 1 dùng JS_SITE/widget.js).

🚀 Cách nhúng (1 dòng):
// Thêm dòng này vào bất kỳ trang nào

✅ CDN miễn phí từ jsDelivr. Widget tự động chèn nút chat floating ở góc dưới bên phải.

⚙️ Tùy chỉnh widget (tùy chọn):
// Cấu hình TRƯỚC KHI load widget.js

📋 Flow hoạt động:
  1. Visitor vào website của bạn → thấy nút chat floating
  2. Click nút → mở iframe → hiển thị màn hình "Liên kết thiết bị"
  3. Visitor vào live.vietbot.vn (tab khác) → bấm Bắt đầu → lấy mã 6 số
  4. Visitor nhập mã 6 số vào widget → thiết bị được bind với tài khoản của visitor
  5. Visitor chat với bot của chính họ (prompt, voice, role do visitor cấu hình)

ℹ️ Lưu ý quan trọng

Với Case 2, mỗi visitor phải có tài khoản VietBot riêng và tự cấu hình Agent/Role của họ.

Bạn (admin website) KHÔNG cần làm gì ở trang này — chỉ cần nhúng script CDN như trên.

File widget: https://cdn.jsdelivr.net/gh/phanmemkhoinghiep/vietbot_client@main/JS/widget.js