0

0

nodejs开发微信支付的功能

Y2J

Y2J

发布时间:2017-05-13 15:43:58

|

3626人浏览过

|

来源于php中文网

原创

这篇文章主要为大家详细介绍了nodejs微信公众号支付开发,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

odeJs 微信公众号功能开发,移动端 H5页面调用微信的支付功能。这几天根据公司的需要使用 node 和 h5页面调用微信的支付功能完成支付需求。现在把开发过程重新捋一遍,以帮助更多的开发者顺利的完成微信支付功能的开发。(微信暂时还没有提供 node 的支付功能)

一.请求CODE

请求 code 的目的就是获取用户的 openid(用户相对于当前公众号的唯一标识) 和access_token,请求的APIopen.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect
此 api 需要注意几个参数:

1.  appid公众号的 appid,可以在公众号中看到
2.  redirect_uri 自定义的微信回调地址, 微信会在你请求完上面的地址后跳转到你定义的redirect_uri的地址, 带着 code,此处的 redirect_url 需要 **url_encode** *php*, 如果你的程序是 node 则需要使用 **encodeURLComponent(url)**编码
3.  response_type=code,这个没什么好说的就是固定的 response_type=code,详细说明可以查看微信官网的说明
4.  scope=snsapi_userinfo,固定这样写就好,详细说明可以查看微信官网的说明
5.  state=STATE 固定这样写就好,详细说明可以查看微信官网的说明
6.  wechat_redirect 固定这样写就好,详细说明可以查看微信官网的说明
ps:官网链接:

二.通过code获取access_token,openid

第一步已经获取到了 code 的值了, 那么接下来就需要通过 code 来获取 access_token,openid的值了,请求的 api
API api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
此处api 的参数说明:

1.  appid 微信公众号 id,微信公众号后台获取
2.  secret 微信公众号的密钥, 微信公众号后台获取
3.  code, 第一步获取用到的 code
4.  grant_type=authorization_code 固定就好

三.通过access_token调用接口

access_token 可以做后续的功能, 可以参考官方的例子:
open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&id=open1419316518&lang=zh_CN

四.网页端调起支付API

看见这个是不是感觉快完事儿了, 只要网页端调用微信支付功能就完事儿了?no,还差点
在微信浏览器里面打开H5网页中执行JS调起支付。接口输入输出数据格式为JSON
注意:WeixinJSBridge内置dir0在其他浏览器中无效。
示例代码如下:

function onBridgeReady(){
 WeixinJSBridge.invoke(
 'getBrandWCPayRequest', {
  "appId" : "wx2421b1c4370ec43b", //公众号名称,由商户传入 
  "timeStamp":" 1395712654",  //时间戳,自1970年以来的秒数 
  "nonceStr" : "e61463f8efa94090b1f366cccfbbb444", //随机串 
  "package" : "prepay_id=u802345jgfjsdfgsdg888", 
  "signType" : "MD5",  //微信签名方式: 
  "paySign" : "70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名 
 },
 function(res){ 
  if(res.err_msg == "get_brand_wcpay_request:ok" ) {} // 使用以上方式判断前端返回,微信团队郑重提示:res.err_msg将在用户支付成功后返回 ok,但并不保证它绝对可靠。 
 }
 ); 
}
if (typeof WeixinJSBridge == "undefined"){
 if( document.addEventListener ){
 document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
 }else if (document.attachEvent){
 document.attachEvent('WeixinJSBridgeReady', onBridgeReady); 
 document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
 }
}else{
 onBridgeReady();
}

看到上面的代码, 那么想调用微信的支付功能需要传递参数,

{
 "appId" : "wx2421b1c4370ec43b", //公众号名称,由商户传入 
 "timeStamp":" 1395712654",  //时间戳,自1970年以来的秒数 
 "nonceStr" : "e61463f8efa94090b1f366cccfbbb444", //随机串 
 "package" : "prepay_id=u802345jgfjsdfgsdg888", 
 "signType" : "MD5",  //微信签名方式: 
 "paySign" : "70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名 
}

参数说明:

1. appId //公众号名称,由商户传入
2. timeStamp //时间戳,自1970年以来的秒数  此处需要特别的注意一下,需要是dir1的时间戳格式, 意思就是必须就“” 引号
3. nonceStr //随机串    32位的, 随后会提供方法
4. signType // 微信签名方式: MD5
5. paySign //微信签名, 随后说
6. **package**   //这个最重要, 充哪里获取到的呢? 接下来说。
ps: 官网接口说明
pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6

五.获取package, 从微信的 统一下单 接口获取prepay_id

官方 api:
api.mch.weixin.qq.com/pay/unifieddir2er

dir3一堆, 但是有一些不是必须的,下面是必须参数

{
 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 ,//new Date().getTime(), //订单号
 spbill_create_ip : SPBILL_CREATE_IP , //客户端的 ip
 total_fee : TOTAL_FEE, //商品的价格, 此处需要注意的是这个价格是以分算的, 那么一般是元, 你需要转换为 RMB 的元
 trade_type : 'JSAPI',
}

微信的统一下单接口要求传递的是 dir4 的数据, 而且数据还需要签名, 那么首先吧数据签名。
签名规则可以参考微信给出的签名规则(签名方法一会给出)
微信官方签名规则:
pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=4_3

商城购物系统
商城购物系统

商城购物系统是一个以php+MySQL进行开发的可塑性极强的电子商品平台;商城购物系统可自定义商品栏目内容,包含分销功能,分销管理、分销订单提成完整功能,商品加购物车、商品支付、商品发货等一系列流程,包括pc端和手机H5端。

下载

生成签名后需要吧数据组装为xml 的格式:

var body = ' ' +
 ''+config.wxappid+' ' +
 ''+obj.attach+' ' +
 ''+obj.body+' ' +
 ''+config.mch_id+' ' +
 ''+obj.nonce_str+' ' +
 ''+obj.notify_url+'' +
 ''+obj.openid+' ' +
 ''+obj.out_trade_no+''+
 ''+obj.spbill_create_ip+' ' +
 ''+obj.total_fee+' ' +
 ''+obj.trade_type+' ' +
 ''+obj.sign+' ' + // 此处必带签名, 否者微信在验证数据的时候是不通过的
 '';

接下来就是请求 api 获取prepay_id的值了, 将上面得到的 xml 数据请求下面的 api 发送给微信, 微信验证数据没问题后会放回你想要的值。
api : api.mch.weixin.qq.com/pay/unifiedorder

六. 获取到了prepay_id是不是就可以在 h5 段直接调用微信的支付了么? 答案是还不可以。

获取到了prepay_id那么现在h5 呼起微信的支付功能的参数是这样的:

{
 "appId" : "wx2421b1c4370ec43b", //公众号名称,由商户传入 
 "timeStamp":" 1395712654",  //时间戳,自1970年以来的秒数 
 "nonceStr" : "e61463f8efa94090b1f366cccfbbb444", //随机串 
 "package" : "prepay_id=u802345jgfjsdfgsdg888", 
 "signType" : "MD5",  //微信签名方式:
}

有了这样的参数, 那么你还需要吧所有参与的参数做签名。签名规跟上面的一样,生成了签名后需要吧签名的参数 paySign 赋给h5 呼起微信的支付功能的参数(也就是微信的签名不参与签名的生成)
最后的参数是这样子的:

{
 "appId" : "wx2421b1c4370ec43b", //公众号名称,由商户传入 
 "timeStamp":" 1395712654",  //时间戳,自1970年以来的秒数 
 "nonceStr" : "e61463f8efa94090b1f366cccfbbb444", //随机串 
 "package" : "prepay_id=u802345jgfjsdfgsdg888", 
 "signType" : "MD5",  //微信签名方式:
 "paySign" : "70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名
}

如果你的各个环节都没有问题, 那么得到了这样参数后你就可以正常的调用起微信的支付功能, 跟原生的功能是没有任何的差别的,(估计你现在的心里也特高兴吧, 没有 app 竟然可以使用 app 的功能,就是这么的神奇)。

七.支付完成的回调

微信支付完了后会在 h5 页面的微信支付的dir5里面放回值,
res.err_msg == "get_brand_wcpay_request:ok" ,这样就是成功了, 但是不是就完事儿了呢 ? 也不是,为什么呢? 微信真的收到钱了么? 收到的钱是不是你传递给微信的值呢 ?你还需要将支付的结果写数据库什么的,这些都是未知。还记的在统一下单接口中有个必须参数就是 notify_url : NOTIFY_URL,// 微信付款后的回调地址 这个地址是用户传递给微信的, 微信在收到用户的付款后会以 post 的方式请求这个接口,微信会传递用户付款的信息过来, 不过是 xml 格式的。
类系这样的 xml 格式:


 
 
 
 
 
 
 
 
 
 
 
 
 
 
 1
 
 

根据自己的业务逻辑解析这个 xml 格式的数据就好了。
注意:这里你在获取到数据后微信需要得到你的回应, 如果你一直不回应微信, 微信会请求你好几次, 这样估计你的逻辑会有问题吧,所以你需要给微信返回 xml 的格式的 回应。


 
 

小坑:node ,express dir6开发, 如果你在微信的支付成功后的回调中没有获取到任何 xml 的值, 那么你需要dir7一组件:body-parser-xml, 你可以使用 npm install body-parser-xml --save 安装, 在 app.js 里面dir8('body-parser-xml')(bodyParser);,使用dir9的方式

// 解决微信支付通知回调数据
app.use(bodyParser.xml({
 limit: '2MB', // Reject payload bigger than 1 MB
 xmlParseOptions: {
 normalize: true, // Trim whitespace inside text nodes
 normalizeTags: true, // Transform tags to lowercase
 explicitArray: false // Only put nodes in array if >1
 }
}));

这样你就可以正常的获取到微信的 xml 数据了。

使用方法:

pay.getAccessToken({
 notify_url : 'http://demo.com/', //微信支付完成后的回调
 out_trade_no : new Date().getTime(), //订单号
 attach : '名称',
 body : '购买信息',
 total_fee : '1', // 此处的额度为分
 spbill_create_ip : req.connection.remoteAddress,
 }, function (error, responseData) {
 res.render('payment', {
  title : '微信支付',
  wxPayParams : JSON.stringify(responseData),
  //userInfo : userInfo
 });
 });

就到这里吧, 感觉也差不多了。如有不对的地方还请指正。

【相关推荐】

1. 特别推荐:接口0

2. 接口1

3. 接口2

相关文章

微信app下载
微信app下载

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

下载

相关标签:

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

相关专题

更多
Golang gRPC 服务开发与Protobuf实战
Golang gRPC 服务开发与Protobuf实战

本专题系统讲解 Golang 在 gRPC 服务开发中的完整实践,涵盖 Protobuf 定义与代码生成、gRPC 服务端与客户端实现、流式 RPC(Unary/Server/Client/Bidirectional)、错误处理、拦截器、中间件以及与 HTTP/REST 的对接方案。通过实际案例,帮助学习者掌握 使用 Go 构建高性能、强类型、可扩展的 RPC 服务体系,适用于微服务与内部系统通信场景。

8

2026.01.15

公务员递补名单公布时间 公务员递补要求
公务员递补名单公布时间 公务员递补要求

公务员递补名单公布时间不固定,通常在面试前,由招录单位(如国家知识产权局、海关等)发布,依据是原入围考生放弃资格,会按笔试成绩从高到低递补,递补考生需按公告要求限时确认并提交材料,及时参加面试/体检等后续环节。要求核心是按招录单位公告及时响应、提交材料(确认书、资格复审材料)并准时参加面试。

44

2026.01.15

公务员调剂条件 2026调剂公告时间
公务员调剂条件 2026调剂公告时间

(一)符合拟调剂职位所要求的资格条件。 (二)公共科目笔试成绩同时达到拟调剂职位和原报考职位的合格分数线,且考试类别相同。 拟调剂职位设置了专业科目笔试条件的,专业科目笔试成绩还须同时达到合格分数线,且考试类别相同。 (三)未进入原报考职位面试人员名单。

58

2026.01.15

国考成绩查询入口 国考分数公布时间2026
国考成绩查询入口 国考分数公布时间2026

笔试成绩查询入口已开通,考生可登录国家公务员局中央机关及其直属机构2026年度考试录用公务员专题网站http://bm.scs.gov.cn/pp/gkweb/core/web/ui/business/examResult/written_result.html,查询笔试成绩和合格分数线,点击“笔试成绩查询”按钮,凭借身份证及准考证进行查询。

11

2026.01.15

Java 桌面应用开发(JavaFX 实战)
Java 桌面应用开发(JavaFX 实战)

本专题系统讲解 Java 在桌面应用开发领域的实战应用,重点围绕 JavaFX 框架,涵盖界面布局、控件使用、事件处理、FXML、样式美化(CSS)、多线程与UI响应优化,以及桌面应用的打包与发布。通过完整示例项目,帮助学习者掌握 使用 Java 构建现代化、跨平台桌面应用程序的核心能力。

65

2026.01.14

php与html混编教程大全
php与html混编教程大全

本专题整合了php和html混编相关教程,阅读专题下面的文章了解更多详细内容。

36

2026.01.13

PHP 高性能
PHP 高性能

本专题整合了PHP高性能相关教程大全,阅读专题下面的文章了解更多详细内容。

75

2026.01.13

MySQL数据库报错常见问题及解决方法大全
MySQL数据库报错常见问题及解决方法大全

本专题整合了MySQL数据库报错常见问题及解决方法,阅读专题下面的文章了解更多详细内容。

21

2026.01.13

PHP 文件上传
PHP 文件上传

本专题整合了PHP实现文件上传相关教程,阅读专题下面的文章了解更多详细内容。

35

2026.01.13

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
快速入门Node.JS全套完整版
快速入门Node.JS全套完整版

共83课时 | 8.3万人学习

nodejs开发基础教程
nodejs开发基础教程

共15课时 | 4.5万人学习

JavaScript设计模式视频教程
JavaScript设计模式视频教程

共28课时 | 5.3万人学习

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

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