ajax+jdbc+servlet实现简单的登录
这次主要是运用了ajax向服务器发请求,连接数据库进行查询,实现登录功能的,
用的是mysql数据库,在数据库中建了一个schools数据库,在这个数据库中建
了一个users表,包括三个字段,分别为uid,uname,pwd,创建完数据库记得
添加一条数据。下面详细说一下在eclispe中实现的代码。
1、 首先,在eclipse中搭建web项目,如图
2、开始写test.jsp页面,并且当你点击登录时,触发函数,发送ajax请求给服务器。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <link href="css/style.css" rel="stylesheet" type="text/css" > <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script> <title>欢迎你</title> </head> <body> <form action="" method="post"> <label>用户名:</label><input type="text" name="uname" id="uname" placeholder="请输入用户名"><br> <label>密 码:</label><input type="password" name="pwd" id="pwd" placeholder="请输入您的密码"><br> <input type="button" value="登录" οnclick="login()"> </form> <script> function login(){ //先获取表单中输入的用户名和密码 var uname=$("#uname").val(); var pwd=$("#pwd").val(); //发送ajax请求 $.post("usersServlet",{ //将uname和pwd传过去 uname:uname, pwd:pwd },function(data){ if(data>0){ alert("登录成功"); location.href="index.jsp"; }else{ alert("用户名或者密码错误"); location.href="test.jsp"; } },"text"); } </script> </body> </html>
3、创建一个index.jsp页面,当登录成功后,跳转此页面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>欢迎你</title> </head> <body> <% String uname=null; if(request.getSession().getAttribute("uname")!=null){ uname=request.getSession().getAttribute("uname")+""; } %> <p>欢迎您<%=uname %></p> </body> </html>
4、创建一个UserServlet.java,进行对前端传来的数据进行处理,
并且与数据库建立连接,查询数据库,将结果返回给前端页面
package com.login.web.servlet; import java.io.IOException; import java.io.PrintWriter; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; @WebServlet("/usersServlet") public class UserServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { } @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //首先设置编码集 req.setCharacterEncoding("utf-8"); resp.setCharacterEncoding("utf-8"); //获取输出PrintWriter对象 PrintWriter out=resp.getWriter(); //获取传过来用户名和密码 然后与数据库建立连接进行查询是否有此用户 String uname=req.getParameter("uname"); String pwd=req.getParameter("pwd"); Connection conn; Statement stmt; ResultSet rs; try { //第一步加载驱动 这里用到的是mysql数据库 Class.forName("com.mysql.jdbc.Driver"); //第二步建立连接 // 数据库名 用户名 密码 conn=DriverManager.getConnection("jdbc:mysql://localhost:3306/schools", "root", "a"); //第三步创建statement对象 stmt=conn.createStatement(); //第四步执行sql语句 一定记得加'' String sql="select * from users where uname='"+uname+"' and pwd='"+pwd+"' "; rs=stmt.executeQuery(sql); //判断数据库中是否存在这个用户 //如果登录成功 while(rs.next()){ if(rs.getString(1)!=null ||rs.getString(1).equals("")){ //用Session存下用户名 req.getSession().setAttribute("uname", uname); //返回前端页面结果 out.print(1); }else{ out.print(0); } } } catch (ClassNotFoundException e) { e.printStackTrace(); } catch (SQLException e) { e.printStackTrace(); } } }
5、最终效果如下