0

0

nodejs实现微信扫码支付功能

小云云

小云云

发布时间:2018-02-22 09:00:36

|

2070人浏览过

|

来源于php中文网

原创

准备工作

微信公众号-appid

微信商户号-mch_id

key值(签名算法所需,其实就是一个32位的密码,可以用md5生成一个)(key设置路径:微信商户平台(pay.weixin.qq.com)-->账户设置-->API安全-->密钥设置)

扫码支付-统一下单

以下才用的是微信模式二,因为比较简单


  let MD5 = require('md5'),
    xml2js = require('xml2js'),
    url = "https://api.mch.weixin.qq.com/pay/unifiedorder",// 下单请求地址
    appid = '公众号id',
    mch_id = '微信商户号';
    notify_url = '回调地址',
    out_trade_no = '自己设置的订单号',// 微信会有自己订单号、我们自己的系统需要设置自己的订单号
    total_fee = '订单金额',// 注意,单位为分
    body = '商品简单描述', 
    trade_type = 'NATIVE',// 交易类型,JSAPI--公众号支付、NATIVE--原生扫码支付、APP--app支付
    nonce_str = moment().format('YYYYMMDDHHmmssSSS'),// 随机字符串32位以下
    stringA = `appid=${公众号id}&body=${body}&mch_id=${微信商户号}&nonce_str=${nonce_str}¬ify_url=${
    notify_url}&out_trade_no=${out_trade_no}&spbill_create_ip=${ctx.request.ip}&total_fee=${total_fee}&trade_type=${trade_type}`,
    stringSignTemp = stringA + "&key=xxxxxxxxxxxxxxxxx", //注:key为商户平台设置的密钥key
    sign = MD5(stringSignTemp).toUpperCase(); //注:MD5签名方式

以上就是我们所需要的一些参数

签名生成算法见微信官方:https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=4_3

spbill_create_ip 是 终端ip地址

下面把所有的参数拼接成xml


  const formData = "";
    formData += "" + appid + ""; //appid
    formData += "" + body + ""; //商品或支付单简要描述
    formData += "" + mch_id + ""; //商户号
    formData += "" + nonce_str + ""; //随机字符串,不长于32位
    formData += "" + notify_url + ""; //支付成功后微信服务器通过POST请求通知这个地址
    formData += "" + out_trade_no + ""; //订单号
    formData += "" + total_fee + ""; //金额
    formData += "" + ctx.request.ip + ""; //ip
    formData += "NATIVE"; //NATIVE会返回code_url ,JSAPI不会返回
    formData += "" + sign + "";
    formData += "";
  // 这里使用了egg里面请求的方式
  const resultData = yield ctx.curl(url, {
      method: 'POST',
      content: formData,
      headers: {
        'content-type': 'text/html',
      },
    });

  // xml转json格式
  xml2js.parseString(resultData.data, function (err, json) {
    if (err) {
      new Error("解析xml报错")
    } else {
      var result = formMessage(json.xml); // 转换成正常的json 数据
      console.log(result) //打印出返回的结果
    }
  })
  var formMessage = function (result) {
    var message = {};
    if (typeof result === 'object') {
      var keys = Object.keys(result);
      for (var i = 0; i < keys.length; i++) {
        var item = result[keys[i]];
        var key = keys[i];
        if (!(item instanceof Array) || item.length === 0) {
          continue;
        }
        if (item.length === 1) {
          var val = item[0];
          if (typeof val === 'object') {
            message[key] = formMessage(val);
          } else {
            message[key] = (val || '').trim();
          }
        } else {
          message[key] = [];
          for (var j = 0, k = item.length; j < k; j++) {
            message[key].push(formMessage(itemp[j]));
          }
        }
      }
    }
    return message;
  }

上面使用了egg的请求方式,原生node可以使用request


var request = require('request');
  request({
    url: url,
    method: "POST",
    body: formData
  }, function(error, response, body) {
    if (!error && response.statusCode == 200) {
    }
  });

如果请求成功会最终返回一个xml,然后我们进行解析成json的格式,里面会有一个code_url和out_trade_no,我们需要把这两个返回给前端,然后通过生成二维码展示给用户扫码,完成支付

监听支付是否成功

上面操作完成之后,我们需要知道用户是否完成支付,因为用户会停留在该页面,我们需要在用户付完款之后,通知用户支付成功。

首先,用户发起支付的时候我们会生成二维码,让用户完成扫码支付,我们还要做的是,开一个定时器,每隔一段时间去发送一个请求,这个时候,我们node后台就需要写一个查询订单的接口,之前我们拿到了out_trade_no,也就是我们系统内部的订单号,我们把这个数据发送给后台查询订单的接口,然后后台接收到之后会请求微信的查询接口地址https://api.mch.weixin.qq.com/pay/orderquery,流程跟上面一样,只是接口地址和微信返回的xml不一样而已,返回的字段会有一个状态即SUCCESS和NOTPAY,我们可以通过判断是否支付返回给前端,成功之后提示给用户支付成功,关闭定时器。

回调地址

这个是非常重要的一环,大部分的操作其实在上面就可以完成,但是有特殊的情况,比如用户电脑断网发送不了请求,但是手机付款了,这就会导致我们记录不到用户支付的信息。这个时候回调地址就很重要了

ecshop微信商城接口
ecshop微信商城接口

ecshop微信商城接口,实现商品融合,关注注册,发放优惠券,ecshop分销以及微信支付,微信收货地址共享等强大功能.

下载

设置回调地址

微信商户中心->产品中心->开发配置->扫码支付

之后我们需要做的是后端用post来接收微信发送的异步回调信息,也是xml的格式,这里注意,如果不支持接收xml,可能会得到空的数据

这里还需要注意的是,我们在保存用户支付信息的同时,得先查改订单是否支付,以免重复操作,可能会插入多条记录的情况

总结

微信扫码支付坑还是有的,如果你是第一次摸索的话,下面罗列一下需要注意的地方

  1. 签名算法要写正确,不然是不会成功的,要拼接正确才行

  2. 微信返回的是xml格式的数据,我们得通过插件转成json,这样才方便获取数据

  3. 返回的code_url要给前端生成二维码用,然后需要开一个定时器查询该订单是否完成支付,最终通知用户结果

  4. 回调地址很重要,我们后端需要post接收微信返回的回调信息,然后保存信息,不过在保存用户支付信息的之前,我们得知道该订单是否已经保存过,以免重复添加。还有就是返回的是xml的数据,后端一定要保证能够接收得到,按照正常的方式是接收不了的,得额外设置。

相关推荐:

PC端微信扫码支付成功后自动跳转php版代码分享

微信扫码支付模式

php实现微信扫码支付的示例代码分享


相关文章

微信app下载
微信app下载

微信是一款手机通信软件,支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊,还能根据地理位置找到附近的人,带给大家全新的移动沟通体验,有需要的小伙伴快来保存下载体验吧!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
php源码安装教程大全
php源码安装教程大全

本专题整合了php源码安装教程,阅读专题下面的文章了解更多详细内容。

3

2025.12.31

php网站源码教程大全
php网站源码教程大全

本专题整合了php网站源码相关教程,阅读专题下面的文章了解更多详细内容。

1

2025.12.31

视频文件格式
视频文件格式

本专题整合了视频文件格式相关内容,阅读专题下面的文章了解更多详细内容。

4

2025.12.31

不受国内限制的浏览器大全
不受国内限制的浏览器大全

想找真正自由、无限制的上网体验?本合集精选2025年最开放、隐私强、访问无阻的浏览器App,涵盖Tor、Brave、Via、X浏览器、Mullvad等高自由度工具。支持自定义搜索引擎、广告拦截、隐身模式及全球网站无障碍访问,部分更具备防追踪、去谷歌化、双内核切换等高级功能。无论日常浏览、隐私保护还是突破地域限制,总有一款适合你!

6

2025.12.31

出现404解决方法大全
出现404解决方法大全

本专题整合了404错误解决方法大全,阅读专题下面的文章了解更多详细内容。

30

2025.12.31

html5怎么播放视频
html5怎么播放视频

想让网页流畅播放视频?本合集详解HTML5视频播放核心方法!涵盖<video>标签基础用法、多格式兼容(MP4/WebM/OGV)、自定义播放控件、响应式适配及常见浏览器兼容问题解决方案。无需插件,纯前端实现高清视频嵌入,助你快速打造现代化网页视频体验。

3

2025.12.31

关闭win10系统自动更新教程大全
关闭win10系统自动更新教程大全

本专题整合了关闭win10系统自动更新教程大全,阅读专题下面的文章了解更多详细内容。

2

2025.12.31

阻止电脑自动安装软件教程
阻止电脑自动安装软件教程

本专题整合了阻止电脑自动安装软件教程,阅读专题下面的文章了解更多详细教程。

3

2025.12.31

html5怎么使用
html5怎么使用

想快速上手HTML5开发?本合集为你整理最实用的HTML5使用指南!涵盖HTML5基础语法、主流框架(如Bootstrap、Vue、React)集成方法,以及无需安装、直接在线编辑运行的平台推荐(如CodePen、JSFiddle)。无论你是新手还是进阶开发者,都能轻松掌握HTML5网页制作、响应式布局与交互功能开发,零配置开启高效前端编程之旅!

2

2025.12.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 3.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 1.9万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号