ionic 支付宝和微信支付在ionic中的使用,及注意事项
支付宝和微信支付在ionic中的使用,及注意事项
1.支付宝支付支付
1.1.参考demo地址:https://github.com/glustful/ionicPayDemo
(1).支付宝支付插件:com.yoopoon.cordova.plugin.alipay
(2).微信支付插件:cordova.weixin.pay
(3).本地将插件安装到自己的项目中:
[code lang="psd"] 例如: $ cordova plugin add /Users/cxk/myAPP/com.yoopoon.cordova.plugin.alipay $ cordova plugin add /Users/cxk/myApp/cordova.weixin.pay [/code]
(4).查看插件列表是否成功:
[code lang="psd"] $ cordova plugin list [/code]
1.2.支付宝支付和微信支付的用法:
(1).在controller.js或自定义的js里使用:
[code lang="js"] .controller('DashCtrl', function($scope,$ionicLoading) { //支付宝使用: $scope.alipay = function(){ alert("支付宝 "); var myDate = new Date(); var tradeNo = myDate.getTime();//这个是订单号,到时候可以换成后台提供的订单号 var alipayClass = navigator.alipay; var rsa ="MIICdgIBADANBgkqhkiG9w0BAQEFAASCAmAwggJcAgEAAoGBAMv*nB+VTEPXGrB/NOzpTGlbuTMJFaqM+vSUV67Ea2nyvuNHGjLtLAVhjyDVG8DxWTvdHiFhTQV4tSTyCZojLePJlwO4b0ZVJ5jdVxREVAR6UnH6Dw55iBL7wqp5aXLJK8is6srTB5mHCz61ow7EBt7KP8cEQ8jTcB7E4obkgtojAgMBAAECgYB1s7geJUKeCyPGui/+gd03G1mhN6XjkPd9OA5LR/Qgg6fp6a4fqwi5MtZNx8T3cGpwQAqejGrGticm5wDUm2xsD7yTfCTh2lqD5i+IfsUUqsDJ2/o4RHsMRSOw4P7S5RJD5/HxhTZo51qtzqjtCLWDa0xPaI+GaBtuJnf6R8CeAQJBAPjG/SdzdD7kvgyGYOgVgcBwvMTO26/VPzwHEz//3hUfgdDJCYaCQ/lp609pSITkuIDlWyO4KhiyReL5v/zxN0MCQQDRumnbAVqBpG3UvfyxRO030MtAzY/sCWZjlOolH2wX9NcNHfUWyfW8yngvlPsaKIG6nBgUf9SuSJmdF6+xVHOhAkBaQc+c3Y1iOBkfcC1+Zjch+4TxHl+j5ok/nQ2F3a3UGg8+EYIMM/y3Y49Ey1zNIjIySYQMbIeRWDR0ycm22kkDAkBWqpvXvoVyEUq5oRDtCDim2gdD7i5NMc031W+0i3mVpL3BU+HV2vtLWrezofLp6ldBkAN7ZR+0LZgdDI6zztxBAkEAk25SnEPl8sQSCg463YJnHOqLliRbLnLBb1tVqf/mxeZ4eAFQpNVT0BYtmEXDVc0s8Lhk3jqBJQ53Y4X26ui5Ow=="; //这里ios使用的是支付宝的rsa_private_key_pkcs8.pem,且支付宝只需要对就行,公钥不作要求,安卓的可能需要公钥之类的。 var pubRsa="MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCv4WGtmvRh1iF/LUY9wPeXaXFDTrdMfKi+kofqXfOfrpk9/qSGmjXwlPIzQSS/nFO2pB8dtwC9VAbx180y+n/B6n7E5uqzhlekozPqRAdEx+K+V4iwxdXctVEZEHDB4biQESCN3EQoCE3Ygd4Tsz9zuW7Z1A/FTJ8MAcXvd+wIDAQAB";//公钥 alipayClass.pay({ "partner":"2088521596342423", //商户ID "rsa_private":rsa, //私钥 "rsa_public":pubRsa, //公钥 "seller":"[email protected]", //收款支付宝账号或对应的支付宝唯一用户号 "subject":"共享停车", //商品名称 "body":"共享停车支付宝支付", //商品详情 "price":"0.01", //金额 单位分 "tradeNo":tradeNo, //订单号 "timeout":"30m", //超时设置 "notifyUrl":"http://dqinterface.dianpao.net/member/aliPayCallback.shtml"//回调url,这个很重要,后台提供,这个是提供给支付宝的回调url,支付宝根据这个url返给后台支付结果,当然如果这个写错前端也是能否调起支付宝的,就是后台接受不到支付宝的反馈结果,不能做相应的订单状态处理。 },function(resultStatus){ $ionicLoading.show({ template:"支付宝测试返回结果=" + resultStatus, noBackdrop: true, duration: 500 }); },function(message){ $ionicLoading.show({ template:"支付宝支付失败=" + message, noBackdrop: true, duration: 500 }); }); }; //微信使用方法: $scope.wxpay = function(){ alert("wxpay demo"); var weixin = navigator.weixin; weixin.sendPayReq({ "appid":"wx321a79afb040b14f",//微信的appid "urlString":"http://91tkp.com:3001/wxSign", "method":"post", "data":{} },function(retcode){ alert("success:"+retcode); },function(message){ alert("sendPayReq:"+ message); }); }; }) 这样基本就配置完毕了,就可以使用了,不过有一个地方要注意:就是index.html文件里一定要引入这个文件才能加载ionic的这些插件:<script src="cordova.js"></script> [/code]
1.3.真机测试:必须用模拟器或者真机运行才可以看到,编译一下ios和安卓,(想用哪个平台测试就编译一下哪个,用ios测试)
[code lang="psd"] $ ionic build ios [/code]
1.4.在platforms找到iOS目录,打开它的ionicPayTry.xcodeproj文件,如果之前安装过其他插件,有ionicDemo.xcworkspace文件的,就直接打开这个。(本人建议使用这个,这个控制台可以输出错误,如果无法调出支付宝,会报错的。一般经常遇到的错误就是rsa_private**读取为null,这说明你的**写错了,不是rsa_private_key_pkcs8.pem格式的,或者换行或哪里出错了。正常的情况下就可以调出支付宝了。微信同理
1.5.模拟器效果如下:
调出支付宝就说明你的插件引用成功,如果调出支付宝但是支付出了问题,那就可能是你的订单号或**或支付宝账号有问题了。
这里的支付宝申请和原生ios支付宝申请是一样的,都是申请的app支付。