Stripe 是一款非常流行的支付解决方案，而 Express.js 则是一款灵活而且易于使用的 Node.js Web 框架。在本文中，我们将学习如何结合使用这两个工具，实现一个简单而又实用的支付系统，并为大家提供一些有用的指导意义。让我们开始吧！
Stripe 入门
Stripe 是一个在线支付平台，可以帮助你处理信用卡支付、退款等操作。使用 Stripe，你不必自己开发支付功能，而是可以使用 Stripe 的 API 来处理所有支付相关的操作。下面让我们来一步步了解如何使用 Stripe。
官网注册
在使用 Stripe 之前，你需要在官网注册一个账号。注册非常简单，只需要填写基本信息即可。注册成功后，你可以看到你的账户的 dashboard 页面，这里将给你提供一些有关使用 Stripe 的资料和帮助。
API Keys
使用 Stripe 的 API 需要 API Keys，即访问支付功能所需的一组验证信息。Stripe 提供了两种类型的 API Keys：测试环境和生产环境。测试环境的 API Keys 用于开发和测试，生产环境的 API Keys 用于实际的生产环境。你可以在账户的 dashboard 页面的 API Keys 中找到你的 API Keys。
Stripe 模式
Stripe 模式是 Stripe 在处理支付时的一种特殊处理方式。例如，在 Stripe 模式下，用户将会被重定向到一个特定的 Stripe 页面，其中包含了支付表单，用户需要输入信用卡信息进行支付。Stripe 模式的好处在于，它使支付过程更加简单，可以提高用户体验。
使用 Node.js 安装 Stripe
Stripe 提供了 Node.js 的库，可以轻松地将 Stripe 集成到你的应用中。你可以使用 npm 来安装它，只需要运行以下命令即可：
--- ------- ------
这样就可以将 Stripe 集成到你的应用中了，接下来我们来学习如何使用 Express.js 和 Stripe。
Express.js 和 Stripe 集成
在使用 Express.js 和 Stripe 之前你需要先创建一个 Express.js 的应用，如果你不知道如何创建，可以参考 Express.js 起步。接下来，我们将通过几个步骤来了解如何使用 Express.js 和 Stripe 集成。
安装 Stripe
首先，我们需要安装 Stripe 库。你可以使用以下命令来安装 Stripe：
--- ------- ------
添加 Stripe Keys 配置
在使用 Stripe 之前，你需要在你的项目中配置 Stripe Keys。为了配置 Stripe Keys，我们可以在 .env 文件中定义他们。这样我们的 Stripe Keys 不会暴露在我们的代码中。
- ---- ----------------------------- -----------------------------
你需要将 sk_test_xxx 和 pk_test_xxx 分别改成你的 Stripe Keys 的值，这些值可以在 Stripe 的 dashboard 页面中找到。
添加 Stripe Routes
创建一个路由文件来定义处理 Stripe 相关的请求。例如，我们可以在 routes/stripe.js 中实现一个处理创建新订单的功能：
-- ----------------
----- ------ - ----------------------------
----- ------ - -------------------------------------------------
--------------------------------------- ----- ----- ---- -- -
----- -------- - -
- --- -- ----- -------- --- ------ --- --
- --- -- ----- -------- --- ------ --- --
--
----- - ----- - - ---------
----- --------- - -------------- -- -
----- ------- - --------------- -- ---- --- ---------
------ -
----- -------------
------------ -------------
------- ------------------------------------
------- ------------- - ----
--------- ------
--------- --------------
--
---
----- ------- - ----- ---------------------------------
--------------------- ---------
---------------------------- - ------------------ ------ ----- --
----------- ----------
----- ----------
------------ -------------------------------
----------- ------------------------------
---
---------- --- ---------- ---
---
-------------- - -------在上面的代码中，我们定义了一个 create-checkout-session 路由，它将返回一个 Stripe checkout session，其中包含了购买商品的一些信息，例如订单总价，支付方式等。在上面的代码中，我们定义了一个配置对象，包含了下列信息：
- payment_method_types：支付方式。
- shipping_address_collection：收货地址信息。
- line_items：商品明细。
- mode：支付模式。
- success_url：支付成功后的链接。
- cancel_url：支付取消后的链接。
Stripe 的 API 提供了许多可自定义的选项，你可以根据你的需求来调整上面的配置。
在应用中使用 Stripe Routes
在你的应用中使用 Stripe routes 很简单，只需要将 Stripe routes 添加到你的主应用中即可。例如，在 app.js 中添加 Stripe routes：
-- ------ ----- ------- - ------------------- ----- --- - ---------- ----- ------------ - --------------------------- ---------------------------- --------- ----- ---- ------------------------ ------------------ --------------
在上面的代码中，我们将 /stripe 路径下的请求分发到 Stripe routes 中。你可以根据你的需求来调整这个路径。
在你的前端应用中使用 Stripe Elements
使用 Stripe Elements 可以帮助你轻松地集成 Stripe 支付表单到你的应用中。Stripe 已经为你准备好了一个易于使用的 JavaScript 库，用于创建自定义的 Stripe 支付表单。下面是一个示例代码：
---- --------- ---
--------- -----
----- -------------
------
----- ----------------
----- --------------- ---------------------------- -------------------
------------- ------- ------------
------- -----------------------------------------
-------
------
------------
-------
-------
----
-------------
-------------
-----------
-----------
-----
--------
-------
----
----------
----------- ------
----------------
----------
-----
----
----------
----------- ------
----------------
----------
-----
--------
--------
-----------
---- ------------------------
--------
----- ------ - --------------------------------------
----- -------- - ------------------
----- ---- - ------------------------
----------------------------
----- ---- - ----------------------------------------
------------------------------- ----- ------- -- -
-----------------------
----- - ------------- - - ----- ----------------------------
----- -------
----- -----
---------------- -
----- ------ -------
--
---
----- -------- - ----- ---------------------------------------- -
------- -------
-------- -
--------------- -------------------
--
----- ----------------
------ -
- --- -- --------- - --
- --- -- --------- - --
--
---
---
----- - --- --------- - - ----- ----------------
----- ------ - ----- ------------------------------------ -
--------------- -----------------
---
-- -------------- -
------------------------------------
- ---- -
----------------------------------
-
---
---------
-------
-------在上面的代码中，我们将 Stripe 支付表单添加到了页面的 #payment-form 容器中，使用 Stripe 提供的 elements.create 方法实现。接下来，在提交表单时，我们使用 stripe.createPaymentMethod 方法来创建一个 Stripe Payment Method，它将会包含了用户的支付信息。然后，我们将 Stripe Payment Method 和购买商品的信息一起提交到后端，上面已经实现过了，我们接收到一个 Stripe session ID。最后，我们调用 stripe.confirmCardPayment 方法来完成支付操作。Stripe Elements 的使用非常简单，你可以根据你的需求自定义你的表单。
总结
在本文中，我们使用 Express.js 和 Stripe 分别实现了一个简单的支付系统。我们首先了解了 Stripe 和它的基本概念，然后介绍了如何使用 Node.js 安装 Stripe、配置 Stripe Keys，然后我们定义了一个处理创建新订单请求的路由。最后，我们介绍了如何在你的前端应用中使用 Stripe Elements，它可以帮你轻松地集成 Stripe 支付表单到你的应用中。希望这篇文章对你们有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64ce4f19b5eee0b52562aec4