后面给他们讲过两个借助于小流程云合作开发同时实现QQ缴付的,但那个操作方式稍稍有点儿繁杂,因此还会常有难题,给他们讲两个单纯的,因此借助于非官方缴付api同时实现小流程缴付机能。

半条命

借助于小流程云合作开发同时实现小流程缴付机能

狡蛛属,先看此栏设计图

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图

他们同时实现那个缴付机能全然是借助于小流程云合作开发同时实现的,不必构筑他们的伺服器,不必买搜索引擎,不必登记搜索引擎,不必全力支持https。只须要两个单纯的云表达式,能随心所欲的同时实现QQ小流程缴付机能。

核心理念标识符上面那些

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图1

一,建立两个云合作开发小流程

有关怎样建立云合作开发小流程,这儿我无须做具体内容传授。不晓得是不是建立云合作开发小流程的老师,能去翻阅我以后的该文,或是瞧瞧我演唱的音频:https://edu.csdn.net/course/play/9604/204528

建立云合作开发小流程有以下几点特别注意的

1,很大千万别忘掉在app.js里调用云合作开发自然环境。

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图2

2,建立完云表达式后,很大要提过上载

二, 建立缴付的云表达式

1,建立云表达式pay

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图310行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图4

三,导入协力倚赖tenpay

他们这儿导入协力倚赖的目的,是建立他们缴付时须要的一些参数。他们安装倚赖是采用里npm 而npm必须安装node,有关怎样安装node,我这儿不做传授,百度一下,网上一大堆。

1,首先右键pay,然后选择在终端中打开

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图5

2,他们采用npm来安装那个倚赖。

在命令行里执行 npm i tenpay

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图6

安装完成后,他们的pay云表达式会多出两个package.json 文件

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图7

到这儿他们的tenpay倚赖安装好了。

四,编写云表达式pay

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图8

完整标识符如下

//云合作开发同时实现缴付 const cloud = require(wx-server-sdk) cloud.init() //1,导入缴付的协力倚赖 const tenpay = require(tenpay); //2,配置缴付信息 const config = { appid: 你的小流程appid, mchid: 你的QQ商户号, partnerKey: QQ缴付安全密钥, notify_url: 缴付回调网址,这儿能先随意填两个网址, spbill_create_ip: 127.0.0.1 //这儿填那个就能 }; exports.main = async(event, context) => { const wxContext = cloud.getWXContext() let { orderid, money } = event; //3,调用缴付 const api = tenpay.init(config); let result = await api.getPayParams({ out_trade_no: orderid, body: 商品单纯描述, total_fee: money, //订单金额(分), openid: wxContext.OPENID //付款用户的openid }); return result; }

很大要特别注意把appid,mchid,partnerKey换成你他们的。

到这儿他们获取小流程缴付所需参数的云表达式标识符编写完成了。

千万别忘掉上载那个云表达式。

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图9

出现下图代表上载成功

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图10

五,写两个单纯的页面,用来提交订单,调用pay云表达式。

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图11

那个页面很单纯,

1,他们随便编写两个订单号(那个订单号要大于6位)

2,他们随便填写两个订单价(单位是分)

3,点击按钮,调用pay云表达式。获取缴付所需参数。

下图是非官方缴付api所须要的一些必须参数。

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图12

下图是他们调用pay云表达式获取的参数,和上图所须要的是不是一样。

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图13

六,调用wx.requestPayment同时实现缴付

下图是非官方的示例标识符

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图14

这儿不在做具体内容传授了,把完整标识符给他们贴出来

// pages/pay/pay.js Page({ //提交订单 formSubmit: function(e) { let that = this; let formData = e.detail.value console.log(form发生了submit事件,携带数据为:, formData) wx.cloud.callFunction({ name: “pay”, data: { orderid: “” + formData.orderid, money: formData.money }, success(res) { console.log(“提交成功”, res.result) that.pay(res.result) }, fail(res) { console.log(“提交失败”, res) } }) }, //同时实现小流程缴付 pay(payData) { //非官方标准的缴付方法 wx.requestPayment({ timeStamp: payData.timeStamp, nonceStr: payData.nonceStr, package: payData.package, //统一下单接口返回的 prepay_id 格式如:prepay_id=*** signType: MD5, paySign: payData.paySign, //签名 success(res) { console.log(“缴付成功”, res) }, fail(res) { console.log(“缴付失败”, res) }, complete(res) { console.log(“缴付完成”, res) } }) } })

到这儿,云合作开发同时实现小流程缴付的机能完整同时实现了。

同时实现效果

1,调起缴付键盘

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图15

2,缴付完成

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图16

3,log日志,能看出不同缴付状态的回调

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图17

上图是缴付成功的回调,他们能在缴付成功回调时,改变订单缴付状态。

下图是缴付失败的回调,

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图18

下图是缴付完成的状态。

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图19

到这儿他们随心所欲的同时实现了QQ小流程的缴付机能了。是不是很单纯啊。

如果感觉图文不是很好理解,我后面会演唱音频传授。

源代码地址:

https://github.com/qiushi123/xiaochengxu_demos

10行标识符同时实现QQ小流程缴付机能,采用小流程云合作开发同时实现小流程缴付机能(含源标识符)插图20

014云合作开发同时实现小流程缴付,是他们的源代码,如果你导入源代码或是学习过程中有任何难题,都能留言或是私信我

作者:编程小石头

链接:http://www.imooc.com/article/290941

来源:慕课网

本文原创发布于慕课网 ,转载请注明出处,谢谢合作

推荐阅读

QQ小流程商城构建全栈应用

QQ服务号+Yii2.0构建商城系统全栈应用

作者 nasiapp

在线客服
官方客服
我们将24小时内回复。
12:01
您好,有任何疑问请与我们联系!

选择聊天工具: