一.mysql中新建库和表:
tb_user
userId 主键 int 不能为空
uname 姓名 varchar(20) 不能为空
upwd 密码 varchar(20) 不能为空
remark 备注 varchar(200) 可为空
二.DBUtil工具类
1.导入mysql的jar包(jar需要放置到WebContent目录下的WEB-INF目录下的lib目录中)
2.准备db.properties配置文件
驱动名jdbcName;用户名;用户密码;连接数据库的url;
3.关闭资源
三. user对象的javaben
userId
uname
upwd
remark
package com.shsxt.user;
/**
* javaben
* 用户对象
* @author User
*
*/
public class User {
private Integer userId;//主键 用户id
private String unmae;//用户名
private String upwd;//用户密码
private String remark;//用户备注
public User(Integer userId, String unmae, String upwd, String remark) {
super();
this.userId = userId;
this.unmae = unmae;
this.upwd = upwd;
this.remark = remark;
}
public User() {
super();
// TODO Auto-generated constructor stub
}
public Integer getUserId() {
return userId;
}
public void setUserId(Integer userId) {
this.userId = userId;
}
public String getUnmae() {
return unmae;
}
public void setUnmae(String unmae) {
this.unmae = unmae;
}
public String getUpwd() {
return upwd;
}
public void setUpwd(String upwd) {
this.upwd = upwd;
}
public String getRemark() {
return remark;
}
public void setRemark(String remark) {
this.remark = remark;
}
@Override
public String toString() {
return "User [userId=" + userId + ", unmae=" + unmae + ", upwd=" + upwd + ", remark=" + remark + "]";
}
}
四.前台:用户登录
用ajax实现用户登录:
需求:用户名文本框,密码文本框,登录按钮
登录按钮绑定点击事件
1.得到用户输入的用户名和密码
2.判断是否为空
如果为空,提示用户输入的内容不能为空
3.想后台发送ajax请求,得到后台的响应数据
$.ajax({
type:“post”,
url:“login”,
data:{
‘uname’:用户名,
‘upwd’:密码
},
success:function(data){
//处理响应的结果
//code=1,表示登录成功;code=0,表示登录失败
}
});
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户登录</title>
<!-- 引入bootstrap的css文件 -->
<link type="text/css" rel="stylesheet" href="statics/bootstrap/bootstrap.min.css">
<!-- 引入jquery的核心文件 -->
<script type="text/javascript" src="statics/js/jquery-3.3.0.min.js"></script>
<!-- 引入bootstrap的js文件 -->
<script type="text/javascript" src="statics/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4 col-md-push-4">
<div class="form-group">
<label for="uname">名称</label>
<input type="text" class="form-control" id="uname" placeholder="请输入名称">
</div>
<div class="form-group">
<label for="upwd">密码</label>
<input type="password" class="form-control" id="upwd" placeholder="请输入密码">
</div>
<button type="button" class="btn btn-default" onclick="checkForm()">提交</button>
<span style="font-size:12px;color:red" id="msg"></span>
</div>
</div>
</div>
</body>
<script type="text/javascript">
//绑定点击事件的函数
function checkForm(){
//得到名称和密码
var uname=$("#uname").val();
var upwd=$("#upwd").val();
//判断用户名和密码是否为空
if(isEmpty(uname)||isEmpty(upwd)){
$("#msg").html("名称或密码不能为空!");
return;
}
//不为空时清除<span>中的提示信息msg
$("#msg").html("");
//用ajax发送请求
$.ajax({
type:"post",
url:"login",
data:{
'uname':uname,
'upwd':upwd
},
success:function(data){
console.log(data);
if(data.code==1){ //code=1登录成功
//跳转到的页面
window.location.href="goto.html";
}else{
$("#msg").html(data.msg); //通过id=msg获取<span>标签,来显示提示信息
}
}
});
}
//再在外面定义一个判断输入字符串是否为空的函数
function isEmpty(str){
if(str==null||str.trim()==""){
return true;//为空或者为null则返回true
}
return false;
}
</script>
</html>
后台的实现思路:
1.接收前台传递的参数 uname,upwd
2.判断uname,upwd是否为空
如果为空,返回0,return
3.通过用户名查询用户记录是否存在(执行的是查询操作),返回的是user的对象
4.判断user对象是否为空
如果为空,返回0,return
5.如果user对象不为空,将数据库查询到的用户密码与前台传递来的密码比较
如果密码不相同,返回0,return,登录失败
如果相同,返回1,登录成功
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 获取前台传递的指定名称参数 getParameter(String name)
//1、如果前台是ajax提交数据,则name代表的是参数的key值
//2、如果前台是表单提交,则name代表的是表单元素的name属性值
// 所有的请求数据都需要通过request对象获取;响应数据需要使用response对象,响应数据需要通过response得到响应刘,输出数据
String userName=request.getParameter("uname");
String userPwd=request.getParameter("upwd");
//设置响应类型及编码
response.setContentType("application/json;charset=UTF-8");
//2.判断用户名和密码是否为空
if(StringEmpty.isEmpty(userName)||StringEmpty.isEmpty(userPwd)){
//如果为空,返回0,return
response.getWriter().write("{\"code\":0,\"msg\":\"用户名或密码不能为空\"}");// 不能直接输出数字0
return;
}
//3.通过用户名查询用户记录是否存在(查询操作),返回user对象---这一步需要jdbc操作
//ToDO
User user=findUserByUname(userName);
//4.判断user对象是否为空(如果查到记录,user对象一定会有值;否则为空)
if(user==null){
//如果为空,则返回0,return
response.getWriter().write("{\"code\":0,\"msg\":\"用户不存在!\"}");// 不能直接输出数字0
return;
}
//5.如果对象不为空,将数据库中查询得到的密码与前台传来的密码做比较
if(!userPwd.equals(user.getUpwd())){ //user.getUpwd()---前台传递的密码 userPwd--数据库中获取的密码
// 如果不正确,返回0,return
response.getWriter().write("{\"code\":0,\"msg\":\"密码不正确!\"}"); // 不能直接输出数字0
return;
}
// 6、如果正确,登录成功,返回1
response.getWriter().write("{\"code\":1,\"msg\":\"登录成功!\"}");
}
6.jdbc操作:
1.得到数据的连接
2.准备sql语句
3.准备预处理块preparedStatement预编译sql语句
4.设置参数,下标从1开始
5.执行查询,返回resultSet的结果集
6.判断并分析结果集
如果存在,则从resultSet中取到数据,设置到user对象中
public User findUserByUname(String uname){
User user=null;
Connection connection=null;
PreparedStatement preparedStatement=null;
ResultSet resultSet=null;
try {
//1.获取连接
connection=DBUtil.getConnection();
//2.准备sql语句
String sql="select * from tb_user where uname=?";
//3.准备预处理块,预编译sql语句
preparedStatement=connection.prepareStatement(sql);
//4.设置参数,下标从1开始
preparedStatement.setString(1, uname);
//5.执行查询,返回resultset结果集
resultSet=preparedStatement.executeQuery();
//6.判断结果并分析结果
//如果存在,则从resultSet结果集中取到数据,设置到user对象中
if(resultSet.next()){
user=new User();
user.setUserId(resultSet.getInt("userId"));
user.setUnmae(resultSet.getString("uname"));
user.setUpwd(resultSet.getString("upwd"));
user.setRemark(resultSet.getString("remark"));
}
} catch (Exception e) {
e.printStackTrace();
}finally {
//关闭资源
DBUtil.close(resultSet, preparedStatement, connection);
}
return user;
}
}
7.关闭资源(封装一下)
package com.shshxt.util;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.Properties;
/**
* 数据库工具类
* 1、连接数据库
* 2、关闭资源
* @author XLL
*
*/
public class DBUtil {
public static void main(String[] args) {
System.out.println(getConnection());
}
public static Connection getConnection(){
//给获取连接默认值为null
Connection connection = null;
try {
//加载配置文件
InputStream in=DBUtil.class.getClassLoader().getResourceAsStream("db.properties");
//得到配置的对象
Properties properties=new Properties();
//将流对象中的数据加载到配置文件中
properties.load(in);
//通过properties对象的getProperty()方法得到指定的属性的值
String jdbcName=properties.getProperty("jdbcName");
String dbName=properties.getProperty("dbName");
String dbPwd=properties.getProperty("dbPwd");
String dbUrl=properties.getProperty("dbUrl");
//加载驱动
Class.forName(jdbcName);//获得class源头
//得到数据库的连接
connection= DriverManager.getConnection(dbUrl, dbName, dbPwd);
} catch (Exception e) {
e.printStackTrace();
}
return connection;
}
/**
* 关闭资源
* @param resultSet
* @param preparedStatement
* @param connection
*/
public static void close(ResultSet resultSet,PreparedStatement preparedStatement,Connection connection) {
try {
if(resultSet!=null){
resultSet.close();
}
if(preparedStatement!=null){
preparedStatement.close();
}
if(connection!=null){
connection.close();
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
8.返回user对象