3.md 11 KB
3 litemall小商城
技术：
- 小商城前端，即litemall-wx模块
- 微信小程序
- 小商城后端，即litemall-wx-api模块
- Spring Boot 1.5.10
- Spring MVC
- weixin-java-tools
目前发现存在的一些问题：
严重支付功能
注意
这里之所以没有实现，是因为本人没有商户支付能力。
严重账号登录和注册中验证码
注意：
这里之所以没有实现，是因为需要接入云平台的短信服务。 后期可能接入腾讯的短信服务。
缺失优惠券功能缺失商品评价中管理员回复功能，进一步地用户之间相互评价回复缺失后台服务返回的token存在有效期，小商场应该自动刷新缺失账号多次登录失败，应该小商城出现图片验证码限制，或者后台账号锁定改善商品搜索中采用更好的搜索机制改善商品搜索中，支持热门搜索"换一批"改善地址优化，目前每一次点击都会请求后台，应该缓存已有的数据改善商品数量和规格中，如果货品数量不足，则显示效果，通常是是两种效果- 某个规格选择以后，另外规格的某些规格是实线，而某些是虚线，
- 商品的都规格选择以后，“立即购买”和“加入购物车显示”灰色
改善商品好评计算与显示，例如90%好评改善商品的评论列表中显示评价的评论分数、商品规格改善商品的评论列表中的图片点击可放大，同时用户评价的多个图片可以选择左右滑动查看。改善当一些页面查询数据没有跟新时，底部显示相应的提醒，例如“没有更多数据”。改善个人页面中实现订单部件，显示用户订单数量，同时点击以后跳转到订单的相应页面。改善商品的订单中支持订单号搜索功能改善在一些内容比较多的页面中支持“顶部”功能功能目前已经有账号登录页面，可以再支持手机短信登录方式。功能个人页面支持联系客服功能个人页面支持帮助中心功能推荐功能，基于用户的一些信息，在合适的页面给出推荐商品
3.1 litemall-wx-api
3.1.1 授权服务
3.1.1.1 账号登录
3.1.1.4 微信登录
3.1.1.5 账号注册
目前账号注册只是简单的根据用户名和密码新建一个账号。
这里缺失一个重要的属性，即用户邮箱或者手机号，来限制用户随意注册。
3.1.1.6 密码找回
3.1.2 首页服务
3.1.3 类目服务
3.1.4 商品服务
3.1.4.1 商品新品
3.1.4.2 商品热品
3.1.4.3 商品列表
- 关键字搜索
用户的搜索采用和商品的关键字属性匹配来查找商品。 因此需要用户添加商品时设置关键字值。
这里只是简单的搜索，更好地做法可能是进一步搜索商品的名字、简介。 或者采用更为专业的搜索算法。
3.1.4.4 商品详情
3.1.4.5 同类商品
3.1.4.6 商品总数
3.1.4.7 相关商品
3.1.5 品牌服务
3.1.5.1 品牌列表
3.1.5.2 品牌详情
3.1.6 专题服务
3.1.6.1 专题列表
3.1.6.2 专题详情
3.1.6.3 相关专题
3.1.7 搜索服务
3.1.7.1 搜索关键字
3.1.7.2 搜索帮助
3.1.7.3 搜索历史清除
3.1.7.4 搜索结果
3.1.8 购物车服务
3.1.8.1 购物车商品详情
3.1.8.2 添加商品到购物车
3.1.8.3 立即购物
3.1.8.4 更新购物车商品
3.1.8.5 删除购物车商品
3.1.8.6 设置购物车商品选中状态
3.1.8.7 购物车商品数量
3.1.8.8 购物车下单前确认
3.1.9 订单服务
3.1.9.1 提交订单
- 运费计算
订单费用小于88时，则需要运费8元； 否则运费0元。
目前运费8元是写在后台代码中，未来可能允许设置管理员设置其他值； 或者采用更加符合实际情况的运费计算方式。
3.1.9.2 取消订单
3.1.9.3 取消订单并退款
3.1.9.4 删除订单
3.1.9.5 订单确认发货
3.1.9.6 可评价订单商品信息
3.1.9.7 订单列表
3.1.9.8 订单详情
3.1.10 评价服务
3.1.10.1 评论列表
3.1.10.2 评论总数
3.1.10.3 提交评论
3.1.11 支付服务
准备采用weixin-java-tools工具简化微信支付代码的开发。 由于需要商户相关信息，目前没有开发。
3.1.12 收藏服务
3.1.12.1 收藏列表
3.1.12.2 收藏设置
3.1.13 足迹服务
3.1.13.1 足迹列表
3.1.13.2 删除足迹
3.1.14 收货地址服务
3.1.14.1 收货地址列表
3.1.14.2 收货地址详情
3.1.14.3 收货地址添加
3.1.14.4 收货地址删除
3.1.15 区域服务
3.1.16 安全
3.1.161 Token
用户登录成功以后，后端会返回token，之后用户的请求都会携带token。
目前token的失效和跟新机制没有涉及。
3.1.16.2 CROS
如果litemall-admin-api不配置CROS，则Spring Boot会失败。 但是，这里litemall-wx-api没有配置CROS，Spring Boot却不会报错，需要进一步研究。
3.1.16.3 账号密码加盐
如果是微信登录，那么无需账号和密码。
而如果用户采用了账号和密码的形式登录，那么后端需要把用户密码加盐。
3.1.16.4 限制登录
如果采用账号密码登录，那么登录失败一定次数，应该限制登录。
进一步地，如果项目启用了短信功能，应该短信提醒用户，防止他人登录。
目前这里没有实现，仅列出。
3.2 litemall-wx
这里的代码基于nideshop-mini-program，但是做了一定的修改：
- 数据属性名称调整，原项目中数据属性名称是下划线法命名（例如goods_id），而这里采用骆驼式命名法（例如goodsId），因此代码中需要进行相应调整；
- 代码清理重构，删除了一些目前不必要的文件，梳理一些逻辑功能；
- BUG修补，修改了一些错误；
- 功能完善拓展，例如商品立即购买功能、商品评价功能；
具体变化可以采用工具进行对比。
注意
目前litemall-wx项目代码基于nideshop-mini-program的commit版本acbf6276eb27abc6a48887cddd223d7261f0088e。由于改动变化较大，因此之后litemall-wx将独立开发，nideshop-mini-program的跟新不一定会合并到litemall-wx中。
3.2.1 业务API设置
业务API存放在config/api.js。
但是可以发现这样的代码：
// 本机开发时使用
var WxApiRoot = 'http://localhost:8082/wx/';
// 局域网测试使用
// var WxApiRoot = 'http://192.168.0.101:8082/wx/';
// 云平台部署时使用
// var WxApiRoot = 'http://122.152.206.172:8082/wx/';
也就是说这里存在三种类型的API服务地址，这里是考虑到开发存在三种情况：
- 本机开发时，localhost是当前开发机的地址；
- 手机预览时，192.168.0.101是开发机的IP地址；
- 当后台部署在云主机中时，122.152.206.172是云主机的IP地址；
- 此外，更最重要的是，如果小程序正式部署时，这里的地址必须是域名， 而不能是IP地址。
因此，开发阶段用户可以按照具体情况切换1，2或3的选项。
3.2.2 页面
3.2.2.1 首页
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.2.
3.2.3 登录设计
按照官方文档，开发者采用wx.login方法即可实现登录操作；
然而，由于wx.login只能返回临时登录凭证code，从服务器也只能返回对应的sessionId,
因此虽然已经可以视作登录，但是在小程序中不能显示有意义的登录状态，
因此实际很多小程序是继续采用wx.getUserInfo来进一步请求用户信息。
因此本模块中，用户的登录状态也是由wx.login和wx.getUserInfo组成。
3.2.2.1 登录检测
用户可以采用user.checkLogin来检查是否已登录，而其检测逻辑是：
- 可以从storage获取
userInfo和token - 同时
wx.checkSession也成功。
但是如果每次都使用checkLogin可能也不太好，因此目前机制是：
- 应用启动时就检测一次，如果登录则设置app.globalData.hasLogin为已登录状态; 之后，其他页面只要查看这个状态即可知道目前是否已登录；
- 此外，如果后台token过期返回401代码时，则及时清除过期的登录状态信息； 而用户登录失败时则app.globalData.hasLogin为未登录状态。
注意：
这里的逻辑可能有点乱。。。，但是目前实际效果看没有问题。
3.2.2.2 登录时机
登录请求用户信息的时机存在两种设计：
- 一种是小程序加载时，即申请用户信息，这种实现较简单；
- 另外一种是小程序加载时不需要，但是小程序用户需要真正用户信息时才申请用户信息， 而这种实现较复杂。
目前采用第二张实现，可以分成两种情况：
- 用户主动登录
用户主动登录，指的是我的页面中用户没有登录显示点击登录的效果。
- 用户被动登录
用户被动登录，指的是用户想购买商品或者需要用户登录才能操作的行为，
此时因为向服务器请求时token没有设置，因此服务器拒绝用户的请求，同时返回401业务代码。
目前需要检测用户登录的页面有:
- 购物车
- 我的主页
讨论:
对于第二张情况，原nideshop-mini-program项目是采取一种自动登录的方式。 这里则采用跳转登录页面的方式。
3.2.2.3 登录操作
如前面讨论，这里的登录操作实际包含两个操作wx.login和wx.getUserInfo。
用户可以采用user.loginByWeixin来进行登录操作。
按照官网文档，用户登录前应该检测以下，来避免频繁无意义的登录操作， 因此较合适的做法如下所示:
user.checkLogin().catch(() => {
user.loginByWeixin().then(res => {
this.setData({
userInfo: res.data.userInfo,
});
}).catch((err) => {
util.showErrorToast('登录失败');
});
});
3.2.2.4 登录拒绝授权
还存在一个问题，当用户登录时，会出现"微信授权"的对话框。 如果用户选择”拒绝“，那么之后用户的登录操作总是失败的。
目前的做法是，用户拒绝授权后，如果再次登录，则：
- 弹出对话框，请求用户授权
- 如果用户仍然拒绝，则返回
- 如果用户接受授权，则弹出系统权限配置页面，等待用户给与授权。
3.2.4 立即购买和放入购物车
3.2.5 storage使用
本模块中采用storage来存储一些数据，以及组件间进行通信。