深山工作室

深山工作室 >

uni-app开发的微信小程序在线支付



在用uni-app开发小程序时,需要使用微信小程序在线支付

处理发起支付流程如下



01. 向服务器发送微信小程序支付请求,发送的请教中,一定要带上当前小程序用户的openid
  将支付的钱与支付订单号向后台发送

02.后台接收订单内容后,向微信支付平台发一个请求,获得如下内容
以下是发送请教之后,支付程序返回的代码
{
    "data_state": "success",
    "prompting": "下单成功",
    "data_list": {
      "appId": "wxc45312345678902",
      "package": "prepay_id=wx31244255725616c79ca227f95eaee60000",
      "timeStamp": "1612101428",
      "nonceStr": "3Yl2Zn4Nl1Yf",
      "signType": "MD5",
      "paySign": "A5415FCF474F10C6D69DEF15C1FBC165",
      "orderid": "kecen20210131215703698348"
    }
}

03.以下是在页面中解析代码然后唤醒对应的微信支付功能

let paydata = res.data.data_list;
uni.requestPayment({
    nonceStr: paydata.nonceStr,      //  随机字符串    【字符串】
    package: paydata.package,       //  统一下单接口 必须加前缀:prepay_id=xxxxxxxx  【字符串】
    paySign: paydata.paySign,       //  签名     【字符串】
    signType: paydata.signType,      //  签名算法  【字符串】
    timeStamp: paydata.timeStamp,     //  时间戳   【字符串】
    success: function (res) {
        console.log('支付成功提示 success:' + JSON.stringify(res));
    },
    fail: function (err) {
        console.log('支付失败提示 fail:' + JSON.stringify(err));
    },
    complete:function(res){
        //console.log('xxxxxxxxxxxxxxxxxx---complete')
    }
});

利用uni-app中的uni.requestPayment发起调用微信支付请求
以下是介绍我的详细代码


getpagedata: function() {
    this.$appajax.globalRequest('POST', getApp().qwbmurl + '/pay/weixin/miniapp.asp', {
        buy_order: _self.pay_order, //支付订单,里面包括了支付的费用,支付的信息
        openid: 'oM67Fv5pK1REqisNtMq5zVBkcd5Y' // + uni.getStorageSync('uu_openid'),
    }).then(res => {
        let show_state = res.data.state; //支付状态
        //支付失败提示
        if (show_state == "error") {
            uni.showToast({title: unescape(res.data.prompting),icon: 'none'});
        }
        //支付成功处理
        if (show_state == "success") {
            uni.showToast({title: unescape(res.data.prompting),
                icon: 'success'
            });
            let paydata = res.data.data_list;
            uni.requestPayment({
                nonceStr: paydata.nonceStr,      //  随机字符串 【字符串】
                package: paydata.package,       //  统一下单接口 必须加前缀:prepay_id=xxxxxxxx  【字符串】
                paySign: paydata.paySign,       //  签名     【字符串】
                signType: paydata.signType,      //  签名算法 【字符串】
                timeStamp: paydata.timeStamp,     //  时间戳   【字符串】
                success: function (res) {
                    console.log('发起支付success:' + JSON.stringify(res));
                },
                fail: function (err) {
                    console.log('失败支付fail:' + JSON.stringify(err));
                },
                complete:function(res){
                    //console.log('xxxxxxxxxxxxxxxxxx---complete')
                }
            });
        }
    });
},

前一页:uni-app三目运算class和style
后一页:uni-app微信小程序分享微信好友与分享到朋友圈功能
相关阅读
深山旅行社网站管理系统5.0发布
酒店客房预订商建站解决方案
景点门票预订商建站解决方案
偏重于汽车租赁服务商建站解决方案
专注于户外扩展、商务会议建站解决方案
Visa签证服务商建站解决方案
专注于自由行的旅游服务商建站解决方案
出境游旅行社建站解决方案
更多>>uni-app相关信息
uni-app开发表单input组件的一些规则说明自己预留使用
uni-app:使用uni.downloadFile下载word或pdf文件并保存到手机
小程序中利用addPhoneContact将联系人的信息添加到手机通讯录支持保存联系人头像
微信小程序打开客服提示:该小程序提供的服务出现故障,请稍后重试
微信小程序客服会话只能过button让用户主动触发
更多>>最新添加
dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT
Android移动端自动化测试:使用UIAutomatorViewer与Selenium定位元素
抖音直播音挂载小雪花 懂车帝小程序
javascript获取浏览器指纹可以用来做投票
火狐Mozilla Firefox出现:无法载入您的Firefox配置文件 它可能已经丢失 或是无法访问 问题解决集合处理办法