NPM包react-native-payments-addon-braintree使用教程

阅读时长 5 分钟读完

简介

随着移动支付的发展,越来越多的应用需要用到移动支付功能。Braintree是一款支付服务提供商,在其SDK的基础上,有一款React Native的插件:react-native-payments-addon-braintree。这款插件可以帮助开发者在React Native应用中集成Braintree支付服务,快速搭建移动支付解决方案。

安装

使用NPM安装插件:

集成

在React Native项目中使用Braintree支付服务,需要进行以下集成步骤:

1. 导入库

在你的React Native应用程序的根目录下,新建一个文件夹,命名为 “ios ”或“android”, 根据你的应用程序的实际系统目录来命名。

然后,将第三方库和框架添加到你的应用程序之中。 如果你的应用程序是iOS应用程序,则需要将库文件添加到“ios”目录下。 如果你的应用程序是Android应用程序,则需要将库文件添加到“android”目录下。这些库文件需要手动添加。React Native 不会为你处理此任务。

2. 配置Gradle

android/app/build.gradle中添加以下代码:

3. 配置Xcode

ios/[app name]/Info.plist中添加以下代码:

-- -------------------- ---- -------
---------------------------------
------
    -----------------------------
    ------
        -----------------------------------
        ------
            ---------------------------------------------
            -------
        -------
    -------
-------

4. 初始化插件

-- -------------------- ---- -------
------ --------- ---- ---------------------------------------

-- ---------- --- --------- -------
----------------------
  ---------- -----------------
  -------- ------------------------
-- -------- -- -
  ---------------
    ---------------- ------
  ---
-- ------- -- -
  -------------------- ------------ --------- --------- -------
---

authToken是Braintree的服务器授权令牌,可以在你的Braintree账户中获得。

baseURL是用于与Braintree服务器通信的URL,你需要将其设置为你自己的服务器地址。

5. 创建一个支付 UI

-- -------------------- ---- -------
------ - --------------- - ---- ---------------------------------

----- ------------- ------- --------- -

  ------------------ -
    -------------

    ---------- - -
      ----------- --
    --
  -

  -------- -
    ------ -
      ----------------
        ---------------- -- -
          -------------------------- -------
        --
      --
    --
  -
-

6. 发起支付

-- -------------------- ---- -------
------ --------- ---- ----------------------------------------

--- ----------- - -
  ------- ---------
  -------- ---------
--

----------------------------------------------------- ------------ ------- -- -
  -- ------- ----------
-- ------- -- -
  -- ------- -------
---

这样你就可以在你的React Native应用中使用Braintree付款了!

总结

以上是如何在React Native应用中集成Braintree支付服务的配方。希望这篇文章对你有所帮助。如果你有任何问题需要帮助,请随时联系我们。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005726181e8991b448e88dc

纠错
反馈