Chat website cho lập trình viên: lựa chọn cookie và khách đã đăng nhập

Mã cài đặt khung chat website tạo ra một hàm JavaScript, window.AIChatbot, để mã của bạn gửi lựa chọn cookie của khách, liên kết khung chat với khách đã đăng nhập, quên khách đó khi đăng xuất, và mở hoặc đóng khung chat. Bạn chỉ cần trang này khi website hỏi khách về cookie hoặc có tài khoản khách hàng; khung chat vẫn chạy bình thường khi không dùng các lệnh này.

Mã cài đặt gồm những gì?

Mã cài đặt bạn sao chép ở mục "Thêm chat vào website" là một dòng gồm hai phần:

• Một dòng hàng đợi tạo window.AIChatbot ngay lập tức. Các lệnh gửi trước khi khung chat tải xong sẽ chờ trong hàng đợi này và chạy theo thứ tự ngay khi khung chat sẵn sàng.
• Tệp khung chat widget.js kèm khóa trang của bạn.

Dán cả dòng ngay trước </body> trên mọi trang, như hướng dẫn bắt đầu. Mã chạy trước mã cài đặt, ví dụ trong <head>, cần bắt đầu bằng chính dòng hàng đợi đó:

window.AIChatbot=window.AIChatbot||function(){(window.AIChatbot.q=window.AIChatbot.q||[]).push(arguments)};

Chạy dòng hàng đợi nhiều lần vẫn an toàn, vì dòng này không bao giờ thay thế một hàm đã có. Nếu website đặt Content Security Policy chặn script nội tuyến, hãy gắn nonce của bạn cho thẻ script chứa dòng hàng đợi, hoặc đặt dòng này vào một tệp script bạn đã tải sẵn.

Gửi lựa chọn cookie của khách như thế nào?

Khung chat ghi lại các lượt truy cập bằng Microsoft Clarity, gồm cả nội dung khách gõ, để cải thiện dịch vụ. Nếu website của bạn hỏi khách về cookie, hãy gửi câu trả lời của khách cho khung chat:

window.AIChatbot('consent', { analytics: false });

• Gửi analytics: true khi khách đồng ý cookie phân tích và analytics: false khi khách từ chối. Mọi giá trị khác true đều được tính là từ chối.
• Khi website chưa gửi lựa chọn, khung chat vẫn ghi lại lượt truy cập.
• Gửi lựa chọn trên mọi trang, trong cùng lần tải trang với mã cài đặt, để khách đã từ chối không bao giờ bị ghi lại. Khung chat không nhớ lựa chọn giữa các trang.
• Khi khách đổi ý, hãy gửi lựa chọn mới; khung chat chuyển ngay lựa chọn đó cho Clarity.

Phần lớn banner cookie có thể chạy mã của bạn với lựa chọn đã lưu khi trang tải và chạy lại khi khách lưu lựa chọn mới; hãy gọi window.AIChatbot('consent', ...) ở cả hai chỗ. Đoạn mã này kèm dòng hàng đợi, sẵn sàng để sao chép, nằm ở mục "Ghi lại phiên chat và lựa chọn cookie" trên trang Chat trên website trong phần Kênh của trang quản trị.

Liên kết cuộc trò chuyện với khách đã đăng nhập như thế nào?

Khi khách đã đăng nhập vào website của bạn, khung chat có thể theo khách: cùng một khách thấy cùng lịch sử trò chuyện trên mọi thiết bị, và nhân viên của bạn thấy tên và email bạn gửi trong Hộp thư.

Giữ khóa bí mật trên máy chủ. Khi bạn tạo mã cài đặt, trang quản trị hiện "Khóa bí mật cho khách đã đăng nhập" một lần duy nhất. Hãy lưu khóa cùng các bí mật khác của máy chủ và không bao giờ đặt vào mã website.

Ký mã khách hàng trên máy chủ. userHash là HMAC-SHA256 của mã khách hàng với khóa bí mật, viết dạng hex chữ thường. Với Node.js:

import { createHmac } from 'node:crypto';

const userHash = createHmac('sha256', process.env.AICHATBOT_IDENTITY_SECRET).update(customerId).digest('hex');

Gửi thông tin nhận diện trên mọi trang khách đã đăng nhập, trong cùng trang với mã cài đặt:

<script>
  window.AIChatbot=window.AIChatbot||function(){(window.AIChatbot.q=window.AIChatbot.q||[]).push(arguments)};
  window.AIChatbot('identify', {
    externalId: 'CUSTOMER_ID',
    userHash: 'USER_HASH_FROM_YOUR_SERVER',
    name: 'Lan Nguyen',
    email: 'lan@example.com'
  });
</script>

• Khi userHash không khớp, khung chat bỏ qua thông tin nhận diện, mở như khách ẩn danh và ghi [aichatbot] identify rejected vào console của trình duyệt.
• name và email gửi mà không có externalId và userHash được lưu thành thông tin liên hệ chưa xác minh của khách hiện tại.
• Tên dài hơn 80 ký tự hoặc email không hợp lệ sẽ bị bỏ qua.
• Hãy gửi identify trước khi khung chat tải xong, như ví dụ trên, để khung chat bắt đầu với đúng khách đã đăng nhập. Nếu bạn gọi muộn hơn, ví dụ ngay sau khi khách đăng nhập mà trang không tải lại, khung chat liên kết khách hiện tại với tài khoản đó; nếu khách từng trò chuyện khi đăng nhập trước đây, lịch sử cũ hiện ra từ lần tải trang tiếp theo.

Khi khách đăng xuất thì cần làm gì?

Gọi reset khi khách đăng xuất, để người dùng tiếp theo trên trình duyệt đó không thấy cuộc trò chuyện của khách:

window.AIChatbot('reset');

reset làm khung chat quên khách trên trình duyệt này. Khung chat đang mở trên trang vẫn tiếp tục đến lần tải trang tiếp theo, nên hãy gọi reset ngay trước khi chuyển hướng đăng xuất, hoặc một lần trên trang mà việc đăng xuất dẫn tới; sau đó khung chat bắt đầu lại như một khách ẩn danh. Chỉ gọi lệnh này khi đăng xuất: gọi trên mọi trang sẽ tạo cuộc trò chuyện ẩn danh mới mỗi lần và làm mất lịch sử của khách.

Mở hoặc đóng khung chat từ nút của bạn như thế nào?

window.AIChatbot('open');
window.AIChatbot('close');

Lệnh open gửi trước khi khung chat tải xong sẽ mở khung chat ngay khi sẵn sàng. Một nút như "Chat với chúng tôi" có thể gọi window.AIChatbot('open') khi khách bấm.

Có những lệnh nào?

Để cài đặt khung chat, xem hướng dẫn bắt đầu; trang bảo mật giải thích cách dữ liệu được bảo vệ.