集易市场微信小程序项目

由一个团队共同打造一个为集美大学大学生服务的二手书交易平台

---

前言

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

---

一、技术栈

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

二、发布流程

1.扫码isbn并获取检测

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

	//扫码获取isbn
	scan() {
        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页面）调用并赋予参数。
当然集易市场小程序还有许多小功能，比如监听屏幕滚动，达到一定位置上拉组件出现；加载更多数据功能；悬浮客服功能欢迎大家前往体验。