Skip to content

Implement Polling Mechanism for VietQR Payment Status #34

@TranHuuDat2004

Description

@TranHuuDat2004

Problem Description / Context:

Our system currently utilizes static QR codes generated via vietqr.io to allow customers to pay for orders via bank transfer.
Example QR URL structure: https://img.vietqr.io/image/xxx-compact2.png?amount=<%= (orderTotal * 25255).toFixed(0) %>&addInfo=THANHTOAN%20<%=o_id%>&accountName=xxx

The primary challenge is the lack of an automated or semi-automated mechanism to confirm successful payments. The current workflow involves:

  1. The customer manually performs the bank transfer.
  2. An administrator or staff member must manually check the bank account statements.
  3. The administrator then manually updates the order status within our system.

This process introduces delays in order confirmation and can negatively impact the user experience due to waiting times.

Objective / Desired Outcome:

  • To improve the payment confirmation workflow to reduce manual effort and customer waiting times.
  • (Optional, if a specific solution is preferred) To implement a system where the application (or the client-side) can periodically check the payment status of an order.

Proposed Solutions (Discussion Points):

  1. Client-Side Polling Mechanism:

    • The client-side (payment page) would periodically send an AJAX request to a dedicated server API endpoint (e.g., /check-payment-status/:orderId).
    • The server would query the database for the order's payment status. (Note: The database status would still likely be updated manually by an admin after verifying the bank statement, but the client would be notified once this update occurs).
    • This requires creating the API endpoint on the server and implementing JavaScript logic on the client.
  2. Integration with a Third-Party Payment Gateway:

    • Investigate payment gateways (e.g., PayOS, VNPay, MoMo, or other local providers) that support VietQR as a payment method and offer Webhooks/IPN (Instant Payment Notification).
    • This would allow for fully automated payment confirmation. This is the preferred long-term solution for better automation.
  3. Streamlining Manual Process:

    • If full automation is not immediately feasible, enhancements to the admin interface could be made to expedite the manual lookup of transactions and updating of order statuses.

Acceptance Criteria:

  • (For Polling Solution): Users receive a clear notification on the payment page once their order's payment has been confirmed and updated in the system.
  • (For Payment Gateway Solution): The order status is automatically updated to "Paid" (or equivalent) in the database upon successful payment confirmation from the gateway's webhook.
  • The new payment confirmation process is clearly documented for administrators/staff.

Additional Context:

  • The EJS template currently displaying the QR code:
    <!-- (Paste relevant snippet of your EJS code here if it helps illustrate the current setup) -->
    <img src="https://img.vietqr.io/image/xxx-compact2.png?amount=<%= (orderTotal * 25255).toFixed(0) %>&addInfo=THANHTOAN%20<%=o_id%>&accountName=xxx" alt="QR Code">
  • It's understood that vietqr.io (for static QRs) does not provide direct callbacks or webhooks to our system upon payment.

Assignees: (Assign if applicable)
Labels: enhancement, payment, task, vietqr, ux

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions