(三)、IDEA部分
1.创建SpringBoot项目
创建SpringBoot并引入web依赖。
2.创建两个实体类
1.com/jsxs/pojo/User.java
用于用户的认证
package com.jsxs.pojo; /** * @Author Jsxs * @Date 2023/5/13 19:51 * @PackageName:com.jsxs.pojo * @ClassName: User * @Description: TODO * @Version 1.0 */ public class User { int id; String username; String password; public int getId(){ return id; } public void setId(int id){ this.id = id; } public String getUsername(){ return username; } public void setUsername(String username){ this.username = username; } public String getPassword(){ return password; } public void setPassword(String password){ this.password = password; } }
2.com/jsxs/pojo/Result.java
用于返回状态码
package com.jsxs.result; /** * @Author Jsxs * @Date 2023/5/13 19:53 * @PackageName:com.jsxs.result * @ClassName: Result * @Description: TODO * @Version 1.0 */ public class Result { //响应码 private int code; public Result(int code){ this.code = code; } public int getCode(){ return code; } public void setCode(int code){ this.code = code; } }
3.创建控制层
controller/LoginController.java
package com.jsxs.controller; import com.jsxs.pojo.User; import com.jsxs.result.Result; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.CrossOrigin; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestBody; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.util.HtmlUtils; import java.util.Objects; /** * @Author Jsxs * @Date 2023/5/13 19:53 * @PackageName:com.jsxs.controller * @ClassName: LoginController * @Description: TODO * @Version 1.0 */ @Controller public class LoginController { @CrossOrigin @PostMapping(value = "api/login") @ResponseBody public Result login(@RequestBody User requestUser){ //对html 标签进行转义,防止XSS攻击 //分别与接收到的User类的username和password进行比较,根据结果的不停Result(不同的响应码) String username = requestUser.getUsername(); username = HtmlUtils.htmlEscape(username); if(!Objects.equals("1",username) || !Objects.equals("1",requestUser.getPassword())){ String message = "账号密码错误"; System.out.println("test"); return new Result(400); }else{ System.out.println("成功!!"); return new Result(200); } } }
4.配置后端响应的端口
server.port=8443
(四)、Vue和SpringBoot交互
1.同时运行IDEA和Vscode
IDEA
Vscode: npm run serve
2.访问登入界面
访问: http://localhost:8080/#/login
密码输入正确后 显示成功。