526互联

【项目学习】谷粒商城学习记录7 - 认证服务

发布时间 2023-12-14 14:51:06作者: A_sc

【项目学习】谷粒商城学习记录7 - 认证服务

一、环境搭建 & 准备工作

1. 创建新模块


2. 配置依赖 pom.xml文件

  • 引入common模块，排除gulimall-common包的mybatis-plus
  • 将模块添加到注册中心
    • 添加配置信息
    • 添加服务发现注解
  • 启动类添加远程调用注解 @EnableFeignClients
  • 测试：服务成功加入nacos
  • 关闭thtmeleaf缓存
    spring.thymeleaf.cache=false

3. 静态页面搭建

  • 将注册页面和登录页面放在服务资源目录下
    • 登录页面改名login.html, 注册页面改名reg.html
  • host文件新增域名地址
  • 登录、注册页面动静分离,将静态资源移到nginx下
  • 修改页面内的路径



4. 网关配置

  • gateway配置文件中添加
    # 认证服务
- id: gulimall_auth_route
  uri: lb://gulimall-auth-server
  predicates:
    - Host=auth.gulimall.com

5. 网页转发

  • 首先修改首页和登录页，注册页的相互跳转地址

    • login.html页面修改
    • gulimall.html首页页面修改

  • 创建controller.LoginController.class

    @Controller
public class LoginController {

    @GetMapping("/login.html")
    public String loginPage() {
        return "login";
    }

    @GetMapping("/reg.html")
    public String regPage() {
        return "reg";
    }
}

  • 修改登录页跳转注册页地址

  • 修改注册页跳转登录页地址

5. 发送验证码后倒计时

  • 首先将发送键写成a标签，并设置id
  • 编写js代码
    $(function() {
	$("#sendCode").click(function(){
		//1、给指定手机号发送验证码
		//2、倒计时
		if($(this).hasClass("disabled")) {
			//正在倒计时
		} else {
			timeoutChangeStyle();
		}
	})
})

var num = 60;
function timeoutChangeStyle() {
	$("#sendCode").attr("class","disabled");
	if(num == 0) {
		$("#sendCode").text("发送验证码");
		num = 60;
		$("#sendCode").attr("class","");
	} else {
		var str = num + "s 后再次发送";
		$("#sendCode").text(str);
		setTimeout("timeoutChangeStyle()",1000);
	}
	num --;
}

6. 实现页面渲染

  • 创建config.GulimallWebConfig.class
    public class GulimallWebConfig implements WebMvcConfigurer {

    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/login.html").setViewName("login");
        registry.addViewController("/reg.html").setViewName("reg");
    }
}

7. 配置邮箱验证码(使用的qq邮箱)

  • 首先开启邮箱POP3/IMAP/SMTP/Exchange/CardDAV 服务，并获得授权码
  • 在gulimall-third-party服务中添加maven依赖
    <dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-mail</artifactId>
</dependency>
  • 添加配置信息
    spring:
  mail:
    host: smtp.qq.com
    username: qq号@qq.com
    password: 授权码
    default-encoding: utf-8