目前，许多应用都需要进行身份验证，其中通过手机验证码验证身份比较常见。

本篇文章将会让你知道应用如何发送手机验证码到手机中，当然不是我发给你啦！

我们通过电脑是不能发送短信到手机中去的，因此需要第三方平台来提供服务！

我试过了好几个云短信平台，发现还是 榛子云 短信平台比较好，因为他不需要提供营业执照。

不过缺点是该平台只提供一条免费短信，其他平台提供100 多条免费短信。

好啦，我们开始正式项目了。

首先我们创建一个 Spring Boot 项目，由于之前文章谈到过，这里就不多说了。

为了简单起见，所有的代码都最简化：

前端页面 index：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <script type="text/javascript" src="/js/jquery-3.4.1.min.js"></script>
  6. <script type="text/javascript" src="/js/custom.js"></script>
  7. <title>Sign Up</title>
  8. </head>
  9. <body>
  10.     <form action="#" method="post">
  11.         <input name="phone" type="text" placeholder="Phone"><br>
  12.         <input name="verifycode" type="text">&nbsp;&nbsp;&nbsp;<button type="button" id="sendcode">获取验证码</button><br>
  13.         <input type="submit" value="SIGN UP">
  14.     </form>
  15. </body>
  16. </html>

jquery 脚本是目前最新版的，custom 脚本的作用是为了向后台提交手机号码：

  1. $(function(){  
  2.     $("#sendcode").on("click", function(){
  3.         var phone = $("input[name=phone]").val();
  4.         $.ajax({
  5.             url: "/sendsms",
  6.             type: "post",
  7.             data: {"phone":phone},
  8.         })
  9.     });
  10. });

从该脚本可以看到以 post 的方式发送了 “/sendsms” 请求，请求中包含了输入的手机号。

现在来看一下控制器：

  1. package note.controller;
  3. import java.util.Random;
  4. import org.springframework.stereotype.Controller;
  5. import org.springframework.web.bind.annotation.GetMapping;
  6. import org.springframework.web.bind.annotation.PostMapping;
  7. import org.springframework.web.bind.annotation.ResponseBody;
  8. import com.zhenzi.sms.ZhenziSmsClient;
  10. @Controller
  11. public class NoteController {
  12.     
  13.     @GetMapping("/index")
  14.     public String index() {
  15.         return "index";
  16.     }
  17.     
  18.     @PostMapping("/sendsms")
  19.     @ResponseBody
  20.     public void sendsms(String phone) {
  21.         try {
  22.                 String verifyCode = String.valueOf(new Random().nextInt(899999) + 100000);
  23.                 ZhenziSmsClient client = new ZhenziSmsClient("https://sms_developer.zhenzikj.com", "#", "#");
  24.                 client.send(phone, "您的验证码是："+verifyCode+",如非本人操作，请忽略本信息！");        
  25.         } catch (Exception e) {
  26.             e.printStackTrace();
  27.         }
  28.     }
  29. }

 

该控制器中打 # 的地方是在自己注册账号后，应用中的 AppId、AppSecret。

 

 

最后 pom.xml 文件如下：

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  3.     xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
  4.     <modelVersion>4.0.0</modelVersion>
  5.     <parent>
  6.         <groupId>org.springframework.boot</groupId>
  7.         <artifactId>spring-boot-starter-parent</artifactId>
  8.         <version>2.2.0.RELEASE</version>
  9.         <relativePath/> <!-- lookup parent from repository -->
  10.     </parent>
  11.     <groupId>com.manning</groupId>
  12.     <artifactId>Note</artifactId>
  13.     <version>0.0.1-SNAPSHOT</version>
  14.     <name>Note</name>
  15.     <description>Demo project for Note</description>
  16.  
  17.     <properties>
  18.         <java.version>11</java.version>
  19.     </properties>
  20.     <dependencies>
  21.         <dependency>
  22.             <groupId>org.springframework.boot</groupId>
  23.             <artifactId>spring-boot-starter-thymeleaf</artifactId>
  24.         </dependency>
  25.         <dependency>
  26.             <groupId>org.springframework.boot</groupId>
  27.             <artifactId>spring-boot-starter-web</artifactId>
  28.         </dependency>
  29.         <dependency>
  30.                    <groupId>com.zhenzikj</groupId>
  31.                    <artifactId>zhenzisms</artifactId>
  32.                    <version>1.0.2</version>
  33.         </dependency>
  34.         <dependency>
  35.             <groupId>org.springframework.boot</groupId>
  36.             <artifactId>spring-boot-starter-test</artifactId>
  37.             <scope>test</scope>
  38.         </dependency>
  39.     </dependencies>
  40.  
  41.     <build>
  42.         <plugins>
  43.             <plugin>
  44.                 <groupId>org.springframework.boot</groupId>
  45.                 <artifactId>spring-boot-maven-plugin</artifactId>
  46.             </plugin>
  47.         </plugins>
  48.     </build>
  49.  
  50. </project>

 

项目文件：

链接：https://pan.baidu.com/s/1Z34TqWqFSJuqVo0FsliweA
提取码：dg2a

 

版权声明：本文为M-Anonymous原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/M-Anonymous/p/11826703.html