移动端页面调用微信支付

1.话不对说，先来个小漩涡
2.步骤：
（1）第一个接口创建订单号，并且后端携带电子签名
（2）第二个接口通过后端返回信息，调用微信支付接口callpay方法
3，上代码

//创建订单，做了一些接口判断，可以根据各自后台协议作出相应更改axios.post(allApi.UpdateOrders,{AddressId:addressId,Orders:Orders}).then(function (res) {if(res.data.IsSuccess==true){//PayType 2支付宝 4离线支付 5微信支付axios.post(allApi.PayOrder,{PayType:5,Id:id}).then(function (res) {// self.AddOrUpdateAddresses=res.data.Result;if(res.data.ErrorCode==7){axios.post('/webapi/Login/GetWxAuthLogin?redirectCode=7',).then(function (res) {location.href = res.data.Result;}).catch(function (res) {console.log(res)});}else {publicFun.funcUrlDel('code');publicFun.funcUrlDel('state');if (res.data.IsSuccess == true) {if (res.data.Result.IsValid == true) {var OpenId = res.data.Result.OpenId;var WxJsApiParam = res.data.Result.WxJsApiParam;var ReturnUrl = res.data.Result.ReturnUrl;var IsNeedPay = res.data.Result.IsNeedPay;if (IsNeedPay == false) {location.href = ReturnUrl;} else {publicFun.callpay(WxJsApiParam, ReturnUrl);}}} else {mui.alert(res.data.ErrorMsg, "", "确定关闭", function () {});}}console.log(res);}).catch(function (res) {console.log(res)});}else {mui.alert(res.data.ErrorMsg)}}).catch(function (res) {console.log(res)});},

4.注意，以上代码此处为重点，通过后台返回数据传入微信支付函数callpay

 var OpenId = res.data.Result.OpenId;var WxJsApiParam = res.data.Result.WxJsApiParam;var ReturnUrl = res.data.Result.ReturnUrl;var IsNeedPay = res.data.Result.IsNeedPay;if (IsNeedPay == false) {location.href = ReturnUrl;} else {publicFun.callpay(WxJsApiParam, ReturnUrl);}

5.微信支付函数

//调用微信JS api 支付
function jsApiCall(wxJsApiParam, returnUrl) {WeixinJSBridge.invoke('getBrandWCPayRequest',$.parseJSON(wxJsApiParam), //josn串function (res) {WeixinJSBridge.log(res.err_msg);if (res.err_msg == "get_brand_wcpay_request:ok") {window.location.href = returnUrl; //成功后跳转到提示页面}});
}
function callpay(wxJsApiParam, returnUrl) {if (typeof WeixinJSBridge == "undefined") {if (document.addEventListener) {document.addEventListener('WeixinJSBridgeReady', jsApiCall(wxJsApiParam, returnUrl), false);} else if (document.attachEvent) {document.attachEvent('WeixinJSBridgeReady', jsApiCall(wxJsApiParam, returnUrl));document.attachEvent('onWeixinJSBridgeReady', jsApiCall(wxJsApiParam, returnUrl));}} else {jsApiCall(wxJsApiParam, returnUrl);}
}

6.到这里支付就ok，
7.总结，就是两个步骤：（1）将订单信息传入后台，后台创建订单信息返回前端，（2）创建订单成功后，调用微信支付函数即可。

移动端页面调用微信支付相关推荐

微信公众号页面支付接口java,[Java教程]微信公众号支付（三）：页面调用微信支付JS并完成支付...
[Java教程]微信公众号支付(三):页面调用微信支付JS并完成支付 0 2015-09-15 15:00:30 一.调用微信的JS文件 1.首先要绑定[JS接口安全域名],"公众号设置&q ...
H5页面调用微信支付
1.H5页面使用微信支付,首先需要注册微信公众号,在设置与开发>公众号设置>功能设置中配置业务域名.JS接口安全域名.网页授权域名.支付功能页面需在此域名链接下的页面. 2.加入域名后,就 ...
苹果手机微信PHP问题,安卓、ios APP调用微信支付时，页面出现空白。（php微信支付，app发起微信支付白屏）?...
安卓.ios APP调用微信支付时,页面出现空白我的后端是用php开发的.我是先调用微信的统一下单生成,生成prepay_id预支付订单号,代码如下: public function send_pa ...
微信小程序webview(H5页面)调用微信小程序支付
1.业务描述:微信小程序商城入口进入的页面是商城H5页面,在H5页面进行微信支付如何实现: 2.微信小程序(webview访问H5页面)必须使用微信小程序支付: 如何实现以及实现方式以及支付后页面返回 ...
调用微信支付接口总结
项目里面用到了微信支付的功能,照着文档学习了一下,这里做个总结来记录.项目用到的是anglusJS来做前端开发,我这边简化了,用的ajax进行异步的调用,然后业务也直接写在了控制层(不过不应该 ...
php 调用微信支付的时间戳,前端调用微信支付接口
支付按钮的点击事件$(´.Save_Patient_Msg´).click(function(){ $(´.Save_Patient_Msg´).off(´click´); var hrdfId = ...
微信小程序内嵌H5页面实现微信支付
背景: 在微信H5页面已经实现了微信JSAPI的网页支付,老板要求把整个业务线快速转移到微信小程序中,作为懒惰的程序员来说,直接把页面嵌套到小程序不就行了.说干就干,在小程序中设置好基本信息后,一预览 ...
ios调用微信支付提示当前页面的URL未注册
ios调用JSAPI微信支付提示"当前页面的URL未注册",而页面手动刷新后再次支付则正常,安卓也正常,肯定不是授权目录配置问题. 在微信支付页面,当通过JSAPI微信支付 ...
uni-app - 最详细 H5 网页接入微信支付功能，提供从详细的示例代码与注释（移动端网页实现微信支付能力，微信公众号前端支付 JSAPI / JS-SDK 详细示例源码）官方最新超级详细教程
前言关于 uni-app 项目中接入微信支付的文章鱼龙混杂,各种 JSAPI / JS-SDK 乱代码.过时.没注释.不讲流程原理,非常难用. 本文实现了 uni-app H5 移动端网页项目,实现 ...

移动端页面调用微信支付

移动端页面调用微信支付相关推荐

最新文章

热门文章