1. PWA & Web Push – Cách hoạt động trên Frontend Domain
Tổng quan
Khi sử dụng Frontend Domain tùy chỉnh trong Chatbox AI Muathemewpgiare, hệ thống sẽ tự động hỗ trợ:
Ứng dụng Web Tiến tiến (PWA – Progressive Web App)
Thông báo đẩy trên trình duyệt (Web Push Notifications)
Hai công nghệ này hoạt động phối hợp thông qua Service Worker, được gắn vào frontend domain của bạn, đảm bảo trải nghiệm thống nhất theo thương hiệu riêng.
PWA hoạt động như thế nào?
1. Service Worker
Đây là tệp chạy nền trên trình duyệt, cho phép:
Gửi và nhận Web Push Notifications
Lưu trữ dữ liệu cache để tải nhanh hơn
Hoạt động ngay cả khi người dùng tắt tab
Service Worker được cài đặt tự động khi người dùng truy cập Frontend Domain của bạn (VD: app.mychat.com).
2. Manifest PWA
Frontend Domain chứa file manifest.json mô tả ứng dụng:
Tên ứng dụng
Biểu tượng (icon)
Màu theme
Định dạng hiển thị khi cài trên điện thoại hoặc desktop
Điều này giúp khách hàng có thể:
Cài Dashboard như một app độc lập trên điện thoại
Tạo icon trên màn hình desktop
Mở sử dụng như ứng dụng native
Web Push hoạt động như thế nào?
1. Tích hợp OneSignal
Khi bạn thiết lập App ID và API Key trong Chatbox AI Muathemewpgiare:
Service Worker sẽ gắn mã OneSignal
Domain của bạn trở thành domain gửi thông báo hợp lệ
2. Quy trình nhận thông báo
Người dùng truy cập Frontend Domain
Trình duyệt yêu cầu cho phép nhận thông báo
Khi người dùng đồng ý → họ được đăng ký vào OneSignal
Chatbox AI Muathemewpgiare có thể gửi thông báo đến thiết bị đó
3. Yêu cầu để hoạt động
| Thành phần | Trạng thái |
|---|---|
| HTTPS | Bắt buộc |
| Custom Frontend Domain | Bắt buộc |
| OneSignal App | Bắt buộc |
| Service Worker | Tự động tích hợp |
2. Troubleshooting OneSignal – Các lỗi thường gặp & cách xử lý
Dưới đây là các lỗi phổ biến nhất khi tích hợp OneSignal cùng cách khắc phục.
❗ Lỗi 1: Trình duyệt không hiển thị yêu cầu cấp quyền thông báo
Nguyên nhân
Chưa cấu hình Frontend Domain
Lỗi DNS / domain chưa trỏ đúng
Chưa thêm App ID hoặc API Key
Cách xử lý
Kiểm tra domain đã hoạt động qua HTTPS
Kiểm tra bản ghi DNS đã trỏ CNAME hoặc A record đúng
Xác nhận đã nhập đúng App ID và API Key
Kiểm tra console trình duyệt → nếu có lỗi service worker
❗ Lỗi 2: OneSignal báo lỗi “No service worker found”
Nguyên nhân
Service Worker không được tải do:
Domain sai
Cache trình duyệt cũ
Service Worker bị chặn
Cách xử lý
Xóa cache trình duyệt
Mở DevTools → Application → Service Worker → unregister
Tải lại trang để xem worker có chạy lại không
❗ Lỗi 3: Không gửi được thông báo đến trình duyệt
Nguyên nhân
App ID hoặc API Key sai
OneSignal chưa bật Web Push
Người dùng chưa cấp quyền
Khắc phục
Kiểm tra App Settings → Platform → Web Push
Kiểm tra bảng “All Users” trong OneSignal xem thiết bị đã nhận chưa
Gửi test notification để xác định lỗi
❗ Lỗi 4: Widget OneSignal hiển thị “Insecure Origin”
Nguyên nhân
Domain chưa bật HTTPS (SSL)
Cách xử lý
Bật SSL cho Frontend Domain
Chờ 5–10 phút để chứng chỉ khởi tạo
Tải lại trang trong chế độ ẩn danh
❗ Lỗi 5: Notification icon không hiển thị đúng
Nguyên nhân
File icon không tồn tại hoặc sai kích thước
Caching của trình duyệt
Khắc phục
Kiểm tra link icon trong manifest
Tối ưu icon theo chuẩn: 192×192 hoặc 512×512
Xóa cache trình duyệt
3. Web Push Setup cho từng trình duyệt
Dưới đây là hướng dẫn cách người dùng cho phép nhận thông báo đẩy trên các trình duyệt thông dụng.
Chrome (Windows, macOS, Android)
Cách bật thông báo
Truy cập Frontend Domain
Chrome sẽ hiển thị popup: Allow Notifications
Nhấn Allow
Kiểm tra quyền thông báo
Settings → Privacy & Security → Site Settings → Notifications
Tìm domain của bạn → chọn Allow
Lưu ý trên Android
Chrome Android hỗ trợ Web Push đầy đủ
Người dùng có thể cài thành PWA để nhận thông báo ổn định hơn
Microsoft Edge
Cách bật thông báo
Truy cập domain của bạn
Tại thanh địa chỉ → nhấn biểu tượng khóa
Chọn Permissions for this site
Bật Notifications
Lưu ý
Edge sử dụng nhân Chromium → hoạt động tương tự Chrome
Web Push hoạt động ổn định trên Windows
Safari (macOS)
Điều kiện để Safari hỗ trợ Web Push
macOS Ventura trở lên
Safari 16+
Domain bắt buộc HTTPS
Cách bật thông báo
Mở Safari → truy cập Frontend Domain
Click Allow khi có popup
Kiểm tra trong System Settings → Notifications → Safari
Lưu ý quan trọng
Safari trên iPhone CHƯA hỗ trợ Web Push cho domain tùy chỉnh, chỉ hỗ trợ Web Push cho PWA được “Add to Home Screen”.
Người dùng cần cài PWA để nhận thông báo trên iPhone.
