Xử lý khoản thanh toán bằng Firebase

Bằng cách sử dụng một số tính năng của Firebase và Stripe, bạn có thể xử lý các khoản thanh toán trong ứng dụng web mà không cần xây dựng cơ sở hạ tầng máy chủ của riêng mình. Hướng dẫn này sẽ hướng dẫn bạn cách tuỳ chỉnh và triển khai phiên bản của riêng bạn cho ứng dụng mẫu cloud-functions-stripe-sample.web.app nguồn mở.

Trước khi bắt đầu, hãy tạo một dự án trong bảng điều khiển Firebase và thiết lập tài khoản Stripe.

Tổng quan về cách triển khai

  1. Thiết lập tài khoản Stripe.
  2. Tạo một dự án trong bảng điều khiển của Firebase.
  3. Nâng cấp dự án lên Gói giá linh hoạt (trả tiền theo mức dùng).
  4. Định cấu hình CLI Firebase để sử dụng dự án của bạn với firebase use --add.
  5. Tải mã nguồn cho ứng dụng Firestripe mẫu. Định cấu hình ứng dụng bằng thông tin phù hợp cho dự án của bạn và tuỳ chỉnh mã cho phù hợp với ứng dụng.
  6. Sau khi triển khai ứng dụng, hãy tìm danh sách người dùng và giao dịch trong bảng điều khiển của Firebase.

Thiết lập và triển khai ứng dụng mẫu

  1. Tải mã nguồn.
  2. Bật tính năng Đăng nhập bằng Google và Email trong phần cài đặt nhà cung cấp xác thực.
  3. Bật Cloud Firestore.
  4. Cài đặt Firebase CLI nếu bạn chưa cài đặt và đăng nhập bằng firebase login.
  5. Định cấu hình mẫu này để sử dụng dự án của bạn với firebase use --add.
  6. Cài đặt các phần phụ thuộc cục bộ bằng cách chạy cd functions; npm install; cd -
  7. Thêm Khoá bí mật API Stripe vào cấu hình môi trường Cloud Functions:

    firebase functions:config:set stripe.secret=<YOUR STRIPE SECRET KEY>

  8. Đặt khoá có thể xuất bản của Stripe trong /public/javascript/app.js:

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. Triển khai dự án bằng firebase deploy. Lệnh này:

    1. Gửi tất cả tệp trong thư mục public đến Hosting để trang web của bạn có thể truy cập được.
    2. Gửi mã trong thư mục functions đến Cloud Functions for Firebase.
    3. Đặt các quy tắc bảo mật trên cơ sở dữ liệu Cloud Firestore như được định cấu hình trong firestore.rules. Các quy tắc được cung cấp chỉ cho phép người dùng đọc và ghi các khoản thanh toán cũng như phương thức thanh toán của riêng họ.

Kiểm thử ứng dụng mẫu

Truy cập vào URL của ứng dụng thanh toán tại your-firebase-project-id.web.app và xác minh rằng các tính năng sau hoạt động:

  • Bạn có thể đăng nhập qua Google hoặc Email.
  • Bạn có thể thêm một thẻ thử nghiệm Stripe mới và xem thẻ đó trong phần tử chọn thẻ.
  • Bạn có thể chọn một trong các thẻ của mình và nạp tiền vào thẻ đó.
  • Bạn có thể đăng xuất.

Để so sánh, hãy xem cloud-functions-stripe-sample.web.app.

Để mang lại trải nghiệm đơn giản cho người dùng, bạn có thể tuỳ chỉnh thêm giao diện của trang thanh toán hoặc cắm trang thanh toán vào ứng dụng hiện có.

Xem các khoản thanh toán đã xử lý

Sau khi thiết lập và triển khai trang thanh toán, bạn có thể kiểm tra bảng điều khiển Firebase để xem danh sách người dùng cùng với phương thức thanh toán và khoản thanh toán của họ.

  1. Chuyển đến Cloud Firestore.
  2. Kiểm tra danh sách người dùng và danh sách thẻ tín dụng hoặc giao dịch mà họ đã thêm trong mỗi người dùng (nếu có).

Chấp nhận thanh toán trực tiếp

Khi đã sẵn sàng phát trực tiếp, bạn cần đổi mã thử nghiệm thành mã phát trực tiếp. Hãy xem tài liệu của Stripe để tìm hiểu thêm về các khoá này.

  1. Cập nhật cấu hình khoá bí mật Stripe:

    firebase functions:config:set stripe.secret=<YOUR STRIPE LIVE SECRET KEY>

  2. Đặt khoá có thể phát hành trực tiếp trong /public/javascript/app.js.

  3. Triển khai lại cả Cloud FunctionsHosting để các thay đổi có hiệu lực: firebase deploy.