码神博客系统功能优化---注册手机验证码

最近会陆续把以前的做过的项目翻出来，再理解理解，在以前的基础上实现一些其他的功能

这个功能我用了一个下午和一个晚上，其实本不需要那么长时间，后端的接口实现，用了不到10分钟，但是前端vue难倒了我，最近也会抽时间继续去复习一下vue

页面设计

只能说设计得挺勉强，我自己都有点看不过去了。

这个业务逻辑如下

1. 用户输入用户名、昵称、密码、手机号
2. 点击获取验证码，前端把含有手机号的请求发送给后端处理
3. 后端对手机号进行处理，把处理结果包含data中，返回到前端。同时将验证码放入缓存中，并设置存活时间
4. 前端对返回的data进行识别，判断是否成功，以进行下一步
5. 用户输入验证码，点击注册。前端将表单post到后端，后端进行判断后，进行注册

---

采用腾讯的短信服务，实现如下：

//实现短信发送
    @Override
    public Result getCode(LoginParam loginParam) {
        String phoneNum=loginParam.getMobile_phone_number();
        System.out.println(phoneNum);
        try{
            // 实例化一个认证对象，入参需要传入腾讯云账户secretId，secretKey,此处还需注意密钥对的保密
            // 密钥可前往https://console.cloud.tencent.com/cam/capi网站进行获取
            Credential cred = new Credential("*******");
            // 实例化一个http选项，可选的，没有特殊需求可以跳过
            HttpProfile httpProfile = new HttpProfile();
            httpProfile.setEndpoint("sms.tencentcloudapi.com");
            // 实例化一个client选项，可选的，没有特殊需求可以跳过
            ClientProfile clientProfile = new ClientProfile();
            clientProfile.setHttpProfile(httpProfile);
            // 实例化要请求产品的client对象,clientProfile是可选的
            SmsClient client = new SmsClient(cred, "ap-nanjing", clientProfile);
            // 实例化一个请求对象,每个接口都会对应一个request对象
            SendSmsRequest req = new SendSmsRequest();
            String[] phoneNumberSet1 = {phoneNum};
            req.setPhoneNumberSet(phoneNumberSet1);

            req.setSmsSdkAppId("*******");
            req.setSignName("腰缠万贯蟹老板");
            req.setTemplateId("*******");
            //6位随机数
            Random random = new Random();
            String result="";
            for (int i=0;i<6;i++)
            {
                result+=random.nextInt(10);}

            String randomNumber= result;
            String[] templateParams = {randomNumber,"5"};
            req.setTemplateParamSet(templateParams);
            //把验证码放入redis
            redisTemplate.opsForValue().set("NUMBER_"+phoneNum, randomNumber,60*5,TimeUnit.SECONDS);
            // 返回的resp是一个SendSmsResponse的实例，与请求对象对应
            SendSmsResponse resp = client.SendSms(req);
            if ("ok".equalsIgnoreCase(resp.getSendStatusSet()[0].getCode())){
                return Result.success(null);
            }


            // 输出json格式的字符串回包
            System.out.println(SendSmsResponse.toJsonString(resp));
        } catch (TencentCloudSDKException e) {
            System.out.println(e.toString());
        }
        return Result.fail(ErrorCode.Code_ERROR.getCode(), "短信发送成功");
    }

短信截图如下：