React Native+JAVA实现APP程序第三方支付宝快捷登录

第二次写博客，有点小紧张。。。。

因为最近看错了支付宝第三方登录的文档，所以特地请教了我们公司的前端大佬

首先让我先了解一下前端是怎么与支付宝连接的 ：以下是使用React Native开发的移动端

React Native可以直接的编写IOS与安卓的程序，可以让APP开发更轻松                                

  //支付宝登录 _aliLogin ：看作一个js函数，这个方法就是用户点击支付宝登录的图标时候的事件
  _aliLogin() {
      //formData ：是你打算传的参数
      let formData = HttpUtil.getBaseFormData();
      //发送一个请求到程序员的xxx接口，传入参数，data:是返回值。
      HttpUtil.formPost('xxx', formData, (data) => {
          //返回的是json格式的数据
          if (data.success) {
              /** 服务端会返回一个带有签名的一串参数为:data.info，并带入支付宝支付宝的            
               * Alipay.authAlipay接口，之后就支付宝就会成为一个监听事件，
               * 监听用户是否点击‘确认授权’按钮，而点击按钮之前的登录操作是用户与支付宝的交互                
               **/
              Alipay.authAlipay(data.info).then((result) => {
                  /**如果点击‘确认授权’，支付宝会返回成功码:9000，并返回auth_code，用这
                   *个auth_code可以换取支付宝的accessToken,而accessToken可以换取支付宝用                
                   *户的信息**/
                  console.log('支付宝授权' ,result);
                  if(result.resultStatus == '9000'){
                      console.log('授权成功！');
                      let auth_code = Util.getQueryString(result.result,'auth_code');
                      this._getUserInfo('aliPay',auth_code);
                      this.setState({loginType: 'aliPay', aliPayCode: auth_code});
                  }else{
                      Alert.alert('温馨提示', '授权失败！', [{text: '确定'}]);
                  }
              });
          }
      })
  }

好了，再让我看看Java程序吧：先来Controller

    /**
     * 第三方支付宝登录
     * 看到这个xxx是不是很眼熟，没错就是上面前端开始调用的方法名
     * */
    @ResponseBody
    @RequestMapping(method = RequestMethod.POST,value = "/xxx")
    public String xxx(HttpServletRequest request) {
        try{
            return AliPayAuthUtils.getAliLoginParam();
        }catch (Exception e){
            e.printStackTrace();
        }
        return null;
    }

再来Service：

public class AliPayAuthUtils {
    private static final  String APP_ID="APP_ID";
    private static final String APP_PRIVATE_KEY="APP_PRIVATE_KEY"
    private static final String AliPay_PID="AliPay_PID"
    //这个方法用来获取支付宝签名并拼接好参数返回给前端
    public static String getAliLoginParam(){
        try{
            //map参数不清楚的可以百度AlipaySignature.rsaSign这个方法
            //有时间我再更新这篇博客的map参数
            Map<String,String> map=new HashMap<>();
            map.put("apiname","xxxx");
            map.put("app_id",APP_ID);
            map.put("app_name","mc");
            map.put("auth_type","AUTHACCOUNT");
            map.put("biz_type","openservice");
            map.put("method","xxxxx");
            map.put("pid",AliPay_PID);
            map.put("product_id","APP_FAST_LOGIN");
            map.put("scope","kcy");
            map.put("target_id","33");
            map.put("sign_type","RSA");
            //获取签名
            String sign = AlipaySignature.rsaSign(map,APP_PRIVATE_KEY,"utf-8");
            if(Misc.isStringEmpty(sign)){
                return null;
            }
            map.put("sign",sign);
            //把map拼接好参数格式:apiname=com.alipay.account.auth&app_id=APP_ID&.......
            String signContent = AlipaySignature.getSignContent(map);
            return signContent;
        }catch (Exception e){
            e.printStackTrace();
            return null;
        }
    }
}

然后就是前端用户点击‘确认授权’按钮之后的事件了：React Native代码

//_getuserInfo是一个方法带上两个参数fromThree,code
_getuserInfo(code) {
    //code就是上面用户点击‘确认授权’按钮时返回的auth_code
    //最后吧code传入你的后端，进行验证并获取支付宝帐号信息
    HttpUtil.formPost('login',{code : code,},(data) = > {
        if(data.success) {
            alert("第三方支付宝登录成功");
        }
    })
}

最后让我们用auth_code来获取用户的支付宝帐号信息吧：直接上Service

public String login(String code) {
    if(Misc.isNull(code)) {
        return "空的!";
    }
    //用code换取accessToken(访问令牌)
    AlipaySystemOauthTokenResponse alipaySystemOauthTokenResponse = AliPayAuthService.aliPayAuth(code.trim());
    //判断code是否有效
    if(Misc.isNull(alipaySystemOauthTokenResponse) || Misc.isNull(alipaySystemOauthTokenResponse.getAccessToken())) {
        return "你的code是假的，没收了!";
    }
    //让我们拿到accessToken
    String accessToken = alipaySystemOauthTokenResponse.getAccessToken();
    //alipaySystemOauthTokenResponse不是假的，那我们可以获取很多信息
    //比如userId(用户id)、refreshToken(刷新令牌)、reExpiresIn(刷新令牌的有效时间)....
    //好的，接下来让我们获取支付宝用户信息吧,alipayClient就是支付宝客户端
    AlipayClient alipayClient = new DefaultAlipayClient("https://openapi.alipay.com/gateway.do",APP_ID,APP_PRIVATE_KEY,"json","GBK",ALIPAY_PUBLIC_KEY,"RSA2");
    //创建一个参数请求
    AlipayUserInfoShareRequest request = new AlipayUserInfoShareRequest();
    //请求一下支付宝客户端，快看！然后它响应我们了
    AlipayUserInfoShareResponse response = alipayClient.execute(request,accessToken);
    //判断一下支付宝客户端有没有忽悠我们
    if(response.isSuccess()){
        //成功后可以使用response 拿到我们想要的信息了！
        response.getUserName()//用户名
        response.getAvatar()//用户头像
        //还有好多，我就不写了，(已经懒癌晚期了....)
        //好了，最后木有了，你已经可以为所欲为了！
    } else {
        return null;
    }
             
}

嗯！app登录应该就是酱子了。

看完代码，再让我们看一下APP支付宝登录的设计图吧：（应该会很容易看懂了!）

好了，感觉自己已经很啰嗦了，就不说了，下篇博客见。