我的 ionic

<转>ionic3 app 调用微信支付(插件)

2018-05-11  本文已影响60人  thisDong

最近看到了一篇较新的关于ionic3微信支付的文章,觉得不错,值得收藏。在没有征得作者的同意的下,顺手转了过来。如果不妥请作者通知我。贴上原文地址:《ionic3 app 调用微信支付(插件)》

本文章你可以学会如何使用ionic插件进行微信支付;

本章会分5部分来介绍如何完成一个ionic app微信支付的过程;

1.准备

ionic 环境 (安装node.js与ionic). ionic官网(打不开的同学想办法翻个墙);

微信开放平台账号,并且创建对应的移动应用,并且需要已经拥有微信支付的能力;

没有的同学可以去微信开放平台注册账号,然后登陆去搞事情;

一套填完之后,就等着审核吧,只有审核成功之后后面的支付才能调用哦;申请完我们就有AppID和AppSecret;

2.ionic 微信支付插件

安装插件

ionic cordova plugin add cordova-plugin-wechat  --variable wechatappid=yourWeChatAppid

安装ionic2、3调用

npm install wechat-chenyu --save

安装完成后,在app.module.ts中引入

import {WechatChenyu} from "wechat-chenyu";
...
@NgModule({
  ...
  providers: [
  ...
  WechatChenyu
 ...
 ]
...
})

然后就是在需要的地方调用你的支付(别忘记import {WechatChenyu} from "wechat-chenyu";)

this.api.post('wxpay/createPay', params)

.subscribe(res => {//payinfo已经是json对象了,封装了调起支付的各个参数
  let payinfo: JSON = JSON.parse(res["data"]);
  this.wechatChenyu.sendPaymentRequest(payinfo).then((data) => {
          //成功之后的跳转...
  }, eoor => {
        alert(eoor);
        console.log(eoor); // Failed
     }
  );
});

支付参数请查看此处;参数都是后台返回过来,请参看微信app支付的统一下单与调起支付接口;

插段java返回的参数代码

Map <String, String> packageParams = new HashMap<String, String>();  
packageParams.put("appid", WxPayConfig.appid);      //应用id  
packageParams.put("partnerid", WxPayConfig.mch_id); //商户号  
packageParams.put("prepayid", result.get("prepay_id")); //统一下单返回的预付款订单号  
packageParams.put("noncestr", result.get("nonce_str")); //统一下单返返回的随机字符串  
packageParams.put("timestamp", System.currentTimeMillis() / 1000 + "");  
packageParams.put("package", "Sign=WXPay");  
String packageSign = PaymentKit.createSign(packageParams, WxPayConfig.key);  
packageParams.put("sign", packageSign);  

签名什么的都按微信支付文档上走就可以了;

3.app打包并使用

打包分为android和ios平台;可参考的文章很多就不列举了,只是强调一下,打包apk是必须要签名,而且签名和包名必须要与移动申请时一致;否则也是无法调起的;

一定要看微信文档;调用起来美滋滋

参考

添加微信支付 https://blog.csdn.net/m0_37609394/article/details/79023710
ios打包 https://www.jianshu.com/p/cf2d24d74349

上一篇下一篇

猜你喜欢

热点阅读