初学者对于前后台是怎样实现交互的,刚开始感觉很迷茫,那么看了这篇文章,你就有所启发了,是不是要感谢作者呢???那么咱们就直接开始吧!!!
首先,要实现前后端交互,那么就从最基本的开始吧!
一定要理清思路
1、设计数据库
2、编写前端登录页面
3、编写实体类
4、创建对数据库操作的dao层
5、定义连接数据库的配置文件,并编写功能为使用连接池连接数据库,封装为JDBCUtils的工具类
6、检查并测试操作数据库是否成功(可有可无)
7、编写核心控制器
8、测试运行
具体目录如下:
驱动jar包如下: 1、首先创建一张用于登录的数据表user表
2、简单编写前端登录页面login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登陆界面</title>
</head>
<body>
<form action="/login/loginServlet" method="get">
用户名 <input type="text" name="username" placeholder="请输入用户名"><br>
密码 <input type="password" name="password" placeholder="请输入密码"><br>
<input type="submit" value="登陆">
</form>
</body>
</html>
3、编写实体类
UserDao.java
package com.baoji.entity;
public class User {
private int id;
private String username;
private 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;
}
@Override
public String toString() {
return "User{" +
"id=" + id +
", username='" + username + '\'' +
", password='" + password + '\'' +
'}';
}
}
4、创建对数据库操作的dao层
UserDao.java
package com.baoji.dao;
import com.baoji.entity.User;
import com.baoji.util.JDBCUtils;
import org.springframework.dao.DataAccessException;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;
/**
*操作数据库user表的类
*/
public class UserDao {
//定义JdbcTemplate对象,将得到的资源交给数据库操作对象
private JdbcTemplate jdbcTemplate = new JdbcTemplate(JDBCUtils.getDataSource());
/**
*登陆方法
* @param loginUser 用户的用户名和密码
* @return 用户的所有信息
*/
public User login(User loginUser){
try {
//1、编写sql
String sql = "select * from user where username = ? and password = ?";
//调用queryForObject方法
User user = jdbcTemplate.queryForObject(sql, new BeanPropertyRowMapper<>(User.class),
loginUser.getUsername(), loginUser.getPassword());
return user;
} catch (DataAccessException e) {
// e.printStackTrace();
return null;
}
}
}
5、定义连接数据库的配置文件,编写功能为使用连接池连接数据库,封装为JDBCUtils的工具类,本文使用druid连接池和基于spring对原始jdbc封装的JDBCTemplate对象操作数据库,使用类加载器获取配置文件
druid.properties配置文件
JDBCUtils.javapackage com.baoji.util;
import com.alibaba.druid.pool.DruidDataSourceFactory;
import javax.sql.DataSource;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.SQLException;
import java.util.Properties;
public class JDBCUtils {
//定义数据源变量
private static DataSource ds;
static{
try {
//1、加载配置文件
Properties properties = new Properties();
//使用ClassLoade加载,获取字节码输入流
InputStream is = JDBCUtils.class.getClassLoader().getResourceAsStream("druid.properties");
//加载数据源
properties.load(is);
//2、使用工厂初始化连接池对象
try {
ds = DruidDataSourceFactory.createDataSource(properties);
} catch (Exception e) {
e.printStackTrace();
}
} catch (IOException e) {
e.printStackTrace();
}
}
/**
* 获取连接池对象
*/
public static DataSource getDataSource(){
return ds;
}
/**
* 获取连接Connection对象
*/
public static Connection getConnection() throws SQLException {
return ds.getConnection();
}
}
6、检查并测试操作数据库是否成功(可有可无)
package com.baoji.test;
import com.baoji.dao.UserDao;
import com.baoji.entity.User;
import org.junit.Test;
public class UserDaoTest {
@Test
public void test(){
User loginUser = new User();
loginUser.setUsername("admin");
loginUser.setPassword("123");
UserDao userDao = new UserDao();
User user = userDao.login(loginUser);
System.out.println(user);
}
}
7、前面六步都已经执行成功时,说明操作数据库已经完成,下来开始编写核心控制器。实现和前端页面胡交互过程(非常重要)
下面先来看看具体实现的流程
package com.baoji.web;
import com.baoji.dao.UserDao;
import com.baoji.entity.User;
import org.apache.commons.beanutils.BeanUtils;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.lang.reflect.InvocationTargetException;
import java.util.Map;
@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//1、设置编码
req.setCharacterEncoding("utf-8");
//2、获取username和password请求参数
// String username = req.getParameter("username");
// String password = req.getParameter("password");
//知识延申:
// 2.1获取所有请求对象
Map<String, String[]> map = req.getParameterMap();
//3、将username和password的值封装在user对象中
// User loginUser = new User();
// loginUser.setUsername(username);
// loginUser.setPassword(password);
//延伸:
//3.1创建user对象
User loginUser = new User();
//3.2使用BeanUtils工具类将map封装在user中(需要导入commons-beanutils-1.8.0.jar包)
try {
BeanUtils.populate(loginUser,map);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
//4、调用Userdao的login方法查询,获取返回值为User对象
UserDao userDao = new UserDao();
User user = userDao.login(loginUser);
//5、判断user是否为空,若是,跳转错误页面,若不是,跳转成功页面
if(user == null){
//登陆失败
//请求转发到错误页面
req.getRequestDispatcher("/failServlet").forward(req,resp);
}else{
//登陆成功
//存储数据
req.setAttribute("user",user);
//请求转发到成功页面
req.getRequestDispatcher("/successServlet").forward(req,resp);
}
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doGet(req,resp);
}
}
延伸内容:为了一步获取所有请求参数,我们常常将请求参数封装在map集合中。
Map<String, String[]> map = req.getParameterMap();
接下来我们将集合中的请求参数,使用BeanUtils工具类将map封装在user对象中
//延伸:
//3.1创建user对象
User loginUser = new User();
//3.2使用BeanUtils工具类将map封装在user中(需要导入commons-beanutils-1.8.0.jar包)
try {
BeanUtils.populate(loginUser,map);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
成功页面
SucessServlet.java
package com.baoji.web;
import com.baoji.entity.User;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet("/successServlet")
public class SuccessServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//获取request域中共享的user对象
User user = (User) req.getAttribute("user");
if(user != null) {
//设置编码
resp.setContentType("text/html;charset=utf-8");
//输出
resp.getWriter().write("登陆成功!" + user.getUsername() + ",欢迎您");
}
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doGet(req,resp);
}
}
错误页面
FailServlet.java
package com.baoji.web;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet("/failServlet")
public class FailServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//设置编码
resp.setContentType("text/html;charset=utf-8");
//输出错误信息
resp.getWriter().write("登陆失败,用户名或密码错误");
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doGet(req,resp);
}
}
下面我们来介绍下BeanUtils工具类吧!!!
BeanUtils工具类,简化数据封装
* 用于封装JavaBean的
1. JavaBean:标准的Java类
1. 要求:
1. 类必须被public修饰
2. 必须提供空参的构造器
3. 成员变量必须使用private修饰
4. 提供公共setter和getter方法
2. 功能:封装数据
2. 概念:
成员变量:
属性:setter和getter方法截取后的产物
例如:getUsername() --> Username--> username
3. 方法:
1. setProperty()
2. getProperty()
3. populate(Object obj , Map map):将map集合的键值对信息,封装到对应的JavaBean对象中
据听说现在很多老手还分不清成员变量和属性到底一样不???你知道吗???
成员变量:在类内属性外用修饰符定义的变量称为成员变量
属性:在get或者set方法名去掉get或set后,把剩余的部分首字母改为小写后,即为这个类的属性。
虽然这个案例就简单的实现了前后端的登录,里面的业务逻辑不太复杂,但这篇文章是带领读者刚开始前后端交互的案例,主要讲究思路,以后的大型项目基本流程类似。整理思路最重要。望读者更加努力。
写在最后 推荐自己的Github地址:github.com/Lmobject
欢迎读者前来访问,您的点赞与留言是对作者最大的支持与鼓励。谢谢!