Web前端（⼗）-利⽤IDEA结合mysql和html实现⽤户登录和注
册、实现员⼯管理系统
BMI⾝体指数练习
BMI= 体重/(⾝⾼*⾝⾼) 体重(公⽄) ⾝⾼(⽶)
举例: ⾝⾼1⽶8 体重80公⽄ bmi= 80/(1.8*1.8)
bmi ⼩于18.5 偏瘦 18.5-24正常 24-28偏胖⼤于28 需要减肥了
1. 创建boot2-1⼯程, 11改成8, SpringWeb打钩
2. 在static⾥⾯创建bmi.html页⾯，页⾯中添加form表单，提交地址为/bmi，表单中两个⽂本框，name分别为⾝⾼h和体重w，最后⼀个提
交按钮
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>BMI⾝体指数</title>
</head>
<body>
<h3>测试BMI⾝体指数</h3>
<form action="/bmi">
<input type="text" name="height" placeholder="请输⼊⾝⾼(单位:m)">
<input type="text" name="weight" placeholder="请输⼊体重(单位:kg)">
<input type="submit" value="开始测试">
</form>
</body>
</html>
3. 创建controller包，并且在⾥⾯创建BMIController，添加Controller注解，在类中添加bmi⽅法处理路径为/bmi，获取传递过来的⾝⾼和
体重，利⽤上⾯的公式得到bmi值，根据上⾯的范围给客户端返回对应的提⽰信息
ller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
@Controller
public class BMIController {
@RequestMapping("/bmi")
@ResponseBody //以返回值的⽅式给客户端响应数据
public String bmi(float height,float weight){
System.out.println("height = " + height + ", weight = " + weight);
//计算bmi
float bmi = weight/(height*height);
if(bmi<18.5){
return "偏瘦";
}else if (bmi<24){
return "正常";
}else if(bmi<28){
return "偏胖";
}
return "该锻炼了";
}
}
创建数据库以及⽤户表
create database bootdb charset=utf8;
use bootdb;
create table user(id int primary key auto_increment,username varchar(50),password varchar(50),nick varchar(50),age int)charset=utf8;
⼯程中使⽤数据库需要做以下两件事
1. 在l⽂件中添加数据库相关的两个依赖
<!-- 连接MySQL数据库的依赖 -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>8.0.15</version>
</dependency>
<!-- 数据库连接池 -->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.1.21</version>
</dependency>
2. 在⼯程中创建utils包把之前jdbc⼯程中的数据库⼯具类DBUtils.java复制过来
ample.boot21.utils;
import com.alibaba.druid.pool.DruidDataSource;
import java.sql.Connection;
import java.sql.SQLException;
public class DBUtils {
private static DruidDataSource dds;
static {
//创建数据库连接池对象
dds = new DruidDataSource();
dds.setDriverClassName("sql.cj.jdbc.Driver");
/
/设置数据库连接信息
dds.setUrl("jdbc:mysql://localhost:3306/bootdb?" +
"characterEncoding=utf8&" +
"serverTimezone=Asia/Shanghai");
dds.setUsername("root");
dds.setPassword("root");
dds.setInitialSize(3);//设置初始连接数量
dds.setMaxActive(5);//设置最⼤连接数量
}
/**
* 封装获取连接⽅法
*/
public static Connection getConn() throws SQLException {
//从连接池中获取连接异常抛出
Connection conn = Connection();
System.out.println(conn);
return conn;
}
}
错误码500
如果浏览器中显⽰错误码500，是因为执⾏业务代码的过程中出的错，错误原因需要从idea控制台中的提⽰信息查。
登录功能
1. 创建login.html页⾯
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录页⾯</title>
</head>
<body>
<h3>登录页⾯</h3>
<form action="/login">
<input type="text" name="username" placeholder="⽤户名">
<input type="password" name="password" placeholder="密码">
<input type="submit" value="登录">
</form>
</body>
</html>
2. 在UserController⾥⾯
ller;
ity.User;
ample.boot21.utils.DBUtils;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
@Controller
public class UserController {
@RequestMapping("/reg")
@ResponseBody
public String reg(User user){
System.out.println("user = " + user);
/
/获取连接
try(Connection conn = Conn();){
//要执⾏的SQL语句占位符在下⾯进⾏设置，避免SQL注⼊
String sql = "insert into user values(null,?,?,?,?)";
//创建执⾏SQL执⾏的对象
PreparedStatement ps = conn.prepareStatement(sql);
ps.setString(Username());
ps.setString(Password());
ps.setString(Nick());
System.out.Age());
ps.setInt(Age());
/
html获取input输入的数据/执⾏SQL语句
} catch (SQLException e) {
e.printStackTrace();
}
return "注册成功!";
}
@RequestMapping("/login")
@ResponseBody
public String login(User user){
System.out.println("user = " + user);
/
/获取连接
try(Connection conn = Conn();){
//要执⾏的SQL语句: 通过⽤户名查询对应的密码
String sql = "select password from user where username=?";
//创建执⾏SQL执⾏的对象
PreparedStatement ps = conn.prepareStatement(sql);
ps.setString(Username());
//执⾏SQL语句
ResultSet rs = ps.executeQuery();
//判断是否有查询到数据，进⼊⽅法说明查询到了⽤户
()){
/
/pw代表数据库中的密码
String pw = rs.getString(1);
//Password()这是⽤户输⼊的密码
if(pw.Password())){
return "登录成功!";
}
return "密码错误!";
}
} catch (SQLException e) {
e.printStackTrace();
}
return "⽤户名不存在";
}
}
第⼆遍注册和登录
1. 创建⼯程boot2-1-1
2. 在l中添加数据库相关两个依赖
3. 在static⾥⾯添加 reg.html和login.html(从上⼀个⼯程中复制过来) 每次复制新⽂件到⼯程 ReBuild⼀下⼯程
4. 创建utils包把刚才⼯程中DBUtils复制到包下
5. 创建entity包下的User实体类
6. 创建controller包下的UserController 在⾥⾯实现注册登录业务
员⼯管理系统
创建表
use bootdb;
create table emp(id int primary key auto_Increment,name varchar(50),salary int,job varchar(50))charset=utf8;
具体步骤:
1. 创建boot2-3⼯程
2. 在l中添加数据库相关两个依赖：连接MySQL数据库的依赖、druid数据库连接池
3. 创建utils包，把DBUtils类从之前⼯程中复制过来（注意端⼝号）
4. 创建index.html页⾯，⾥⾯添加3个超链接：添加员⼯、显⽰员⼯列表和修改员⼯信息
5. 创建add.html页⾯，⾥⾯有form表单，提交地址为/add，新建输⼊框：name、salary、job、添加按钮。创建entity包，包下新建类
Emp，定义属性：id、name、salary、job，添加get、set、toString（）⽅法。创建controller包，包下
新建类EmpController，在EmpController⾥⾯添加add⽅法处理/add请求，将接收到的参数封装到Emp对象中，通过jdbc代码把数据保存到emp表中，给客户端返回添加成功!
6. 在EmpController中添加select⽅法，处理路径为/select，在⽅法中通过jdbc代码查询到所有员⼯信息，并且封装到Emp对象中，把对
象添加到⼀个list集合中保存，最后⾯遍历list集合，拼接出html页⾯响应给客户端。
7. 在EmpController中添加delete⽅法，处理路径为/delete，参数列表中接收传递过来的id，⽅法中通过jdbc代码删除id对应的数据，最后
重定向到列表页⾯。
8. 创建update.html页⾯，⾥⾯form表单提交地址为/update，创建输⼊框：id、name、salary、job、修改按钮，在EmpController中添加
update⽅法处理路径为/update，接收到的参数封装到emp对象中，⽅法中通过jdbc代码把emp对象中的数据修改到emp表中，最后重定向到列表页⾯。
发表评论