1.制作简单用户注册html页面 保存在SpringBoot项目resources目录中static目录下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body>
<center>
<h1>用户注册</h1>
<!--
<form>:表单,用于将用户在页面上输入的信息提交给服务端的组件。
form中有两个重要的属性:method,action
action:用于指定表单提交到哪里(拟定一个路径,该路径需要服务端配合处理)
method:表单提交方式,有两种:GET,POST.不指定时默认为GET提交。
GET,POST不缺分大小写
GET形式提交表单时。表单中个输入框内容会被拼接到抽象路径的"?"右侧。
具体格式为:输入框1的名字=输入框内容&输入框2的名字=输入框内容&...
"?"左侧为请求路径,对应的是action指定的路径。
最终实体提交是如下:
http://localhost:8080/reg.html
http://localhost:8080/regUser?username=范传奇&password=123456&nickname=传奇&age=22
-->
<form action="/regUser" method="get">
<table border="1">
<tr>
<td>用户名</td>
<!-- 输入框必须要使用name属性指定名字,否则表单提交时会忽略 -->
<td><input name="username" type="text"></td>
</tr>
<tr>
<td>密码</td>
<td><input name="password" type="password"></td>
</tr>
<tr>
<td>昵称</td>
<td><input name="nickname" type="text"></td>
</tr>
<tr>
<td>年龄</td>
<td><input name="age" type="text"></td>
</tr>
<tr>
<td align="center" colspan="2">
<input type="submit" value="注册">
</td>
</tr>
</table>
</form>
</center>
</body>
</html>
2.制作简单用户登录html页面 保存在SpringBoot项目resources目录中static目录下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户登录</title>
</head>
<body>
<center>
<h1>用户登录</h1>
<form action="/loginUser" method="get">
<table border="1">
<tr>
<td>用户名</td>
<td><input name="username" type="text"></td>
</tr>
<tr>
<td>密码</td>
<td><input name="password" type="password"></td>
</tr>
<tr>
<td align="center" colspan="2">
<input type="submit" value="登录">
</td>
</tr>
</table>
</form>
</center>
</body>
</html>
3.创建用户属性类,手动添加无参构造,有参构造方法,重写toString,添加getter setter方法
import java.io.Serializable;
/**
* User的每一个实例用于表示一个注册用户信息
*/
public class User implements Serializable {
private String username;
private String password;
private String nickname;
private int age;
public User(){}
public User(String username, String password, String nickname, int age) {
this.username = username;
this.password = password;
this.nickname = nickname;
this.age = age;
}
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;
}
public String getNickname() {
return nickname;
}
public void setNickname(String nickname) {
this.nickname = nickname;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
@Override
public String toString() {
return "User{" +
"username='" + username + '\'' +
", password='" + password + '\'' +
", nickname='" + nickname + '\'' +
", age=" + age +
'}';
}
}
4.通过根目录下Application代码的运行从浏览器访问本地html文件页面并处理注册用户登录用户的操作
import com.tedu.springboot2210.entity.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.*;
import java.util.ArrayList;
import java.util.List;
/**
* 该类负责处理所有与用户相关的操作
*/
@Controller
public class UserController {
private static File userDir;//保存所有用户信息的目录
static {
userDir = new File("./users");
if(!userDir.exists()){//如果目录不存在
userDir.mkdirs();
}
}
@RequestMapping("/regUser")
public void reg(HttpServletRequest request, HttpServletResponse response){
System.out.println("开始处理注册!");
/*
HttpServletRequest对象表示请求,即:浏览器发送过来的所有信息都保存在
这个对象中。
当我们想获取浏览器提交过来的参数时,可以调用请求对象的方法:
String getParameter(String name)
这里指定的参数名要与页面表单中输入框的名字一致。即:
<input name="username" type="text">
request.getParameter("username");就可以获取页面中该输入框的内容
获取参数时有两个特殊情况:
1:如果用户在输入框中没有输入信息,则返回空字符串
请求路径如:
/regUser?username=&password=123&nickname=....
^用户名后面没有值,说明用户没有输入该信息就提交了
String username = request.getParameter("username");
返回的username为空字符串
2:如果浏览器没有提交该参数,则返回值为null
/regUser?password=123&nickname=chuanqi&age=22
^没有传递username这个参数
String username = request.getParameter("username");
返回的username为null
*/
String username = request.getParameter("username");
String password = request.getParameter("password");
String nickname = request.getParameter("nickname");
String ageStr = request.getParameter("age");
System.out.println(username+","+password+","+nickname+","+ageStr);
//必要的验证工作
if(username==null||username.trim().isEmpty()||
password==null||password.trim().isEmpty()||
nickname==null||nickname.trim().isEmpty()||
ageStr==null||ageStr.trim().isEmpty()||
!ageStr.matches("[0-9]+")){
try {
response.sendRedirect("/reg_info_error.html");
return;
} catch (IOException e) {
e.printStackTrace();
}
}
int age = Integer.parseInt(ageStr);//先将年龄转换为整数
User user = new User(username,password,nickname,age);
//表达users目录下该用户名.obj文件
File file = new File(userDir,username+".obj");
//验证是否为重复用户
if(file.exists()){//如果注册前发现该文件已存在则说明为重复的用户名
try {
response.sendRedirect("/have_user.html");
return;
} catch (IOException e) {
e.printStackTrace();
}
}
try (
FileOutputStream fos = new FileOutputStream(file);
ObjectOutputStream oos = new ObjectOutputStream(fos);
){
oos.writeObject(user);//将注册用户序列化到文件中保存
//通过响应对象要求浏览器请求下面的地址(注册成功的提示页面)
response.sendRedirect("/reg_success.html");
} catch (IOException e) {
e.printStackTrace();
}
}
@RequestMapping("/loginUser")
public void login(HttpServletRequest request,HttpServletResponse response){
System.out.println("开始处理登录...");
//1获取用户输入的登录信息
String username = request.getParameter("username");
String password = request.getParameter("password");
//必要的验证
if(username==null||username.trim().isEmpty()||
password==null||password.trim().isEmpty()){
try {
response.sendRedirect("/login_info_error.html");
return;
} catch (IOException e) {
e.printStackTrace();
}
}
//根据该用户输入的登录用户名去users目录下定位该用户曾经的注册信息对应的文件
File file = new File(userDir,username+".obj");
if(file.exists()){//如果文件存在则说明用户名有效
try (
FileInputStream fis = new FileInputStream(file);
ObjectInputStream ois = new ObjectInputStream(fis);
){
User user = (User)ois.readObject();//反序列化得到注册信息
//比对登录密码和注册时输入的密码是否一致
if(user.getPassword().equals(password)){
//登录成功
response.sendRedirect("/login_success.html");
return;
}
} catch (IOException | ClassNotFoundException e) {
e.printStackTrace();
}
}
//响应登录失败页面
try {
response.sendRedirect("/login_fail.html");
} catch (IOException e) {
e.printStackTrace();
}
}
@RequestMapping("/userList")
public void userList(HttpServletRequest request,HttpServletResponse response){
System.out.println("开始处理动态页面");
//准备要在页面上展示的所有注册用户信息
List<User> userList = new ArrayList<>();
//获取users目录中的所有obj文件
File[] subs = userDir.listFiles(f->f.getName().endsWith(".obj"));
for(File sub : subs){
try (
FileInputStream fis = new FileInputStream(sub);
ObjectInputStream ois = new ObjectInputStream(fis);
){
User user = (User)ois.readObject();//反序列化每个注册用户
userList.add(user);//将该注册用户信息存入集合备用
} catch (IOException|ClassNotFoundException e) {
e.printStackTrace();
}
}
try {
response.setContentType("text/html;charset=utf-8");
PrintWriter pw = response.getWriter();
pw.println("<html>");
pw.println("<head>");
pw.println("<meta charset='utf-8'>");
pw.println("<title>用户列表</title>");
pw.println("</head>");
pw.println("<body>");
pw.println("<center>");
pw.println("<h1>用户列表</h1>");
pw.println("<table border='1'>");
pw.println("<tr>");
pw.println("<td>用户名</td>");
pw.println("<td>密码</td>");
pw.println("<td>昵称</td>");
pw.println("<td>年龄</td>");
pw.println("</tr>");
for(User user : userList) {
pw.println("<tr>");
pw.println("<td>"+user.getUsername()+"</td>");
pw.println("<td>"+user.getPassword()+"</td>");
pw.println("<td>"+user.getNickname()+"</td>");
pw.println("<td>"+user.getAge()+"</td>");
pw.println("</tr>");
}
pw.println("</table>");
pw.println("</center>");
pw.println("</body>");
pw.println("</html>");
} catch (IOException e) {
e.printStackTrace();
}
}
}
5.验证条件:验证用户输入的信息是否存在空或者格式不对(部分信息可以通过正则表达式验证)验证不通过则通过response.sendRedirect方法发送对应的本地创建html页面类似于以下页面,注册成功则保存对象注册信息到本地
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>错误</title>
</head>
<body>
<center>
<h1>注册信息输入有误,请<a href="/reg.html">重新注册</a></h1>
</center>
</body>
</html>
6.验证用户登录:验证本地是否有保存的用户信息,验证用户输入的数据是否正确,不正确则跳转对应的本地html文件页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>失败</title>
</head>
<body>
<center>
<h1>登录失败,用户名或密码不正确,请<a href="/login.html">重新登录</a></h1>
</center>
</body>
</html>