使用 Firebase 处理付款

使用几个不同的 Firebase 功能和 Stripe，您可以在您的网络应用程序中处理付款，而无需构建自己的服务器基础架构。本指南将引导您自定义和部署您自己的开源cloud-functions-stripe-sample.web.app示例应用程序版本。

在开始之前，请在Firebase 控制台中创建一个项目并设置一个Stripe帐户。

实施概述

  1. 设置一个条纹帐户。
  2. 在Firebase 控制台中创建一个项目。
  3. 为您的项目启用计费功能并将 Firebase CLI 配置为通过firebase use --add使用您的项目。
  4. 获取示例 Firestripe 应用程序的源代码。使用适合您项目的正确信息对其进行配置，并自定义代码以适合您的应用程序。
  5. 部署应用后，在 Firebase 控制台中查找用户和事务列表。

设置和部署示例应用

  1. 获取源代码。
  2. 在您的身份验证提供商设置中启用 Google 和电子邮件登录。
  3. 启用Cloud Firestore 。
  4. 如果您还没有安装Firebase CLI ，请使用firebase login 。
  5. 将此示例配置为通过firebase use --add使用您的项目。
  6. 通过运行cd functions; npm install; cd -

  7. 将您的Stripe API 密钥添加到您的 Cloud Functions 环境配置中：

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

  8. 在/public/javascript/app.js中设置您的Stripe 可发布密钥：

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. 使用firebase deploy部署您的项目。这个命令：

    1. 将public目录中的所有文件发送到 Hosting，以便您的网站可用。
    2. 将functions目录中的代码发送到 Cloud Functions for Firebase。
    3. 按照firestore.rules中的配置在 Cloud Firestore 数据库上设置安全规则。提供的规则仅允许用户读取和写入他们自己的付款和付款方式。

测试示例应用

在your-firebase-project-id.web.app访问您的付款应用的 URL，并验证以下功能是否有效：

  • 您可以通过 Google 或电子邮件登录。
  • 您可以添加新的Stripe 测试卡并在卡选择元素中查看它。
  • 您可以选择一张卡并对其进行收费。
  • 您可以退出。

如需比较，请参阅cloud-functions-stripe-sample.web.app 。

要为您的用户提供简化的体验，您可以进一步自定义支付页面的外观，或将其插入现有应用程序。

查看已处理的付款

设置并部署付款页面后，您可以检查 Firebase 控制台并查看用户列表以及他们的付款方式和付款方式。

  1. 转到Cloud Firestore 。
  2. 检查您的用户列表，如果他们添加了任何信用卡或进行了任何交易，请查看每个用户下的列表。

接受实时付款

准备好上线后，您需要将测试密钥交换为实时密钥。请参阅Stripe 文档以了解有关这些键的更多信息。

  1. 更新您的 Stripe 密码配置：

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

  2. 在/public/javascript/app.js中设置您的实时可发布密钥。

  3. 重新部署 Cloud Functions 和 Hosting 以使更改生效： firebase deploy 。