<h1-h6>:标题,<h1>是一级标题 <h2>是二级标题,最多到6级标题
标题独占一行
<center>:现在已经不再建议使用这个标签了,后期都是使用CSS控制页面中的组件位置
该标签可以让包含在它之内的组件居中显示
<input>:输入组件,组件的样式由属性type决定
type常见的值:
text:文本框
password:密码框
button:按钮
submit:提交按钮(表单使用)
radio:单选框 单选框与复选框需要使用name属性分组,
checkbox:复选框 名字相同的为一组,尤其单选框,一组的才会互斥
<a>:超链接，标签中间的文本就是超链接上提示的文字，href属性用于指定点击超链接后
跳转的路径。
<br>:换行
<table>:表格。属性border用于指定边框。
<table>标签中包含<tr>标签用于表示行
<tr>标签中包含<td>标签用于表示列
<td>标签中常见属性:
align:对其方式。left左对齐,right右对齐,center剧中对其
colspan:跨列合并列，合并是从左向右合并列
rowspan:跨行合并列，合并是从上向下合并列
form 表单
表单组件用于将用户在页面上输入的内容提交给服务端使用
所有输入组件只有包含在form标签的范围内才会被表单提交,这一点要十分注意!!!
表单有两个重要的属性:
action:用来指定表单提交的路径
method:用来指定表单提交的方式
提交方式有两种:
GET:将所有输入组件中用户输入的信息拼接到URL的资源抽象路径部分直接提交
POST:将所有信息放在请求的消息正文中打包传递
当表单中含有用户隐私信息或包含附件时应当使用POST形式提交
若form中不指定method,默认的提交方式为GET
当下面的表单使用GET形式提交时,所有输入框中的内容会被拼接到URL的资源抽象路径中提交
资源抽象路径部分的"?"左侧内容为表单action指定的路径,表示表单提交的位置
"?"右侧则是提交表单时附带的用户输入的需要提交的信息,格式为:
输入框名字1=用户输入的信息&输入框名字2=用户输入信息&....
–>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body>
<center>
<h1>用户注册</h1>
<form action="/regUser" method="get">
<table border="1">
<tr>
<td>用户名</td>
<!-- 在form表单中的输入组件都要使用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="number"></td>
</tr>
<tr>
<td colspan="2" align="center">
<!--
表单提交的专属按钮,类型为submit
点击该按钮后会将包含这个按钮的表单按照其action指定的位置提交
-->
<input type="submit" value="注册">
</td>
</tr>
</table>
</form>
</center>
</body>
</html>
在reg.html页面上点击注册按钮,测试是否可以调用到当前reg方法.
如果点击后页面上是"大白板"就说明对了,如果报错404则说明错误了.
错误的原因可3是:
1:浏览器上请求reg.html页面时,端口号是否为8080,不能使用63342这个端口!
63342端口相当于是本地打开页面,不走我们的服务器
2:当前UserController类所在的包controller是否与启动类在同一个包里
SpringBoot的要求是必须放在与启动类SpringBoot2302Application所在同一个包中
3:UserController类上是否添加了注解@Controller
reg方法上是否添加了注解@RequestMapping,并且注解中传入的参数是否与reg.html页面
上form表单中action的值相同.不仅相同,径路是否都是从"/"开始的.
比如"/regUser"
4:修改后服务器是否重启?浏览器是否重新刷新了?每次修改java代码后服务器要重启.每次修改了
网页后不仅要重启服务器,浏览器也要刷新才可以.
*/
HttpServletRequest称为请求对象,内容表达的是浏览器发送过来的所有数据
HttpServletResponse称为响应对象,内容表达的是我们处理完业务后给浏览器回复的内容
处理业务的大致过程:
1:通过请求对象获取浏览器发送过来的信息(比如表单中用户输入的注册信息)
2:通过获取的信息进行响应的业务处理
3:通过设置响应对象将处理结果回馈给浏览器
*/
package com.tedu.springboot2302.controller;
import com.tedu.springboot2302.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.*;
/**
* 当前类用于处理与用户相关的业务操作
*/
@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) {
/*
HttpServletRequest称为请求对象,内容表达的是浏览器发送过来的所有数据
HttpServletResponse称为响应对象,内容表达的是我们处理完业务后给浏览器回复的内容
处理业务的大致过程:
1:通过请求对象获取浏览器发送过来的信息(比如表单中用户输入的注册信息)
2:通过获取的信息进行响应的业务处理
3:通过设置响应对象将处理结果回馈给浏览器
*/
System.out.println("开始处理用户注册!!!!!!!!!!!!!!!");
//获取表单提交的信息
/*
getParameter中的参数要与页面上表单中对应输入框的名字一致
例如:
String username = request.getParameter("username");
^^^^^^^^
应当对应的是reg.html页面上
<input type="text" name="username">
^^^^^^^^
*/
String username = request.getParameter("username");
String password = request.getParameter("password");
String nickname = request.getParameter("nickname");
String ageStr = request.getParameter("age");
/*
获取参数后,可能出现的情况:
1:与输入框中输入的信息一致,则是正常的
2:如果是空字符串,说明页面上该输入框没有输入信息
3:如果是null,说明没有获取到这个参数,原因:
getParameter()中的参数与页面上对应输入框name属性的值不一致导致.
*/
System.out.println(username + "," + password + "," + nickname + "," + ageStr);
//对浏览器提交的数据进行必要的验证
if (username == null || username.isEmpty() ||
password == null || password.isEmpty() ||
nickname == null || nickname.isEmpty() ||
ageStr == null || ageStr.isEmpty() ||
!ageStr.matches("[0-9]+")) {
//直接给用于响应一个错误的提示页面
try {
response.sendRedirect("/reg_info_error.html");
} catch (IOException e) {
e.printStackTrace();
}
return;
}
//验证通过后,就要将该用户信息保存在服务端
/*
将用户提交的注册信息以User实例形式表示.
然后将该User实例序列化到文件中做长久保存.
*/
int age = Integer.parseInt(ageStr);
User user = new User(username, password, nickname, age);
// File file = new File("./users/"+username+".obj");
//第一个参数的File对象表示当前文件在哪个目录中
File file = new File(userDir, username + ".obj");
//首先判断该文件是否已经存在了,存在则说明此为重复用户
if (file.exists()) {
try {
response.sendRedirect("/have_user.html");
} catch (IOException e) {
e.printStackTrace();
}
return;
}
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.isEmpty()||
password==null||password.isEmpty()){
try {
response.sendRedirect("/login_info_error.html");
} catch (IOException e) {
e.printStackTrace();
}
return;
}
//用当前登录用户的用户名去users目录下找他的注册信息
File file = new File(userDir,username+".obj");
if(file.exists()){//文件存在则说明该用户注册过
//反序列化该文件并得到曾经该用户的注册信息
try (
FileInputStream fis = new FileInputStream(file);
ObjectInputStream ois = new ObjectInputStream(fis);
){
//从文件中反序列化回来的对象,应当是上面reg方法曾经保存的该用户的注册信息
User user = (User)ois.readObject();
//比较注册时输入的密码与本次登录时输入的密码是否一致
if(user.getPassword().equals(password)){
//密码一致则表示登录成功
response.sendRedirect("/login_success.html");
}else{
//登录失败
response.sendRedirect("/login_fail.html");
}
} catch (IOException | ClassNotFoundException e) {
e.printStackTrace();
}
}else{//文件不存在说明这不是一个注册用户
try {
response.sendRedirect("/login_fail.html");
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
meta标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- 3秒钟后跳转url指定的路径 -->
<meta http-equiv="refresh" content="3;url=/login.html">
<title>登录失败</title>
</head>
<body>
<center>
<h1>登录失败,用户名或密码不正确,请<a href="/index.html">重新登录</a></h1>
3秒后自动跳转登录页面
</center>
</body>
</html>
4万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
