毕设把Client端选为微信小程序,一方面是不用花大量时间和精力去学习安卓app,另一方面也是微信小程序适合本次开发:轻量级,有基础用户无需注册,API完整。在申请好微信小程序之后我拿到了APPID,然后创建了一个快速启动的模板。
微信小程序在快速启动当中还是给了一个Hello World的程序,而也用到了其官方的api wx.userinfo,而其项目目录如下:

其中 image和weui.wxss是我后期修理界面的时候加的,weui.wxss是微信官方提供的wxml样式表(设计原则里说要风格统一,我就随便给搞统一了),而image里则是底部菜单栏的icon,其余的大图我都挂到了cdn上面。而微信的api当中请求wx.request是只认可https,且之前必须在官网配置后台服务器(别乱搞,一月只有五次机会了解一下)。除了这连个之外pages是微信小程序的页面,里面包括几个页面就是有几个文件夹,而app.js/app.json/app.wxss作为全局的页面配置项,project.config.json是项目的配置文件。utils是工具js(里面自带一个时间处理的方法,不过我没用过)
第一步我搞了个底部菜单栏:
在app.json配置如下:
{
"pages":[
"pages/index/index",
"pages/logs/logs",
"pages/help/help"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle":"black",
"enablePullDownRefresh": true
},
"tabBar": {
"color": "#a9b7b7",
"selectedColor": "#11cd6e",
"borderStyle": "white",
"list": [
{
"selectedIconPath": "image/scan.png",
"iconPath": "image/QRCode.png",
"pagePath": "pages/index/index",
"text": "扫一扫"
},
{
"selectedIconPath": "image/help_full.png",
"iconPath": "image/help.png",
"pagePath": "pages/help/help",
"text": "帮助/关于"
}]
}
当然,路径填好,图片搞进来--(我的icon用的是阿里国际版),在page中创建相关页面,这样一来底部菜单栏就搞定了,剩下就是简单的H5开发了,我这里只遇到一个问题:Basic Auth(微信是不允许第三方认证的),最终不知道手怎么一抖就整出了一个请求头..然后就好了...就好了....
scanner: function () {
var that = this;
wx.scanCode({
success: (res) => {
var urls = 'https://stringair.xin/api-taozi/wechat/product_check_code=' + res.result
wx.request({
url: urls,
method: 'GET',
data: {},
header: {
'Accept': 'application/json',
'Authorization': '不给看的Basic 认证'
},
success: function (res) {
console.log(res.data.data)
console.log(res.data.status)
if (res.data.status == 200) {
wx.showToast({
title: '成功检测',
icon: 'success',
duration: 2000
})
res.data.data[0].creatTime = res.data.data[0].creatTime.substring(0, 10)
res.data.data[0].updateTime = res.data.data[0].updateTime.substring(0, 10)
that.setData({
textHead: '这是正品奥,恭喜!',
output: '点击底部按钮继续扫码',
pro: res.data.data[0],
showviewSu: true,
showmain:false,
showview404:false,
showviewfail:false
})
} else if (res.data.status == 404) {
wx.showToast({
title: '产品未注册',
icon: 'loading',
duration: 1000
})
that.setData({
textHead: '抱歉。该商品的未注册或者注册信息已过期',
output: '点击底部按钮继续扫码',
showviewSu: false,
showmain: false,
showview404: true,
showviewfail: false
})
} else if (res.data.status == 500) {
wx.showToast({
title: '未知的二维码',
icon: 'loading',
duration: 1000
})
that.setData({
textHead: '我们仅支持在Stringair平台注册的商品,其他未知二维码无法进行验证',
output: '点击底部按钮继续扫码',
showviewSu: false,
showmain: false,
showview404: false,
showviewfail: true
})
}
}
})
},
完整项目就移步git吧。。不知道审核能不能过。。我的确是做了个demo而已.