需求

发送验证码短信然后接收验证码再完成注册

具体操作

1>点击"获取验证码"的按钮,会发送sendVerifyCode的异步请求并带上参数phone(number)

查看前端代码html

查看对应的js代码

2>后端接口的实现

接口接收请求,获取到手机号,生成验证码code,拼接出短信,并发送短信(模拟)

  // 发送验证码操作@GetMapping("/sendVerifyCode")public JsonResult sendVerifyCode(String phone){userInfoService.sendVerifyCode(phone);return JsonResult.success();}

3>实现类的业务逻辑

• 获取手机号码phone和创建验证码code
• 拼接短信,发送短信,并告诉在多少分钟内使用时效
• 返回短信发送提示(后端模拟)
• 真实短信接口(下步做)
• 判断成功还是失败
• 缓存验证码,设置缓存时效

    @Overridepublic void sendVerifyCode(String phone) {// 获取手机号码phone 和 创建验证码codeString code = UUID.randomUUID().toString().replaceAll("-", "").substring(0, 4);// 拼接短信,发送短信 并告诉时效StringBuilder builder = new StringBuilder(80);builder.append("您注册的验证码是:").append(code).append(",请在").append(Consts.VERIFY_CODE_VAI_TIME).append("分钟之内使用!");// 返回短信发送提示System.out.println(builder.toString());  // 模拟发送// 以phone为key  code为value  缓存验证码 设置时效5分钟userInfoRedisService.setVerifyCode(phone,code);}

4>真实短信接口的实现

可以去网站去找第三方短信接口来实现,这里以京东万象的短信接口为例

 

 依据请求实例的提醒去获取关键信息 appkey和url

问题来了,如何在java代码中发起http请求?

解答-->spring提供了一个工具类,RestTemplate  能发起http请求

完善以上代码

    @Overridepublic void sendVerifyCode(String phone) {// 获取手机号码phone 和 创建验证码codeString code = UUID.randomUUID().toString().replaceAll("-", "").substring(0, 4);// 拼接短信,发送短信 并告诉时效StringBuilder builder = new StringBuilder(80);builder.append("您注册的验证码是:").append(code).append(",请在").append(Consts.VERIFY_CODE_VAI_TIME).append("分钟之内使用!");// 返回短信发送提示System.out.println(builder.toString());  // 模拟发送// 如何在java代码中发起http请求   jdk---URLHttpConnection--httpString appkey = "97841c945f568728327fd6f6e5aa3076";String url = "https://way.jd.com/chuangxin/dxjk?mobile={0}&content=【创信】你的验证码是：{1}，3分钟内有效！&appkey={2}";// spring提供了一个工具类-->RestTemplate -->发起http请求RestTemplate template = new RestTemplate();// 以phone为key  code为value  缓存验证码 设置时效5分钟userInfoRedisService.setVerifyCode(phone,code);}

5>优化代码(解决硬编码问题)

可以借助xml配置文件去解决

在核心子项目的core.properties中将appkey和url数据填进去

有个注意的点,因为中文编码问题,最好去网上进行编码转换

sms.url=https://way.jd.com/chuangxin/dxjk?mobile={0}&content=【创信】你的验证码是：{1}，3分钟内有效！&appkey={2}
sms.appkey=97841c945f568728327fd6f6e5aa3076

在实现类上

   // 从配置获取信息 解决硬编码问题@Value("${sms.appkey}")private String appkey;@Value("${sms.url}")private String url;