如何使用 Stripe (stripe.js) 和 react-native

Question

我正在尝试找到一种将 stripe 与 react-native 结合使用的好方法。最好是不涉及将信用卡详细信息发送到我自己的后端或将我的条带私钥存储在应用程序中的方法。欢迎任何想法！谢谢

Answer 1

我还没有亲自在 React Native 中实现过这个。在我正在处理的应用程序中，这将在接下来的几天内移植过来，但这里是我们如何在不依赖第三方库的情况下在当前应用程序中执行此操作，以及我们将如何在 React Native 中实现。这显然只是一个概念，可以在任何可以进行 HTTP 调用的地方使用。

使用值为 Bearer {PUBLISHABLE_AUTH_TOKEN} 的 'Authorization' header 对 https://api.stripe.com/v1/tokens 进行 POST 调用。在 body (x-www-form-urlencoded) 中输入：

card[name]={NAME_ON_CARD}&card[number]={CARD_NUMBER}&card[exp_month]={CARD_EXP_MONTH}&card[exp_year]={CARD_EXP_YEAR}&card[cvc]={CARD_CVC}

响应将是一个 JSON object，其中包含（除其他外）一个 id 字段。此 ID 字段是您在进行交易时将引用卡的内容，因此此 ID 需要发送到您的服务器并存储。可以存储此 ID 而不必担心 PCI 合规性。

更多信息：https://stripe.com/docs/api#tokens

Answer 2

我运行遇到了用现有库执行此操作的问题，所以我写了一个更好的库。 react-native-stripe 允许您收集信用卡信息，使用 Stripe 对其进行验证，并将其交换为 Stripe 令牌，全部使用本机代码。目前只有 iOS。

Answer 3

我推荐：https://github.com/tipsi/tipsi-stripe

我能够成功连接 React Native 和 Stripe 以创建客户并添加卡片并将令牌保存到我的后端。

Answer 4

我还不确定，但我们想要实现的很简单。

通过react，我们可以通过从前端调用stripe获取卡片信息来实现这一点。然而，React Native 并没有自己的代码。

所以我们需要自己去拿我们需要的东西像这样

curl https://api.stripe.com/v1/tokens \
  -u sk_test_IjzBJWterND0tgdSyEIhDmgS00ODHLjw1a: \
  -d "card[number]"=4242424242424242 \
  -d "card[exp_month]"=7 \
  -d "card[exp_year]"=2021 \
  -d "card[cvc]"=314

你会得到

% curl https://api.stripe.com/v1/tokens \
  -u sk_test_IjzBJWterND0tgdSyEIhDmgS00ODHLjw1a: \
  -d "card[number]"=4242424242424242 \
  -d "card[exp_month]"=7 \
  -d "card[exp_year]"=2021 \
  -d "card[cvc]"=314
{
  "id": "tok_1H2Vt9AxSyQJWoao8qhjHDuh",
  "object": "token",
  "card": {
    "id": "card_1H2Vt9AxSyQJWoao26em4Dps",
    "object": "card",
    "address_city": null,
    "address_country": null,
    "address_line1": null,
    "address_line1_check": null,
    "address_line2": null,
    "address_state": null,
    "address_zip": null,
    "address_zip_check": null,
    "brand": "Visa",
    "country": "US",
    "cvc_check": "unchecked",
    "dynamic_last4": null,
    "exp_month": 7,
    "exp_year": 2021,
    "fingerprint": "IS61beTzZemIdd8p",
    "funding": "credit",
    "last4": "4242",
    "metadata": {
    },
    "name": null,
    "tokenization_method": null
  },
  "client_ip": "153.218.66.247",
  "created": 1594186331,
  "livemode": false,
  "type": "card",
  "used": false
}

您可以使用卡上的tok_照常进行后台收费。

如何使用 Stripe (stripe.js) 和 react-native

how to use Stripe (stripe.js) and react-native

stripe-payments

react-native