Atoms
Trình kết nối

Kết nối Stripe

MGX hiện hỗ trợ cấu hình nhanh thanh toán Stripe thông qua Supabase Edge Functions.

Yêu cầu

Trước khi tích hợp Stripe, hãy đảm bảo bạn có:

  • Một ứng dụng MGX đang hoạt động.
  • Dự án MGX đã được kết nối với một Dự án Supabase. (Tìm hiểu thêm về Supabase.)
  • Đã tạo sản phẩm và các mức giá tương ứng trong bảng điều khiển Stripe của bạn.

Lưu ý: Không thể sử dụng chế độ Preview để kiểm tra chức năng thanh toán. Hãy triển khai app MGX của bạn và chuyển Stripe sang Test Mode để xác minh việc tích hợp.

Thẻ kiểm thử:

  • Số thẻ: 4242 4242 4242 4242
  • Ngày hết hạn: Bất kỳ ngày nào trong tương lai
  • CVC: Bất kỳ số có 3 chữ số nào

Thiết lập thanh toán Stripe

  1. Kết nối Supabase

    • Nhấp vào nút Supabase ở góc trên bên phải của MGX
    • Làm theo Hướng dẫn Kết nối Supabase để chọn Dự án Supabase mục tiêu của bạn
    • Sau khi kết nối, bạn có thể cấu hình cài đặt thanh toán thông qua Supabase
  2. Mô tả yêu cầu đăng ký của bạn bằng ngôn ngữ tự nhiên

    • Ví dụ: Tạo một hệ thống thanh toán hỗ trợ ba gói đăng ký với mức giá $4.99 mỗi tuần, $14.99 mỗi tháng và $149.99 mỗi năm.

    Sau khi gửi, MGX Agent sẽ tạo các nút cấu hình. Bạn sẽ cần điền ít nhất hai trường.

  3. Nhấp vào nút Add Stripe Secret Key

    • Nhập khóa bí mật Stripe của bạn vào trường STRIPE_SECRET_KEY.
    • Với mỗi gói, nhập Stripe Price ID tương ứng vào trường kết thúc bằng PRICE_ID.

    Bạn có thể lấy khóa bí mật Stripe của mình tại đây: https://dashboard.stripe.com/test/apikeys

    Điều hướng đến Product Catalog > Products, lấy price ID bằng một trong các cách sau:

    • Trong danh sách "Pricing", nhấp vào nút “More” ở bên phải của mức giá tương ứng, sau đó nhấp vào "Copy Price ID".

    Bạn cũng có thể nhấp trực tiếp vào tên mức giá để mở trang chi tiết, sau đó sao chép price ID hiển thị ở góc trên bên phải.

    Cuối cùng, dán chính xác từng price ID vào trường nhập tương ứng.

    Lưu ý: Vì quyền riêng tư và bảo mật, không bao giờ dán trực tiếp khóa bí mật của bạn vào chat MGX. Việc lộ khóa có thể cho phép truy cập trái phép vào tài khoản Stripe của bạn. Thay vào đó, hãy sử dụng nút "Add API Key" của MGX để lưu trữ khóa một cách an toàn.

  4. Nhấp vào nút Add Stripe Webhook Secret Key

    • Nhập Webhook Secret Key của bạn
  5. Cách tìm Webhook Secret Key:

    Trong Stripe, nhấp vào “Developers” ở góc dưới bên trái, sau đó chọn tùy chọn Webhooks.

    Trên trang Webhooks, nhấp vào nút "Add destination".

    Chọn các sự kiện webhook phù hợp với nhu cầu dự án của bạn:

    • checkout.session.async_payment_failed
    • checkout.session.async_payment_succeeded
    • checkout.session.completed
    • checkout.session.expired

    Sau khi nhấp vào "Continue", chọn "Webhook endpoint."

    Nhập URL endpoint từ Supabase.

  6. Cách tìm URL Endpoint Supabase của bạn:

    Nhấp vào View Edge Function trong MGX.

    • Nhấp để chọn edge function có hậu tố _webhook tương ứng.

    • Trong bảng Details của edge function tương ứng, sao chép Endpoint URL và dán vào Stripe Event Destination.

  7. Kiểm tra Tích hợp của bạn

    Sử dụng Test Mode của Stripe để kiểm tra thanh toán.

    Chi tiết thẻ kiểm thử:

    • Số thẻ: 4242 4242 4242 4242
    • Bất kỳ ngày hết hạn nào trong tương lai
    • Bất kỳ CVC 3 chữ số nào

Câu hỏi thường gặp

Tại sao tôi không thể kiểm tra thanh toán trong Preview Mode?

Preview Mode chạy trong môi trường cục bộ, môi trường này không cung cấp URL Webhook có thể truy cập công khai. Bạn phải triển khai app của mình để nhận các sự kiện Stripe.

Làm cách nào để chuyển sang Production Mode?

Bạn có thể tắt Test Mode trong Stripe Dashboard và sử dụng Secret Key và Webhook Secret trực tiếp của mình.

Làm cách nào để xác minh liệu một khoản thanh toán thử nghiệm đã thành công hay chưa?

Sau khi hoàn tất một khoản thanh toán thử nghiệm, hãy truy cập trang Payments trong Stripe để xem bản ghi giao dịch thử nghiệm của bạn.

Trang này có hữu ích không?

Bài viết liên quan