一、准备工作
1.进行阿里云平台账号注册具体流程步骤这里不再演示
建议是在此页面下进行业务学习并且通过API测试以后再引入项目中
而后点进帮助文档进行相关依赖的引入
我这里使用的如下模板：
<!--阿里云短信验证-->
<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-java-sdk-core</artifactId>
<version>4.5.16</version>
</dependency>
<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-java-sdk-dysmsapi</artifactId>
<version>2.1.0</version>
</dependency>
2，引入依赖后进行工具类编辑，阿里云提供了相关的工具类
package com.utils;
import com.aliyuncs.DefaultAcsClient;
import com.aliyuncs.IAcsClient;
import com.aliyuncs.dysmsapi.model.v20170525.SendSmsRequest;
import com.aliyuncs.dysmsapi.model.v20170525.SendSmsResponse;
import com.aliyuncs.exceptions.ClientException;
import com.aliyuncs.profile.DefaultProfile;
/**
* 短信发送工具类
*/
public class SMSUtils {
/**
* 发送短信
* @param signName 签名
* @param templateCode 模板
* @param phoneNumbers 手机号
* @param param 参数
*/
public static void sendMessage(String signName, String templateCode, String phoneNumbers, Integer param){
DefaultProfile profile = DefaultProfile.getProfile(
"ch-hangzhou",
"LTAI5tCB94gzN4jr44pijKX1",
"rB5ygOecXfUTMshcAzeQBmSNBFwhNN");
IAcsClient client = new DefaultAcsClient(profile);
SendSmsRequest request = new SendSmsRequest();
request.setSysRegionId("cn-hangzhou");
request.setPhoneNumbers(phoneNumbers);
request.setSignName(signName);
request.setTemplateCode(templateCode);
request.setTemplateParam("{\"code\":\""+param+"\"}");
try {
SendSmsResponse response = client.getAcsResponse(request);
System.out.println("短信发送成功");
}catch (ClientException e) {
e.printStackTrace();
}
}
}
上面发送工具类，根据自己的一个业务情景进行设定字段值
package com.utils;/*
*
*作者：锦成
*任务：随机生成验证码工具类
*
*备注：
*@Date2023/06/12/10:51
***/
import java.util.Random;
public class ValidateCodeUtils {
/**
* 随机生成验证码
* @param length 长度为4位或者6位
* @return
*/
public static Integer generateValidateCode(int length){
Integer code =null;
if(length == 4){
code = new Random().nextInt(9999);//生成随机数，最大为9999
if(code < 1000){
code = code + 1000;//保证随机数为4位数字
}
}else if(length == 6){
code = new Random().nextInt(999999);//生成随机数，最大为999999
if(code < 100000){
code = code + 100000;//保证随机数为6位数字
}
}else{
throw new RuntimeException("只能生成4位或6位数字验证码");
}
return code;
}
/**
* 随机生成指定长度字符串验证码
* @param length 长度
* @return
*/
public static String generateValidateCode4String(int length){
Random rdm = new Random();
String hash1 = Integer.toHexString(rdm.nextInt());
String capstr = hash1.substring(0, length);
return capstr;
}
}
此处为验证码自动生成片段，根据业务需求可分为字符型或者整形的验证码，这里可以规定验证码长度。使用util里的随机函数进行生成即可，当然你自己有能力也可以编写一段算法生成。
3.补充在编写代码前要在云平台上申请好模板和签名管理
4.对于后端LoginController中的发送短信业务编写
@RequestMapping(value = "/sendMsg/{dianhuahaoma}")
public R sendMsg(@PathVariable("dianhuahaoma") String dianhuahaoma ,HttpSession session){
if(StringUtils.isNotEmpty(dianhuahaoma)){
//生成随机的4位验证码
Integer code=ValidateCodeUtils.generateValidateCode(4);
//后台获取验证码方便验证
System.out.println(code);
//调用阿里云提供的短信服务API完成发送短信业务，岸上见-考研互助平台
SMSUtils.sendMessage("岸上见考研互助平台","SMS_267860482",dianhuahaoma,code);
//需要将生成的代码保存到Session中
// session.setAttribute(dianhuahaoma,code);
//放入redis缓存
redisTemplate.opsForValue().set(dianhuahaoma,code,5L,TimeUnit.MINUTES);
Integer rediscode = (Integer) redisTemplate.opsForValue().get(dianhuahaoma);
//测试
System.out.println("这是redis里的code:"+rediscode);
return R.ok().put("data",code);
}
return R.error("短信发送失败");
}
二、测试—而后启动项目按照自己设定的传值方式以及值进行接口测试
1.使用Postman进行测试
我项目所需要的是电话号码进行传值调用（考虑在后台进行打印输出所发生的验证码）方便自己测试
三、前端业务按钮增加绑定后端的接口调用传参
前端我是用的Vue框架结合ElementUi进行编写的所以各位看官到这如果看不懂还是去看看Vue的教学哈。
1.页面样式如下：
2.前端具体业务代码
<div v-if="loginType==1" class="list-item" :style='{"width":"100%","margin":"0 auto 10px","alignItems":"center","flexWrap":"wrap","display":"flex"}'>
<div v-if="false" class="lable" :style='{"width":"64px","lineHeight":"44px","fontSize":"14px","color":"rgba(64, 158, 255, 1)"}'>手机号码：</div>
<input :style='{"border":"0","padding":"0 10px","boxShadow":"0px 4px 10px 0px rgba(0,0,0,0.3020)","color":"#333","width":"100%","fontSize":"14px","height":"44px"}' placeholder="请输入手机号码" name="dianhuahaoma" type="text" v-model="rulesForm.dianhuanhaoma">
</div>
<el-button type="primary" round @click="getCoed()" class="loginInBt">获取验证码</el-button>
当点击获取验证码按钮后调用getCode()函数对输入的手机号进行后端对接传参
data() {
return {
baseUrl:this.$base.url,
loginType: 1,
rulesForm: {
username: "",
password: "",
role: "",
dianhuanhaoma:"",
code: '',
},
menus: [],
roles: [],
tableName: "",
};
},
methods中的代码如下：
//编写验证码
getCoed(){
Axios.get('http://localhost:8080/Kyhz/xuesheng/sendMsg/' + this.rulesForm.dianhuanhaoma).then(resp =>{
})
},
使用字段拼接传值
3.F12打开进行业务测试
200成功以后观察后端业务有没有正常调用
到此前后端一个短信发送完成！
四、验证业务。
1.考虑到要做验证码的一个超时业务，所以选用redis进行一个业务的中间件。（引入依赖）
<!--redis 来着Spring data 工具-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-redis</artifactId>
</dependency>
而后在application.yml文件中做redis配置 如下：
2.在业务逻辑内进行登录校验（也可以在前端业务做）
// 别忘了加
@Autowired
private RedisTemplate redisTemplate;
@IgnoreAuth
@RequestMapping(value = "/login")
public R login(String username, String password, String dianhuahaoma, Integer code, HttpServletRequest request) {
/*测试使用*/
System.out.println("username: " + username);
System.out.println("password: " + password);
System.out.println("dianhuahaoma: " + dianhuahaoma);
System.out.println("code: " + code);
Integer codeInredis= (Integer) redisTemplate.opsForValue().get(dianhuahaoma);
System.out.println("codeInredis:"+codeInredis);
/*功能逻辑*/
if(codeInredis!=null && codeInredis.equals(code)){
XueshengEntity u = xueshengService.selectOne(new EntityWrapper<XueshengEntity>().eq("xueshengzhanghao", username));
System.out.println("u:"+u);
if(u==null || !u.getMima().equals(password)) {
return R.error("账号或密码不正确");
}
if(!"是".equals(u.getSfsh())) return R.error("账号已锁定，请联系管理员审核。");
String token = tokenService.generateToken(u.getId(), username,"xuesheng", "学生" );
System.out.println("学生登陆token："+token);
return R.ok().put("token", token);
}else{
return R.error("验证码不正确请再次输入！");
}
}
对于该业务的一个短信超时不可用，是在发送类中进行编写的，一定要加@Autowired
private RedisTemplate redisTemplate;
3.而后进行业务验证了
至此短信验证登录业务开发完成，能帮助到大家在业务上的问题很开心。谢谢关注！
513
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
