前言

  本文主要介绍集易市场微信小程序项目发布流程相关逻辑功能介绍与代码演示，具体详见微信小程序——集易市场

一、技术栈

微信开发者工具
云开发
云函数路由tcb-router
第三方依赖tenpay

二、发布流程

1.扫码isbn并获取检测

点击扫码按钮时，调用wx.scanCode函数，当检测到一维码即可以获取的对应书籍的isbn，首先判断是否注册否则跳转注册页面，若已注册则检查数据库是否存在该书记录，没有再进行云函数调用。

 //扫码获取isbnscan() {let that = this;wx.scanCode({onlyFromCamera: false,scanType: ['barCode'],success: res => {wx.showToast({title: '扫码成功',icon: 'success'})that.setData({isbn: res.result})},fail() {wx.showToast({title: '扫码失败，请重新扫码或者手动输入',icon: 'none'})}})},//查询书籍数据库详情get_book(bn) {let that = this;wx.showLoading({title: '正在获取'})//先检查是否存在该书记录，没有再进行云函数调用db.collection('books').where({isbn: bn}).get({success(res) {//添加到数据库if (res.data == "") {that.addbooks(bn);} else {wx.hideLoading();that.setData({bookinfo: res.data[0],active: 1,})}}})},

2.调用云函数添加书籍

云函数需提前写好在云开发cloudfunctions文件夹里，使用云函数路由tcb-router，因为这样可以使得代码层级结构清晰，底层数据库操作函数可复用，这里使用的是极速数据的api接口，申请接口密钥即可使用。

 //根据isbn码获取图书详情信息app.router('bookinfo', async(ctx) => {ctx.body = new Promise(resolve => {rq({url: 'https://api.jisuapi.com/isbn/query?appkey=' + appkey + '&isbn=' + event.isbn,method: "GET",json: true,}, function(error, response, body) {resolve({body: body})});});});

 //添加书籍信息到数据库addbooks(bn) {let that = this;wx.cloud.callFunction({name: 'books',data: {$url: "bookinfo", //云函数路由参数isbn: bn},success: res => {if (res.result.body.status == 0) {db.collection('books').add({data: res.result.body.result,success: function (res) {wx.hideLoading();that.setData({bookinfo: res.result.body.result,active: 1,})},fail: console.error})}},fail: err => {console.error(err)}})},

3.微信支付

正式发布之前需补充图书信息，例如专业类书籍需要选择学院，然后就是需要提交服务费才可正式发布（添加数据库publish并渲染在首页）。服务收费通过云函数来实现，在云函数里需要添加第三方依赖tenpay，调用tenpay需要配置信息config，其中config中的商户号和服务商密钥需自己前往微信商户平台进行接入得以获取。

接着调用 tenpay.init(config)实例化成功，在使用getPayParams方法将获取到的参数传回客户端继续调用wx.requestPayment方法即可实现微信支付功能。成功支付之后便可上传到publish数据库实现页面渲染。具体详见如下代码

 let result = await api.getPayParams({//商户订单号，我这里是定义的boolk+商品发布时间+当前时间戳//微信这里限制订单号一次性不能重复，只需要唯一即可out_trade_no: 'book'+good.creat + '' + curTime,     body: good.bookinfo.title,       //商品名称，我设置的书名total_fee: parseFloat(good.price)*100,     //金额，注意是数字，不是字符串openid: wxContext.OPENID //***用户的openid});

 let pay = serviceCharge.then((res) => {let payData = res.result;return wx.requestPayment({timeStamp: payData.timeStamp,nonceStr: payData.nonceStr,package: payData.package,signType: 'MD5',paySign: payData.paySign})})

总结

本文仅仅是对集易市场小程序发布流程的一个介绍，还有正式支付，短信提醒，邮件提醒收货，但方式都与其差不多，首先需要在云函数里引入相关依赖，得到相关配置信息并写入函数，接着在逻辑页面（js页面）调用并赋予参数。
当然集易市场小程序还有许多小功能，比如监听屏幕滚动，达到一定位置上拉组件出现；加载更多数据功能；悬浮客服功能欢迎大家前往体验。

集易市场微信小程序项目相关推荐

微信小程序项目实战之天气预报
概述微信小程序项目实战之天气预报详细代码下载:http://www.demodashi.com/demo/10634.html 一.准备工作 1.注册微信小程序 2.注册和风天气账号 3.注册百 ...
微信小程序项目实战之豆瓣天气
概述微信小程序项目实战之豆瓣天气详细代码下载:http://www.demodashi.com/demo/10943.html 一.准备工作 1.注册微信小程序 2.在小程序设置中设置reque ...
健康菜谱微信小程序+项目前后台源码（JavaSSM+Mysql）
博主介绍:✌在职Java研发工程师.专注于程序设计.源码分享.技术交流.专注于Java技术领域和毕业设计✌ 项目名称健康菜谱微信小程序+项目前后台源码(JavaSSM+Mysql) 视频效果 ht ...
uniapp微信小程序项目启动步骤
如何创建项目就不说了,可以参考该链接: 如何创建开发uniapp微信小程序项目?链接: link 这里主要记录的是,从代码仓库拉取到本地后, 本地启动运行项目,遇到的问题. 1.下载项目使用git ...
微信小程序项目实战：快递查询-李宁-专题视频课程
微信小程序项目实战:快递查询-1303人已学习课程介绍本课程主要介绍了scrollview布局,以及如何通过第三方API获取并处理数据. 课程收益本课程主要介绍了如何实现 ...
微信小程序项目实战：电影购票系统-李宁-专题视频课程
微信小程序项目实战:电影购票系统-1644人已学习课程介绍本课程主要介绍了scrollview布局,导航.从服务端获取数据,以及处理数据的方法. 课程收益本课程的目标是让 ...
DAY10微信小程序项目开发技术总结
一.每日实习任务 1．网页基础知识(html,css,js) 今天老师为我们介绍讲解了网页基础知识(html,css,js).首先,我们安装了谷歌浏览器及sublime text.老师为我们介绍了ht ...
视频教程-微信小程序项目实战之我画你猜视频课程-微信开发
微信小程序项目实战之我画你猜视频课程精通PHP软件开发和WEB前端开发技术,熟悉PHP.Java.Javascript.HTML等语言,熟悉HTTP协议及W3C相关互联网规范,曾在山西某知名公司担任 ...
手把手带你学习微信小程序 —— 项目实战篇
微信小程序项目实战篇 WeChat-applet 1.支付宝界面展示 2.微博发帖功能实现 3.时间格式化案例 4.微信红包界面展示 5.微信消息删除案例 6.微信icon 组件 6.1 支付成功界面 ...

集易市场微信小程序项目

文章目录

前言