小程序云函数获取openid_借助小程序云开发实现小程序支付功能(含源码)

我们在做小程序支付相关的开发时&＃xff0c;总会遇到这些难题。小程序调用微信支付时&＃xff0c;必须要有自己的服务器&＃xff0c;有自己的备案域名&＃xff0c;有自己的后台开发。这就导致我们做小程序支付时的成本很大。本节就来教大家如何使用小程序云开发实现小程序支付功能的开发。不用搭建自己的服务器&＃xff0c;不用有自己的备案域名。只需要简简单单的使用小程序云开发。

1&＃xff0c;云开发的部署和使用

2&＃xff0c;支付相关的云函数开发

3&＃xff0c;商品列表

4&＃xff0c;订单列表

5&＃xff0c;微信支付与支付成功回调

支付成功给用户发送推送消息的功能会在后面讲解。

支付所需要用到的配置信息

1&＃xff0c;小程序appid

2&＃xff0c;云开发环境id

3&＃xff0c;微信商户号

4&＃xff0c;商户密匙

1&＃xff0c;已经申请小程序&＃xff0c;获取小程序 AppID 和 Secret 在小程序管理后台中&＃xff0c;【设置】 →【开发设置】 下可以获取微信小程序 AppID 和 Secret。

2&＃xff0c;微信支付商户号&＃xff0c;获取商户号和商户密钥在微信支付商户管理平台中&＃xff0c;【账户中心】→【商户信息】 下可以获取微信支付商户号。

在【账户中心】 ‒> 【API安全】 下可以设置商户密钥。

这里特殊说明下&＃xff0c;个人小程序是没有办法使用微信支付的。所以如果想使用微信支付功能&＃xff0c;必须是非个人账号(当然个人可以办个体户工商执照来注册非个人小程序账号)3&＃xff0c;微信开发者 IDE https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

4&＃xff0c;开通小程序云开发功能&＃xff1a;https://edu.csdn.net/course/play/9604/204526

效果图如下&＃xff0c;由于本节重点是支付的实现&＃xff0c;所以这里只简单贴出关键代码。

wxml布局如下&＃xff1a;

商品: {{item.name}}价格&＃xff1a; {{item.price / 100}} 元 下单

我们所需要做的就是借助云开发获取云数据库里的商品信息&＃xff0c;然后展示到商品列表&＃xff0c;关于云开发获取商品列表并展示本节不做讲解(感兴趣的同学可以翻看我的历史博客&＃xff0c;有写过的)

首先看下我们支付云函数都包含那些内容

config下的index.js是做支付配置用的&＃xff0c;主要配置支付相关的账号信息

lib是用的第三方的支付库&＃xff0c;这里不做讲解。

重点讲解的是云函数入口 index.js下面就来教大家如何去配置

1,配置config下的index.js,

这一步所需要做的就是把小程序appid&＃xff0c;云开发环境ID&＃xff0c;商户id&＃xff0c;商户密匙。填进去。

2&＃xff0c;配置入口云函数

详细代码如下&＃xff0c;代码里注释很清除了&＃xff0c;这里不再做单独讲解&＃xff1a;

const cloud &＃61; require(&＃39;wx-server-sdk&＃39;)cloud.init()const app &＃61; require(&＃39;tcb-admin-node&＃39;);const pay &＃61; require(&＃39;./lib/pay&＃39;);const { mpAppId, KEY} &＃61; require(&＃39;./config/index&＃39;);const { WXPayConstants, WXPayUtil} &＃61; require(&＃39;wx-js-utils&＃39;);const Res &＃61; require(&＃39;./lib/res&＃39;);const ip &＃61; require(&＃39;ip&＃39;);/** * * &＃64;param {obj} event * &＃64;param {string} event.type 功能类型 * &＃64;param {} userInfo.openId 用户的openid */exports.main &＃61; async function(event, context) { const { type, data, userInfo } &＃61; event; const wxContext &＃61; cloud.getWXContext() const openid &＃61; userInfo.openId; app.init(); const db &＃61; app.database(); const goodCollection &＃61; db.collection(&＃39;goods&＃39;); const orderCollection &＃61; db.collection(&＃39;order&＃39;); // 订单文档的status 0 未支付 1 已支付 2 已关闭 switch (type) { // [在此处放置 unifiedorder 的相关代码] case &＃39;unifiedorder&＃39;: { // 查询该商品 ID 是否存在于数据库中&＃xff0c;并将数据提取出来 const goodId &＃61; data.goodId let goods &＃61; await goodCollection.doc(goodId).get(); if (!goods.data.length) { return new Res({ code: 1, message: &＃39;找不到商品&＃39; }); } // 在云函数中提取数据&＃xff0c;包括名称、价格才更合理安全&＃xff0c; // 因为从端里传过来的商品数据都是不可靠的 let good &＃61; goods.data[0]; // 拼凑微信支付统一下单的参数 const curTime &＃61; Date.now(); const tradeNo &＃61; &＃96;${goodId}-${curTime}&＃96;; const body &＃61; good.name; const spbill_create_ip &＃61; ip.address() || &＃39;127.0.0.1&＃39;; // 云函数暂不支付 http 触发器&＃xff0c;因此这里回调 notify_url 可以先随便填。 const notify_url &＃61; &＃39;http://www.qq.com&＃39;; //&＃39;127.0.0.1&＃39;; const total_fee &＃61; good.price; const time_stamp &＃61; &＃39;&＃39; &＃43; Math.ceil(Date.now() / 1000); const out_trade_no &＃61; &＃96;${tradeNo}&＃96;; const sign_type &＃61; WXPayConstants.SIGN_TYPE_MD5; let orderParam &＃61; { body, spbill_create_ip, notify_url, out_trade_no, total_fee, openid, trade_type: &＃39;JSAPI&＃39;, timeStamp: time_stamp, }; // 调用 wx-js-utils 中的统一下单方法 const { return_code, ...restData } &＃61; await pay.unifiedOrder(orderParam); let order_id &＃61; null; if (return_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39; && restData.result_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39;) { const { prepay_id, nonce_str } &＃61; restData; // 微信小程序支付要单独进地签名&＃xff0c;并返回给小程序端 const sign &＃61; WXPayUtil.generateSignature({ appId: mpAppId, nonceStr: nonce_str, package: &＃96;prepay_id&＃61;${prepay_id}&＃96;, signType: &＃39;MD5&＃39;, timeStamp: time_stamp }, KEY); let orderData &＃61; { out_trade_no, time_stamp, nonce_str, sign, sign_type, body, total_fee, prepay_id, sign, status: 0, // 订单文档的status 0 未支付 1 已支付 2 已关闭 _openid: openid, }; let order &＃61; await orderCollection.add(orderData); order_id &＃61; order.id; } return new Res({ code: return_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39; ? 0 : 1, data: { out_trade_no, time_stamp, order_id, ...restData } }); } // [在此处放置 payorder 的相关代码] case &＃39;payorder&＃39;: { // 从端里出来相关的订单相信 const { out_trade_no, prepay_id, body, total_fee } &＃61; data; // 到微信支付侧查询是否存在该订单&＃xff0c;并查询订单状态&＃xff0c;看看是否已经支付成功了。 const { return_code, ...restData } &＃61; await pay.orderQuery({ out_trade_no }); // 若订单存在并支付成功&＃xff0c;则开始处理支付 if (restData.trade_state &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39;) { let result &＃61; await orderCollection .where({ out_trade_no }) .update({ status: 1, trade_state: restData.trade_state, trade_state_desc: restData.trade_state_desc }); let curDate &＃61; new Date(); let time &＃61; &＃96;${curDate.getFullYear()}-${curDate.getMonth() &＃43; 1}-${curDate.getDate()} ${curDate.getHours()}:${curDate.getMinutes()}:${curDate.getSeconds()}&＃96;; } return new Res({ code: return_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39; ? 0 : 1, data: restData }); } case &＃39;orderquery&＃39;: { const { transaction_id, out_trade_no } &＃61; data; // 查询订单 const { data: dbData } &＃61; await orderCollection .where({ out_trade_no }) .get(); const { return_code, ...restData } &＃61; await pay.orderQuery({ transaction_id, out_trade_no }); return new Res({ code: return_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39; ? 0 : 1, data: { ...restData, ...dbData[0] } }); } case &＃39;closeorder&＃39;: { // 关闭订单 const { out_trade_no } &＃61; data; const { return_code, ...restData } &＃61; await pay.closeOrder({ out_trade_no }); if (return_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39; && restData.result_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39;) { await orderCollection .where({ out_trade_no }) .update({ status: 2, trade_state: &＃39;CLOSED&＃39;, trade_state_desc: &＃39;订单已关闭&＃39; }); } return new Res({ code: return_code &＃61;&＃61;&＃61; &＃39;SUCCESS&＃39; ? 0 : 1, data: restData }); } }}

其实我们支付的关键功能都在上面这些代码里面了。

再来看下&＃xff0c;支付的相关流程截图

上图就涉及到了我们的订单列表&＃xff0c;支付状态&＃xff0c;支付成功后的回调。

今天就先讲到这里&＃xff0c;后面会继续给大家讲解支付的其他功能。比如支付成功后的消息推送&＃xff0c;也是可以借助云开发实现的。