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


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 相关文章推荐
教你如何解密js/vbs/vbscript加密的编码异处理小结
Jun 25 Javascript
JS跨域代码片段
Aug 30 Javascript
方便实用的jQuery checkbox复选框全选功能简单实例
Oct 09 Javascript
快速解决FusionCharts联动的中文乱码问题
Dec 04 Javascript
了不起的node.js读书笔记之mongodb数据库交互
Dec 22 Javascript
jQuery中parents()方法用法实例
Jan 07 Javascript
jQuery数据类型小结(14个)
Jan 08 Javascript
jQuery删除节点用法示例(remove方法)
Sep 08 Javascript
深入理解基于vue-cli的vuex配置
Jul 24 Javascript
React Native验证码倒计时工具类分享
Oct 24 Javascript
微信小程序实现动态获取元素宽高的方法分析
Dec 10 Javascript
JS实现提示框跟随鼠标移动
Aug 27 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+ajax 无刷新删除数据
2010/02/20 PHP
比较好用的PHP防注入漏洞过滤函数代码
2012/04/11 PHP
PHP读取RSS(Feed)简单实例
2014/06/12 PHP
yii2缓存Caching基本用法示例
2016/07/18 PHP
PHP简单获取网站百度搜索和搜狗搜索收录量的方法
2016/08/23 PHP
PHP让数组中有相同值的组成新的数组实例
2017/12/31 PHP
thinkphp集成前端脚手架Vue-cli的教程图解
2018/08/30 PHP
js制作的鼠标悬浮时产生的下拉框效果
2012/10/27 Javascript
javascript获取鼠标位置部分的实例代码(兼容IE,FF)
2013/08/05 Javascript
使用非html5实现js板连连看游戏示例代码
2013/09/22 Javascript
Javascript核心读书有感之语句
2015/02/11 Javascript
JS获取Table中td值的方法
2015/03/19 Javascript
jquery实现鼠标悬浮停止轮播特效
2020/08/20 Javascript
javascript从定义到执行 你不知道的那些事
2016/01/04 Javascript
JS轮播图中缓动函数的封装
2020/11/25 Javascript
使用ionic播放轮询广告的实现方法(必看)
2017/04/24 Javascript
angularjs2 ng2 密码隐藏显示的实例代码
2017/08/01 Javascript
layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法
2019/09/25 Javascript
nodejs实现UDP组播示例方法
2019/11/04 NodeJs
JavaScript实现好看的跟随彩色气泡效果
2020/02/06 Javascript
vue@cli3项目模板怎么使用public目录下的静态文件
2020/07/07 Javascript
原生js实现购物车
2020/09/23 Javascript
python实现进程间通信简单实例
2014/07/23 Python
Python win32com 操作Exce的l简单方法(必看)
2017/05/25 Python
python3 对list中每个元素进行处理的方法
2018/06/29 Python
pyqt 实现QlineEdit 输入密码显示成圆点的方法
2019/06/24 Python
Tensorflow 定义变量,函数,数值计算等名字的更新方式
2020/02/10 Python
如何将Pycharm中调整字体大小的方式设置为&quot;ctrl+鼠标滚轮上下滑&quot;
2020/11/17 Python
完美解决torch.cuda.is_available()一直返回False的玄学方法
2021/02/06 Python
从零实现一个自定义html5播放器的示例代码
2017/08/01 HTML / CSS
微软瑞士官方网站:Microsoft瑞士
2018/04/20 全球购物
非常详细的C#面试题集
2016/07/13 面试题
运动会通讯稿50字
2014/01/30 职场文书
项目申报专员岗位职责
2014/07/09 职场文书
课前一分钟演讲稿
2014/08/26 职场文书
国家领导干部党的群众路线教育实践活动批评与自我批评材料
2014/09/23 职场文书