admin管理员组

文章数量:1634818

1:创建一个SpringBoot项目(因为SpringBoot里面封装有邮箱jar包)

 2:在pom.xml中添加 jar包

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-mail</artifactId>
</dependency>

 3:在配置文件(.yaml)中配置(数据源,邮箱数据,静态资源路径(可以省略,我这里需要配置,要不找不到静态资源的路径))如图 

 注:到这里,整个项目就配置完成了。

4:在 java 文件下添加控制文件(Controller),然后在 resource 文件下的static 下添加静态资源 ,templates 下添加 网页。

 5:Controller 文件下创建java文件(MainController)

@Controller
public class MianController {
    @RequestMapping(value = "/register",method = RequestMethod.GET)
    public String register(){
        return "register";
    }
}

 这样就可以在 tomcat服务器上打开这个网页了。

6:然后就开始配置Server了(再创建一个文件夹 Service,添加Server接口和实现类)

1:Servere接口(VerifyService)

public interface VerifyService {
    public void sendVerifyCode(String mail);
    boolean doVerify(String mail,String code);
}

2:实现接口(VerifyServiceimpl)

@Service
public class VerifyServiceimpl implements VerifyService {
    @Resource
    JavaMailSender sender;   //
    @Resource
    StringRedisTemplate template;
   @Value("${spring.mail.username}")
   String from;
    @Override
    public void sendVerifyCode(String mail) {
        SimpleMailMessage message = new SimpleMailMessage();
        message.setSubject("[xx网站]您的注册验证码");
        Random random = new Random();
        int code = random.nextInt(899999)+100000;
        template.opsForValue().set("verify:code"+mail,code+"",3, TimeUnit.MINUTES);
        message.setText("你的注册验证码为:"+code+ "三分钟内有效,请及时完成注册!如果不是本人操作,请忽略。");
        //设置邮件发送给谁,可以多个,这里就发给你的QQ邮箱
        message.setTo(mail);
//邮件发送者,这里要与配置文件中的保持一致
        message.setFrom(from);
    //OK,万事俱备只欠发送
        sender.send(message);
    }

    @Override
    public boolean doVerify(String mail, String code) {
        String string = template.opsForValue().get("verify:code" + mail);
        if (string==null) return false;
        if (!string.equals(code)) return false;
        template.delete("verify:code" + mail);
        return true;
    }
}

3:然后创建一下实体类(entity)

@Data
@AllArgsConstructor
public class RestBean {
    int code;
    String reason;
}

4:然后再在 Controller 控制文件下 添加 APIController.java文件

@RestController  //@Controller+@ResponseBody
@RequestMapping("/api/auth")
public class APIController {

    @Resource
    VerifyServiceimpl serviceimpl;
    @RequestMapping("/verify-code")
    public RestBean verifyCode(@RequestParam("email") String email){
        try {
            serviceimpl.sendVerifyCode(email);
            return new RestBean(200,"邮寄发送成功!");
        }catch (Exception e){
            return new RestBean(500,"邮寄发送失败!");
        }
    }

    @RequestMapping(value = "/register",method = RequestMethod.POST)
    public RestBean register(String username,
                             String password,
                             String email,
                             String verify){
    if (serviceimpl.doVerify(email,verify)){
        return new RestBean(200,"注册成功!");
    }else {
       return new RestBean(403,"注册失败,验证码输入错误!");
    }
    }
}

5: 这里的 html 还用到了 AJXA ,代码如下:

function askVerifyCode(){
    $.get('/api/auth/verify-code',{
        email:$("#input-email").val()
    },function (data){
        alert(data.reason)
    })
}

由于页面和静态资源太多,就没有办法放下面了,就放了页面的重要部分。

 <script src="/static/js/API.js"></script>

    <script src="/static/js/jquery.min.js"></script>

</head>

<body>

   

                            <h2><span class="primary">你好,</span>欢迎注册!</h2>

                            <p>输入邮箱后,获取验证码并填写,然后点击注册即可!</p>

                            <div class="ad-auth-form">

                                <div class="ad-auth-feilds mb-30">

                                    <input name="username" type="text" placeholder="用户名" class="ad-input">

                                    <div class="ad-auth-icon"></div>

                                       

                                        </svg>

                                    </div>

                                </div>

                                <div class="ad-auth-feilds mb-30">

                                    <input name="email" id="input-email" type="text" placeholder="邮箱" class="ad-input">

                                 

                                    <div class="ad-auth-feilds mb-30">

                                        <input name="verify" type="text" placeholder="验证码" class="ad-input">

                                        <div class="ad-auth-icon">

                                           

                                        </div>

                                    </div>

                                </div>

                                <div class="col-2">

                                    <a href="javascript:askVerifyCode();" class="ad-btn ad-login-member">获取验证码</a>

                                </div>

                            </div>

                                <div class="ad-auth-feilds">

                                    <input name="password" type="password" placeholder="密码" class="ad-input">

                                    <div class="ad-auth-icon">

                                       

                                </div>

                            </div>

                           

                            <div class="ad-auth-btn">

                                <BUTTON href="javascript:void(0);" class="ad-btn ad-login-member">注册</BUTTON>

                            </div>

                            <p class="ad-register-text">我已经注册过了 <a href="login.html">去登录</a></p>

                        </form>

                    </div>

                </div>

            </div>

            <div class="ad-notifications ad-error">

                <p><span>Duhh!</span>Something Went Wrong</p>

            </div>

测试:

 

 

 

 

 

本文标签: 邮箱JavaWeb