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 ứng dụng mẫu cloud-functions-stripe-sample.web.app nguồn mở của riêng bạn.

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

Tổng quan về quy trình 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 của bạn lên Gói giá linh hoạt (trả tiền theo mức dùng).
  4. Định cấu hình giao diện dòng lệnh (CLI) Firebase để sử dụng dự án của bạn với firebase use --add.
  5. Lấy mã nguồn cho ứng dụng Firestripe mẫu. Định cấu hình mã nguồn đó 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 của bạn.
  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. Lấy mã nguồn.
  2. Bật tính năng đăng nhập bằng Google và email trong chế độ cài đặt nhà cung cấp dịch vụ 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 của 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ả cá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 cho 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ẻ kiểm thử 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à tính phí cho 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 liền mạch cho người dùng, bạn có thể tuỳ chỉnh thêm giao diện trang thanh toán hoặc kết nối trang này với ứng dụng hiện có.

Xem các khoản thanh toán đã được 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 và 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 của bạn và nếu họ đã thêm thẻ tín dụng hoặc thực hiện giao dịch, hãy xem danh sách những thẻ tín dụng hoặc giao dịch đó trong mỗi người dùng.

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 khoá thử nghiệm thành khoá 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 của 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 Functions và Hosting để các thay đổi có hiệu lực: firebase deploy.