一、逻辑梳理
1. 本次业务最终的目的是要实现一个用户A扫描一个用户B提供的二维码后跳转到某注册页面时,在邀请码填写栏会自动绑定用户A的邀请码。
2.业务分析:
2.1 邀请码可以通过生成随机字符的方式生成,通常4到5位长度就够用了,在用户B注册时就直接生成一个并添加到数据库中,用户B可以在登录后的页面看到自己的专属邀请二维码。
2.2 既然是专属二维码,如何保证邀请码的唯一性?我是使用递归实现的,效率不高,但该代码被使用到的概率不大,除非用户量特别大,导致注册时生成的随机码重复率过高。
2.3 后端如何生成一个特定的二维码?用工具类实现,网上一大堆,搜索关键字“JAVA生成二维码”就能找到,下面我也会提供。
2.4 后端生成二维码后,怎么传给前端?前端怎么展示?后端转Base64传给前端就行了,前端在展示时需要进行拼接。
2.5 成果展示:
(用户B登录后能看到的二维码)
(扫描该二维码后自动绑定了用户B的邀请码)
二、实战
2.1 注册功能:
2.1.1 前端发请求 - 假设的是没有邀请码的情况 - 注册后需生成
//注册功能 submitRegister() { //发送ajax请求 this.$http.post("/user/user/register", this.formParams).then(res => { var ajaxResult = res.data; if (ajaxResult.success) { $.alert("注册成功"); window.location.href = "http://127.0.0.1:6052/login.html"; } else { $.alert("发送失败:" + ajaxResult.message); } }) }, |
2.1.2 后端写一个dto来接收前端传的参数
@Data
public class UserSmsRegisterDto {
@NotEmpty(message = "手机号不能为空!")
private String mobile; //手机号
@NotEmpty(message = "密码不能为空!")
private String password; //密码
private String imageCode; //图形验证码
@NotEmpty(message = "短信校验码不能为空!")
private String smsCode; //手机验证码
private String qrCode; //二维码参数 - 本次的主角
@NotNull(message = "参数错误,请刷新后重试")
private Integer regChannel; //区分用户还是管理员的参数
} |
2.1.3 后端注册接口
/** * 用户注册 * @param dto * @return */ @RequestMapping(value = "/register",method = RequestMethod.POST) public JSONResult register(@RequestBody UserSmsRegisterDto dto){ userService.register(dto); return JSONResult.success(); } |
2.1.4 后端注册业务 - 注册业务有点多 - 只展示本次二维码的相关代码 - 放在保存到数据库之前