Hướng dẫn tích hợp thanh toán vào website - Payment adayroi

1. Giới thiệu về VietPay

VietPay là nền tảng thanh toán trực tuyến dành cho thị trường Việt Nam, hỗ trợ nhiều phương thức linh hoạt:

• Xác nhận tự động qua lắng nghe SMS chuyển khoản (2 cách cũ).
• Mới: Thanh toán nhanh qua QR Code Việt Nam (VietQR) bằng SDK JavaScript – khách hàng quét QR bằng app ngân hàng/mobile banking để chuyển khoản tức thì.

Số tài khoản nhận tiền mặc định: 0936006058

2. Bắt đầu (Get Started)

Bước 1: Đăng ký tài khoản Developer

• Truy cập https://developer.vietpay.vn và đăng ký tài khoản Business.
• Sau khi đăng ký và được duyệt, bạn nhận được:
  • Production Secret Key (mã token bí mật dùng để khởi tạo QR Code).
  • Hướng dẫn tải app APK (cho phương thức SMS tự động).
  • API Key (nếu dùng webhook).

Bước 2: Thiết lập Webhook (Khuyến nghị)

Để nhận thông báo thanh toán thành công ngay lập tức:

• Vào Dashboard → Webhooks → Thêm URL (ví dụ: https://your-site.com/webhook/vietpay).
• Hệ thống sẽ POST dữ liệu JSON khi thanh toán được xác nhận (bằng bất kỳ phương thức nào).

3. Các Phương thức Tích hợp Thanh toán

Phương thức 1: Chuyển tin nhắn SMS thủ công

(Như phiên bản trước – giữ nguyên)

Phương thức 2: Sử dụng app APK Android để lắng nghe SMS tự động

(Như phiên bản trước – giữ nguyên)

Phương thức 3: Tích hợp SDK JavaScript – Hiển thị QR Code Thanh toán (Khuyến nghị cho Website)

Đây là cách hiện đại, nhanh chóng và chuyên nghiệp nhất. Khách hàng chỉ cần quét QR bằng app ngân hàng (MB Bank, Vietcombank, BIDV, Techcombank, Momo, ZaloPay…) là hoàn tất thanh toán.

Bước tích hợp:

1. Nhúng SDK JavaScript Thêm đoạn script sau vào phần <head> hoặc trước thẻ đóng </body> của trang thanh toán:
   HTML

    

   <script src="/https://www.payment.adayroi.online/public/js/sdk.js"></script>

    

    
2. Chuẩn bị container hiển thị QR Code Thêm một div trống nơi bạn muốn QR Code xuất hiện:
   HTML

    

   <div id="qrcode-button-container"></div>

    

    
3. Khởi tạo thanh toán sau khi có đơn hàng Gọi hàm payment_adr.init() với các tham số sau:
   JavaScript

    

   let data_order = {
       order_id: "12345",                  // Mã đơn hàng trong hệ thống của bạn (bắt buộc)
       order_number: "ORD-20251224-001",   // Mã đơn hàng hiển thị (tùy chọn)
       customer_id: "",                    // ID khách hàng (nếu có)
       customer_name: "Nguyễn Văn A",      // Tên khách hàng
       customer_email: "abc@example.com",
       customer_phone: "0901234567",
       customer_address: "",
       sub_total: 30000,                   // Tổng tiền trước thuế/giảm giá
       tax: 0,
       discount: 0,
       total: 30000,                       // Tổng tiền cuối cùng (bắt buộc)
       payment_method: "vietqr",           // Để trống hoặc "vietqr"
       payment_status: "unpaid",
       order_status: "pending",
       note: "Thanh toán khóa học XYZ",    // Ghi chú hiển thị trong nội dung chuyển khoản
       created_at: new Date().toISOString(),
       details: [                          // Danh sách sản phẩm (tùy chọn nhưng khuyến nghị)
           {
               product_id: "COURSE001",
               product_name: "Khóa học lập trình React",
               product_sku: "REACT2025",
               price: 30000,
               quantity: 1,
               total: 30000
           }
       ]
   };
   
   // production_secret_key: Lấy từ Dashboard Developer → Applications → Secret Key
   payment_adr.init('#qrcode-button-container', 'YOUR_PRODUCTION_SECRET_KEY', data_order);

    

    
4. Kết quả hiển thị
   • SDK sẽ tự động tạo và hiển thị QR Code VietQR động (đã nhúng sẵn thông tin tài khoản 0936006058, số tiền, nội dung chuyển khoản chứa mã đơn hàng).
   • Khách hàng quét QR → chuyển khoản → hệ thống VietPay nhận SMS hoặc xác nhận từ ngân hàng → tự động cập nhật trạng thái → gửi webhook đến bạn.
5. Xử lý Webhook (bắt buộc để cập nhật đơn hàng) Ví dụ Node.js/Express:
   JavaScript

    

   app.post('/webhook/vietpay', express.json({verify: (req, res, buf) => req.rawBody = buf}}), (req, res) => {
       const data = req.body;
       if (data.status === 'success' && data.order_id) {
           // Cập nhật đơn hàng trong database thành "paid"
           console.log(`Đơn hàng ${data.order_id} đã thanh toán thành công ${data.amount} VND`);
       }
       res.sendStatus(200);
   });

    

    

Lợi ích của phương thức QR Code:

• Trải nghiệm người dùng cực tốt, thanh toán trong 10 giây.
• Tự động xác nhận (không cần forward SMS thủ công).
• Hỗ trợ hầu hết ngân hàng và ví điện tử Việt Nam.
• An toàn, không lộ thông tin tài khoản cho khách hàng.

4. Testing

• Test QR Code: Sử dụng Sandbox Secret Key (lấy từ Dashboard) và môi trường test. QR sẽ hiển thị bình thường nhưng giao dịch là giả lập.
• Test Webhook: Dashboard có nút "Send Test Webhook" để kiểm tra.
• Test SMS: Vẫn áp dụng như cũ.

5. Go Live

• Thay Sandbox Secret Key bằng Production Secret Key.
• Kiểm tra kỹ webhook trên môi trường thực.
• Đảm bảo website dùng HTTPS (bắt buộc để nhúng SDK an toàn).

Nếu bạn cần mình bổ sung thêm:

• Mẫu tích hợp đầy đủ cho Vue/React/PHP/Laravel
• Hướng dẫn tạo Secret Key trên dashboard
• Mẫu email/SMS thông báo cho khách hàng