微信小程序也是因为最近工作的需要来学习的,从下载安装环境到开完调试完毕,大概花了2周时间(上线部署花了2个月,至于为什么会这么长时间,后面会讲到),博主本人不太擅长页面布局什么的,因此页面设计这块不是太好看,但是整个项目从0到1,这其中还是有很多耐人寻味的经验的,因此本篇文章算是一个经验总结吧。
1、微信小程序环境搭建(省略)
这部分太基础了,有些主要是去微信公众号平台申请小程序开发账号,然后下载微信小程序的开发环境IDE。
2、现在就可以动手实现本文要实现的demo了。
先看一下项目的实现效果:
1》首页 (包括四个板块:人脸识别、智能聊天、抢单平台、数据展示)
2》人脸识别
3》智能聊天(待补图)
4》短信提醒
5》抢单平台(待补图)
6》数据展示
7》订单管理
8》客户信息--》用户人脸画像
9》产品推荐信息(待补图)
3、项目关键点说明
1)开发
接口:
人脸识别需要face++接口;
机器人聊天需要图灵接口;
短信提醒需要腾讯云短信服务接口;
特点:
1》其实和web开发差不多,不同的一点在于是基于微信小程序框架的web开发系统,因此js、CSS、html文件,相应变成js、wxss、wxml、json(可有可无,看需求)。
2》由于微信小程序框架里面没有一般web开发中那么多前端框架,而且icon素材很少,这里推荐使用阿里云 iconfont,这里面素材很多,也有很多是针对微信小程序的。前端数据图表展示,建议用wx-charts框架
2)测试
测试主要是测试人脸识别接口、机器人聊天接口、短信提醒接口、百度地图调用接口。
因为都是调用的是API,本质上都是http请求:post请求或者是get请求,因此这里推荐使用postman来测试接口,真的是很方便快捷(比写测试代码好很多)
3》环境部署
由于上线需要所有调用的API接口属于https+域名的方式,但是本项目中,图灵机器人接口是http的,因此主要是进行接口的二次封装,于是博主租了腾讯云的云服务器,并申请了域名(这就是为什么部署花了2个月的原因....流程下来太慢)并配了ssl加密,然后在云服务器端开启了一个后台程序,通过设置Nginx服务器,代理图灵机器人接口,将微信小程序的请求,通过后天转发到图灵机器人接口,由此便实现了机器人聊天功能。
4》上线
除了满足所有的API接口是https+域名的方式,还需要将这些接口添加到微信小程序管理平台域名访问设置那里。
4、至此,整个项目的重难点讲解完毕,细节部分因为涉及到页面太多,就不讲解了,大家感兴趣可以来摸索,或者找博主探讨。
附上源代码,供学习:https://github.com/xia123zheng/wxChat