npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

wxpay-api

v1.0.2

Published

用于express框架下的微信支付插件

Downloads

1

Readme

wxpay-api

一个用于express框架下的微信支付模块。

该模块的提供者,并非一位大神,准确的说,应该冠以小白之名。

分享此模块的初衷,是因为这位小白在项目中实现微信支付模块时,踩过了不少的坑。

当然了,踩的坑越多,学到的知识也会随之增长,也可能这些知识,只是短暂的停留在这位小白的脑海中。

所以,写下这个“精心”总结出来的模块,也算是对自己学习的一种总结了。

如果因此能对与本人一样的小白起到一点帮助性的作用,本人将不胜荣幸。

此模块目前具备以下功能:

  • [x] 微信支付API(大部分)

  • [x] 扫码支付(模式一)

  • [x] 处理支付回调

其余功能将会随本小白在日后的学习中慢慢加入(实话就是暂时不会)。

安装此模块

npm install wxpay-api

配置全局变量

const express = require('express');

const wxpayApi = require('wxpay-api')({
	appId: '',			// 你的公众号appId
	mchId: '',			// 你的商户号
	key: '',				// 你的商户号秘钥
	notify_url: ''	// 支付成功时的回调地址,例如:http://localhost/wpcb
});

const app = express();

// 这里还要写很多代码...

app.listen(1016);

绑定微信支付API

你只需要这样做:

app.use(wxpayApi.bindApi());

便为req对象绑定上了微信支付API对象 $wxApi

  • [x] 统一下单:$wxApi.unifiedorder
  • [x] 查询订单:$wxApi.orderquery
  • [x] 关闭订单:$wxApi.closeorder
  • [x] 申请退款:$wxApi.refund
  • [x] 查询退款:$wxApi.refundquery
  • [x] 下载对账单:$wxApi.downloadbill
  • [x] 下载资金账单:$wxApi.downloadfundflow
  • [x] 拉取订单评价:$wxApi.batchquerycomment
  • [x] xmlreader: $wxApi.xmlreader
  • [x] 连接转二维码图片:$wxApi.createWxpayQrcode

这些API的详细介绍将在以后为大家完善!(因为目前我也没用到这些T_T)

扫码支付

现在终于到“重头戏”了,下面就让我来为大家介绍这个扫码支付如何简单、快速的接入到咱们的项目中!

生成支付二维码

在这之前,当用户访问咱们的网站时,我们要将咱们的支付二位码呈现给咱们的用户上帝!

使用这个模块,你只需要这么做:

app.get('/qrcode', (req, res) => {
	let product_id = 'xxx';	//生成你自己的商品ID
	res.setHeader('Content-type', 'image/png');
  req.$wxApi.createWxpayQrcode(product_id).pipe(res);
})

现在你只需要在你的网页中使用:

<img src="/qrcode">

呈现出来的便是一张二维码啦!

当然你也可以将商品ID设作参数:

app.get('/qrcode', (req, res) => {
	let product_id = req.query.product_id;
	res.setHeader('Content-type', 'image/png');
  req.$wxApi.createWxpayQrcode(product_id).pipe(res);
})
<img src="/qrcode?product_id=xxx">

处理扫码回调

这一步需要你在你的商户号设置了支付回调地址,假如你的项目跑在域名为:http://localhost 的服务器上。

而你的支付回调地址已经设置为:http://localhost/wpcb

那么你只需要这样做:

app.post('/wpcb', wxpayApi.scanPay(async product_id => {
	return {
		body: '',	//你的商品信息
		total: 1016, //你的商品标价
		out_trade_no: ''//订单号
	}
}, true))

当你调用wxpayApi.scanPay之后,扫码回调的处理工作已经可以帮你动处理了!

而你只需在调用时传入一个函数(infoCreator),用于scanPay获取你的商品信息。

当infoCreator被调用时,会传入你生成二位码时带入的商品ID:product_id 作为参数

你可以根据此参数,生成不同的商品信息!

这里要注意!你传入的infoCreator必须为[async function]。

[2018/08/22 18:59]补充关于 wxpayApi.scanPay 的优化及使用说明

wxpayApi.scanPay(infoCreator, reply)的作用:当客户扫码时,微信会向你设置的“微信支付回调地址” 发送通知信息,你需要调用微信“统一下单”接口,向微信发送下单请求。而scanPay就是为你解决这件事情的!

下面我们介绍scanPay的两个参数:

@param {function} infoCreator

scanPay向微信发起下单请求时,需要向你获取你的商品的相关属性,这包括:商品的标题,标价金额以及订单号!

关于infoCreator在上面已有详细的说明,此处便不再赘述。

@param {boolean} reply

当你对此插件有足够的信任时,可以将reply参数设为truescanPay会将下单结果自动返回为微信客户端,发起客户后续的支付操作。

如果你将reply设为false,或者不传这个参数。scanPay则会将下单结果封装之后,调用下一跳路由!

async function infoCreator() {}
app.post('/wpcb', wxpayApi.scanPay(infoCreator, false), (req, res) => {
	console.info(res.$wxpayResult.info) // 打印出下单结果(xml文本)
	res.$wxpayResult.reply(); // 将下单结果返回给微信客户端
})

如果你需要对下单结果(xml文本)进行某些操作,你可以使用$wxApi提供的接口对其进行解析:

let xml = res.wxpayResult.info;
let body = await req.$wxApi.xmlreader(xml);

支付成功通知

当你的客户完成一次支付后,微信将会给你的服务器发送支付成功通知!

此时,你也应该为此作出响应。这些操作,本模块已经为你提供了简便的方法!

当你在配置全局变量时,填写了回调通知地址:notify_url,假设为:http://localhost/notify

那么你只需这样做:

app.post('/notify', wxpayApi.notify(), (req, res) => {
	console.info(res.$wxpayResult.info) //你可以查看微信通知你所带来的信息
	res.$wxpayResult.reply(); //调用此方法,给微信服务器作出回应
})

[2018/08/22 19:23]补充

同时wxpayApi.notify(reply)也和wxpayApi.scanPay一样,接受一个reply参数。

当此参数为true时,将自动回复。

app.post('/notify', wxpayApi.notify(true));

后言

第1次更新时间: 2018/08/22 05:09 (你没看错,是凌晨5点)

本次更新时间: 2018/08/22 19:26 (对的,我睡了一觉,此刻才稍觉微醒)

联系我?

邮箱在此: [email protected]