Tích hợp Live Chat vào website và trang quản trị của bạn

Thêm tiện ích chat

Dán thẻ này trước </body> trên mọi trang cần hiện chat. Bạn tìm ID không gian làm việc trong Cài đặt › Chung, hoặc sao chép cả thẻ từ Cài đặt › Tiện ích chat.

Script rất nhẹ và không tải thêm gì cho đến khi khách mở chat. Nó chạy trên mọi website: HTML thuần, WordPress, Shopify, Next.js hay ứng dụng một trang.

<script src="https://chat.hibira.io/w/v1.js"
        data-workspace="ws_..." async></script>

Thêm địa chỉ từng website trong Cài đặt › Tiện ích chat › Các trang được dùng tiện ích chat. Tiện ích chat sẽ không chạy trên các trang khác.

Tùy chọn tiện ích chat

Đặt các thuộc tính này trên thẻ script.

<script src="https://chat.hibira.io/w/v1.js"
        data-workspace="ws_..."
        data-color="#0f766e"
        data-lang="ja"
        async></script>

JavaScript API

Khi script đã tải, window.HibiraLiveChat cho phép trang mở và đóng chat. Nếu mã của bạn có thể chạy trước khi tiện ích chat tải xong, hãy lắng nghe sự kiện hibira-livechat:ready.

<button type="button" id="talk-to-sales">Talk to sales</button>

<script src="https://chat.hibira.io/w/v1.js"
        data-workspace="ws_..." data-launcher="none" async></script>
<script>
  document.getElementById("talk-to-sales").addEventListener("click", function () {
    if (window.HibiraLiveChat) window.HibiraLiveChat.open({ topic: "sales" });
  });
  window.addEventListener("hibira-livechat:ready", function () {
    // The widget is loaded: HibiraLiveChat.open() and .close() work now.
  });
</script>

Content-Security-Policy

Nếu website của bạn gửi Content-Security-Policy nghiêm ngặt, hãy cho phép các host dưới đây và gắn nonce của trang vào thẻ script. Tiện ích chat sẽ chuyển nonce đó cho mọi thứ nó thêm vào.

challenges.cloudflare.com dùng để kiểm tra spam ở tin nhắn đầu tiên của khách mới.

script-src  'nonce-R4nd0m' https://chat.hibira.io https://challenges.cloudflare.com;
style-src   'nonce-R4nd0m';
connect-src https://chat.hibira.io wss://*.hibira.io;
img-src     https://chat.hibira.io data:;
frame-src   https://challenges.cloudflare.com;

<script src="https://chat.hibira.io/w/v1.js" nonce="R4nd0m"
        data-workspace="ws_..." async></script>

Đăng nhập một lần cho nhân viên (JWT) Từ gói Starter

Cho nhân viên vào thẳng hộp thư Live Chat từ trang quản trị của bạn mà không cần mật khẩu riêng. Máy chủ của bạn ký một token ngắn hạn cho nhân viên đang đăng nhập rồi chuyển họ sang Live Chat.

1. Bật đăng nhập một lần trong Nhóm › Đăng nhập một lần và sao chép khóa bí mật.
2. Chỉ lưu khóa bí mật trên máy chủ, ví dụ trong biến môi trường HIBIRA_LIVECHAT_SSO_SECRET. Tuyệt đối không đưa vào mã chạy trên trình duyệt.
3. Thêm một liên kết trong trang quản trị tới route của bạn: kiểm tra người dùng là nhân viên, ký token bên dưới rồi chuyển hướng tới /sso/jwt.
4. Người đăng nhập lần đầu sẽ được thêm làm nhân viên nếu còn chỗ trống. Vai trò được cập nhật theo token ở mỗi lần đăng nhập.

import crypto from "node:crypto";

const b64 = (v) => Buffer.from(JSON.stringify(v)).toString("base64url");

// Build a new URL on every click, behind your admin panel's own login.
export function liveChatSsoUrl(user) {
  const now = Math.floor(Date.now() / 1000);
  const head = b64({ alg: "HS256", typ: "JWT" });
  const body = b64({
    iss: "ws_...",                 // your Workspace ID
    sub: String(user.id),          // the user's ID in your system
    email: user.email,
    name: user.name,
    role: user.isAdmin ? "admin" : "agent",
    jti: crypto.randomUUID(),      // single use
    iat: now,
    exp: now + 120,                // 5 minutes at most
  });
  const sig = crypto
    .createHmac("sha256", process.env.HIBIRA_LIVECHAT_SSO_SECRET)
    .update(head + "." + body)
    .digest("base64url");
  return "https://chat.hibira.io/sso/jwt?" + new URLSearchParams({
    jwt: head + "." + body + "." + sig,
    return_to: "/inbox",
  });
}

• Ký bằng HS256 và gửi token dưới dạng ?jwt= tới /sso/jwt. Thêm return_to với đường dẫn như /inbox để chọn trang sau khi đăng nhập.
• Đồng hồ được phép lệch tối đa 30 giây.
• Sau khi đổi khóa bí mật, khóa cũ vẫn dùng được thêm 24 giờ, nên bạn triển khai khóa mới mà không bị gián đoạn.
• Khi đã chạy ổn, hãy bật "Chỉ dùng đăng nhập một lần": nhân viên chỉ đăng nhập được qua trang quản trị của bạn, còn chủ sở hữu vẫn dùng được email.

Mã có sẵn cho Node.js, Laravel, PHP, Python, Django, Rails, Go, Java và .NET có thể lấy qua máy chủ MCP bên dưới.

Trợ lý AI (MCP)

Máy chủ MCP của Live Chat cho phép trợ lý AI như Claude, Cursor hay VS Code thiết lập đăng nhập một lần ngay trong mã của bạn. Trợ lý đăng nhập bằng tài khoản Live Chat của bạn trên trình duyệt, và chỉ chủ sở hữu hoặc quản trị viên của không gian làm việc mới phê duyệt được.

Khóa bí mật SSO không bao giờ đi qua MCP. Trợ lý đọc cấu hình, viết mã cho stack của bạn và kiểm tra token nó đã ký mà không đăng nhập cho ai cả.

# Claude Code
claude mcp add --transport http hibira-live-chat https://chat.hibira.io/mcp

# Any client with remote MCP servers (Cursor, VS Code, ...)
{ "mcpServers": { "hibira-live-chat": { "url": "https://chat.hibira.io/mcp" } } }

Plugin Hibira cho Claude Code, Cursor, Codex và Gemini CLI đã có sẵn máy chủ này. Để ngắt mọi ứng dụng AI cùng lúc, vào Nhóm › Đăng nhập một lần › Ngắt kết nối ứng dụng AI.

REST API và webhook Sắp ra mắt

REST API cho cuộc trò chuyện, tin nhắn và đánh giá, cùng webhook cho cuộc trò chuyện mới, tin nhắn và đánh giá, sắp có trên gói Team trở lên. Trang này sẽ hướng dẫn khi sẵn sàng.

Trong lúc chờ, bạn có thể xuất cuộc trò chuyện dạng CSV hoặc JSON từ hộp thư, hoặc xuất cả không gian làm việc trong Cài đặt › Dữ liệu & quyền riêng tư.

Dành cho công cụ AI

Bản tóm tắt Live Chat dạng văn bản thuần cho trợ lý AI và công cụ trả lời: /llms.txt là bản ngắn, /llms-full.txt gồm tài liệu này và toàn bộ các trang tính năng.

curl https://chat.hibira.io/llms.txt
curl https://chat.hibira.io/llms-full.txt