微信小程序 支付功能开发错误总结


Posted in Javascript onFebruary 21, 2017

微信小程序 支付功能开发错误总结

微信小程序支付终于踩完坑了,发现里面坑挺大的,现在发个贴,希望以后入坑的同学可以看一下 :

https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=2

业务流程在这里大家看文档的时候可以看到。第一个坑,获取用户的openid,参数一定要拼在url连接上,否则会报{"errcode":40013,"errmsg":"invalid appid, hints: [ req_id: iil1ba0504ns86 ]"}错误

onLoad: function () {
  var that = this
  wx.login({
   success: function (res) {
    if (res.code) {
     //发起网络请求
     wx.request({
      url: 'https://api.weixin.qq.com/sns/jscode2session?appid=wxaacf22345345cfc7162fe3&secret=83ebd41c3e6f34a49b3a34578063434548ff3f71&js_code=' + res.code + '&grant_type=authorization_code',
      method: "POST",
      success: function (res) {
       that.setData({
        openid: res.data.openid
       })
      }
     })
    } else {
     console.log('获取用户登录态失败!' + res.errMsg)
    }
   }
  });
 }

第二个坑,支付统一下单接口,签名这个坑是比较多人遇到问题的这个是MD5加密经常和签名工具里面的加密签名不一样

签名加密工具地址:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=20_1

签名加密的时候要转成utf-8,加密我用自己的接口进行加密的 digest.update(data.getBytes("utf-8"));

// 统一下单接口获取sign(签名)
 paysignjsapi: function (appid, attach, body, mch_id, nonce_str, notify_url, openid, out_trade_no, spbill_create_ip, total_fee, trade_type, key) {
  var self = this;
  //加密签名
  wx.request({
   url: 'http://localhost:8080/XinXingWXApi/wxXcxApi/Md5Encrypt.do',
   method: 'GET',
   data: {
    appid: appid,
    attach: attach,
    body: body,
    mch_id: mch_id,
    nonce_str: nonce_str,
    notify_url: notify_url,
    openid: openid,
    out_trade_no: out_trade_no,
    spbill_create_ip: spbill_create_ip,
    total_fee: total_fee,
    trade_type: trade_type,
    key: key
   },
   //统一下单
   success: function (res) {
    var sign = res.data.strMd5
    var formData = "<xml>"
    formData += "<appid>" + appid + "</appid>" //appid 
    formData += "<attach>" + attach + "</attach>" //附加数据 
    formData += "<body>" + body + "</body>"    //标题
    formData += "<mch_id>" + mch_id + "</mch_id>" //商户号 
    formData += "<nonce_str>" + nonce_str + "</nonce_str>" //随机字符串,不长于32位。 
    formData += "<notify_url>" + notify_url + "</notify_url>" //异步接收微信支付结果通知的回调地址
    formData += "<openid>" + openid + "</openid>"  //用户Id
    formData += "<out_trade_no>" + out_trade_no + "</out_trade_no>" //商户订单号
    formData += "<spbill_create_ip>" + spbill_create_ip + "</spbill_create_ip>"
    formData += "<total_fee>" + total_fee + "</total_fee>" //金额
    formData += "<trade_type>" + trade_type + "</trade_type>"  //公共号支付
    formData += "<sign>" + sign + "</sign>"//签名
    formData += "</xml>"

返回数据解析xml

//请求统一下单接口
    wx.request({
     url: "https://api.mch.weixin.qq.com/pay/unifiedorder",
     method: 'POST',
     data: formData,
     success: function (data) {
      wx.request({
       url: "http://localhost:8080/XinXingWXApi/wxXcxApi/xmlAnalyze.do?strXml=" + data.data,
       method: 'POST',
       success: function (res) {
        var pk = 'prepay_id=' + res.data.prepayId;
        var timeStamp = self.createTimeStamp();
        //获取支付签名,并支付
        self.getsignType(appid, timeStamp, nonce_str, pk, "MD5", key);
       }
      })
     }
    })
   }
  });
 }

第三就是调用支付了,这里也有几个小坑,第一就是appId很多写成appid就不行了,第二个就是preoatid 的参数格式要写对prepay_id=wx2017011711060194dccf725232155886323 第三个就是调用支付的时候报支付签名错误,也需要到签名接口查看签名是否一致,查看参数是否是对的,调用微信支付的时候必须加上appId

getsignType: function (appid, timeStamp, nonce_str, pk, signType, key) {
  var that = this;
  wx.request({
   url: "http://localhost:8080/XinXingWXApi/wxXcxApi/getSignType.hn",
   method: 'GET',
   data: {
    appId: appid,
    timeStamp: timeStamp,
    nonceStr: nonce_str,
    pk: pk,
    signType: signType,
    key: key
   },
   success: function (res) {
    console.log(res.data.paySign)
    var paySign = res.data.paySign
    //调用微信支付
    wx.requestPayment({
     'appId': appid,
     'timeStamp': timeStamp,
     'nonceStr': nonce_str,
     'package': pk,
     'signType': 'MD5',
     'paySign': paySign,
     'success': function (res) {
      console.log(res);
      console.log('success');
     },
     'fail': function (res) {
      console.log(res);
      console.log('fail');
     },
     'complete': function (res) {
      // console.log(res);
      console.log('complete');
     }
    });
   }
  })
 }

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jMessageBox 基于jQuery的窗口插件
Dec 09 Javascript
网站导致浏览器崩溃的原因总结(多款浏览器) 推荐
Apr 15 Javascript
javascript获取鼠标点击元素对象(示例代码)
Dec 20 Javascript
JavaScript通过正则表达式实现表单验证电话号码
Mar 07 Javascript
常用的几段javascript代码分享
Mar 25 Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
Dec 14 Javascript
浅谈JS验证表单文本域输入空格的问题
Feb 14 Javascript
H5手机端多文件上传预览插件
Apr 21 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
Jul 17 Javascript
VueJs监听window.resize方法示例
Jan 17 Javascript
详解angular2如何手动点击特定元素上的点击事件
Oct 16 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
Jun 05 Javascript
微信小程序 点击控件后选中其它反选实例详解
Feb 21 #Javascript
jquery实现下拉框左右选择功能
Feb 21 #Javascript
jquery实现页面加载效果
Feb 21 #Javascript
vue2.0使用Sortable.js实现的拖拽功能示例
Feb 21 #Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
Feb 21 #Javascript
详解JavaScript 中getElementsByName在IE中的注意事项
Feb 21 #Javascript
使用get方式提交表单在地址栏里面不显示提交信息
Feb 21 #Javascript
You might like
php 全文搜索和替换的实现代码
2008/07/29 PHP
PHP使用xmllint命令处理xml与html的方法
2014/12/15 PHP
php结合正则获取字符串中数字
2015/06/19 PHP
php把时间戳转换成多少时间之前函数的实例
2016/11/16 PHP
PHP中静态变量的使用方法实例分析
2016/12/01 PHP
PHP常见数组排序方法小结
2018/08/20 PHP
Jquey拖拽控件Draggable使用方法(asp.net环境)
2010/09/28 Javascript
jQuery实现列表自动循环滚动鼠标悬停时停止滚动
2013/09/06 Javascript
node.js中的fs.utimesSync方法使用说明
2014/12/15 Javascript
jQuery中end()方法用法实例
2015/01/08 Javascript
JavaScript实现数字数组按照倒序排列的方法
2015/04/06 Javascript
全系IE支持Bootstrap的解决方法
2015/10/19 Javascript
详解JavaScript设计模式开发中的桥接模式使用
2016/05/18 Javascript
JavaScript对象数组如何按指定属性和排序方向进行排序
2016/06/15 Javascript
JS控制层作圆周运动的方法
2016/06/20 Javascript
关于微信jssdk实现多图片上传的一点心得分享
2016/12/13 Javascript
AngularJS实现表单验证功能
2017/01/09 Javascript
jquery一键控制checkbox全选、反选或全不选
2017/10/16 jQuery
vue源码学习之Object.defineProperty对象属性监听
2018/05/30 Javascript
layui form表单提交之后重新加载数据表格的方法
2019/09/11 Javascript
vue与iframe之间的信息交互的实现
2020/04/08 Javascript
python求pi的方法
2014/10/08 Python
Python输出9*9乘法表的方法
2015/05/25 Python
django使用LDAP验证的方法示例
2018/12/10 Python
Python实现微信消息防撤回功能的实例代码
2019/04/29 Python
对tensorflow中的strides参数使用详解
2020/01/04 Python
python随机模块random使用方法详解
2020/02/14 Python
Hunkemöller瑞士网上商店:欧洲最大的内衣品牌之一
2018/12/03 全球购物
法国二手MacBook销售网站:Okamac
2019/03/18 全球购物
经典c++面试题六
2012/01/18 面试题
高中生学习的自我评价
2013/12/14 职场文书
微信营销策划方案
2014/02/24 职场文书
2015年公司新年寄语
2014/12/08 职场文书
《吃水不忘挖井人》教学反思
2016/02/22 职场文书
Mysql排序的特性详情
2021/11/01 MySQL
python可视化分析绘制带趋势线的散点图和边缘直方图
2022/06/25 Python