ionic3的微信支付

总结通俗来说微信支付一共两步：
1、统一下单（后台来完成， 给微信获得微信返回的支付订单号（prepay_id））

  注意：后台统一下单之后，返回的参数要进行二次签名返回给前台才能使用

2、调起支付接口

  将统一下单取得的prepay_id和其他参数如下等再次（第二次）生成签名，与之前同意下单的签名不相同,将这些参数发送回前台准备进行微信窗口的跳转（调起支付接口）,具体操作见下节。

    微信支付插件安装：cordova plugin add [email protected] --variable wechatappid=xxxxxxxxxx

参数列表：

参数.png

image.png

代码编写：

declare var Wechat: any;  // 此处声明plugin.xml中clobbers对应的值

export interface WechatPayParam {
  // appid:string;
  partnerid: string;
  prepayid: string;
  // package:string;
  noncestr: string;
  timestamp: string;
  sign: string;
}

export class WechatPlugin {


  public static isInstalled() {  //验证是否安装微信
    return new Promise((resolve, reject) => {
      Wechat.isInstalled(result => {
        resolve(result);
      }, error => {
        reject(error);
      });
    });
  }

  public static sendPaymentRequest(params: WechatPayParam) {  //发送支付请求
    return new Promise((resolve, reject) => {
      Wechat.sendPaymentRequest(params, result => {
        resolve(result);
      }, error => {
        reject(error);
      });
    });
  }

  public static auth() { //获取微信个人信息
    return new Promise((resolve, reject) => {
      Wechat.auth(result => {
        resolve(result);
      }, error => {
        reject(error);
      });
    });
  }
}

调用

WeChatAuth() {
    this.payService.WechatPay(Cookie.GetUserIdCookie(),this.orderId).then((data)=>{
      if(data.Status == 'Success'){
        let params = {
          // appid:data.Data.AppId,
          partnerid: data.Data.MchId,  //商户号
          prepayid: data.Data.PrepayId,    //预支付id
          noncestr: data.Data.NonceStr,    //随机数
          // package:'Sign=WXPay',
          timestamp: data.Data.TimeStamp,  //时间戳
          sign: data.Data.Sign,             //签名
        };
        WechatPlugin.sendPaymentRequest(params).then((data:any)=>{
          this.payService.WechatNotify(Cookie.GetUserIdCookie(),this.orderId).then((data)=>{
            if(data.Status == 'Success'){
              this.navCtrl.push("OrderPage");
            }
          },(err)=>{

          })

        },(err)=>{
          let toast = this.toastCtrl.create({
            message: err,
            position: 'middle',
            duration: 1000,
          });
          toast.present();
        })
      }
    },(err)=>{

    })

  }

注意：

1、注意es5和es6的坑，回调函数中的this指向问题，es5 为function(data){}其中的this不是指ts的this而是回调函数中的this 。es6写法为（data）=> this指向为ts中的this。
2、若返回普通错误，说明这个方法本身没问题，且插件安装正确。在统一下单成功的情况下，检查appid / 商户号 /商户支付密钥（不是appSecert）是否和申请通过时的一致！
3、若一致可能是申请通过时间未到24小时（一般要在项目开始时申请，不要先做现申请）！