ReactNative支付宝支付问题

支付宝支付功能嘛。。。这东西就比较严重了。。。因为涉及到各种侵权，非法交易等问题，因此中间环节有一大堆，不仅复杂还难懂，各种加密手段。。。但是作为一个前端开发人员的我们有必要知道这些吗？？？有吗？？？知道了又不能上天。。。只能让你高大上的装个X，然并卵。。。

那么我们只要单纯的知道以下几步就OK了。。。

1、联网获取订单信息。。。也就是ajax了，我们RN中用fetch 换了个名，本质还是ajax

2、根据拿到的订单信息调用支付宝接口发起支付。。。(Android中的不同应用间互相调用)

3、输入支付宝密码开始支付。。。

4、返回支付成功还是支付失败。。。

没了。。。

那么怎么使用这个支付宝支付呢？？？

1、安装react-native-yunpeng-alipay 模块

切换到工程根目录下打开cmd 输入:npm install react-native-yunpeng-alipay --save

等待下载完成就好了。。。

2、引入该模块。。。

import Alipay from 'react-native-yunpeng-alipay'

3、我们根据上面的第二步知道Android端不同应用之间相互调用需要一些配置，配置也很简单:

1)、打开AndroidManifest.xml配置文件复制下面一句话进去，原则相同类型的代码放一起。。。下面这段代码就是一个activity标签，那么在这个文件下找到有activity标签的地方，跟他们放一块就好了。。。

<activity android:name="com.alipay.sdk.app.H5PayActivity" android:configChanges="orientation|keyboardHidden|navigation" android:exported="false" android:screenOrientation="behind" > </activity> <activity android:name="com.alipay.sdk.auth.AuthActivity" android:configChanges="orientation|keyboardHidden|navigation" android:exported="false" android:screenOrientation="behind" > </activity>

2)、权利声明部分原则跟上面一致：

<uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /> <uses-permission android:name="android.permission.READ_PHONE_STATE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

4、配置文件也改好了，那么下面就是写代码了，代码也非常简单就一个方法而已。。。

pay(){

        //我们要根据支付宝要求的RSA验证机制，通过网络访问，跟服务器要一个符合该验证机制的支付订单

        fetch('我们服务器的地址')   //后台会告诉，我们不用理会

            .then((response) => response.json())

            .then((responseJson) => {

              //拿到json中的订单信息

               var payInfo= responseJson.xx.xxx.xxxxx

                //使用拿到支付订单，结合我们导入的代码发起支付

                Alipay.pay(payInfo).then(function(data){

                    console.log('支付成功');

                }, function (err) {

                    console.log('支付失败');

                });

            })

            .catch((error) => {

                console.error(error);

            });

}

 

想了解更多请查看下面俩网站:

https://www.npmjs.com/package/react-native-yunpeng-alipay

http://blog.csdn.net/u011413061/article/details/53183370