登陆界面的简单制作：
首先说一下制作的大概流程
1.在SQLyog（图形化操作数据库的软件）中建立一个连接，然后建立表，并设立主键和其他属性。
2.将表建立好之后，进行数据库的链接。
3.写出基本的增删改查方法。
4.建立所需要的登录，注册界面。
下面是详细过程和代码：
1>
1.建立一个了名称为“student”，用户名为“root”，密码为“linlin”的链接。
2.创建一个名为“user”的数据库，并建立一个名称为“user”的表。
2>
1.创建一个名称为“Success”的“Web Servic Project”类型的工程。
2.建立一个名称为“model”的包，并在其中建立名称为“User”的类，声明属性及其get，set方法。代码如下：
package model;
public class User {
private int tel;
private String password;
private int ide;
public int getTel() {
return tel;
}
public void setTel(int tel) {
this.tel = tel;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public int getIde() {
return ide;
}
public void setIde(int ide) {
this.ide = ide;
}
}
3.进行对数据库进行连接的方法的构建：建立一个名称为“db”的包，并在其中建立一个名称为“DBO”的类，在其中写入建立连接的方法。代码如下：
package db;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
public class DBO {
private final static String driver = "com.mysql.jdbc.Driver";
private final static String url = "jdbc:mysql://localhost:3306/user";
//first
static{
try {
Class.forName(driver);
} catch (ClassNotFoundException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
//second
public static Connection getConnection(){
Connection conn = null;
try {
conn = DriverManager.getConnection(url,"root","linlin");
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return conn;
}
//third
public static void close(ResultSet rs, Statement st, Connection conn)
{
try
{
if(rs != null)
{
rs.close();
}
if(st != null)
{
st.close();
}
if(conn != null)
{
conn.close();
}
}catch(Exception ex)
{
ex.printStackTrace();
}
}
public static void close(Statement st, Connection conn)
{
close(null,st,conn);
}
}
4.进行所需方法的接口的创建：建立一个名称为“jiekou”的包，并在其中建立一个名称为“UserManager”的接口，注意不是类，而是接口，所以不能选“class”，而应该选用“interface”，然后在创建一个实现“UserManager”接口的名称为“UserManagerImplement”的类，并在其中写入“UserManager”中方法的实现。代码如下：
“UserManager”：
package jiekou;
import java.util.List;
import model.User;
public interface UserManager {
//添加注册
public boolean add(User u);
//检验用户名及密码是否正确
public boolean checkout(int tel, String password);
//删除用户
public boolean del(int tel);
//更新用户数据
public boolean update(User u);
//查找用户
public User getUserByTel(int tel);
//获得用户表
public List<User> getUsers();
}
“UserManagerImplement”：
package jiekou;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;
import db.DBO;
import model.User;
public class UserManagerImplement implements UserManager {
//添加注册
public boolean add(User u) {
// TODO Auto-generated method stub
boolean flag = false;
Connection conn = null;
PreparedStatement pst = null;
conn = DBO.getConnection();
String sql = "insert into user(tel,password,ide) value(?,?,?)";
try {
pst = conn.prepareStatement(sql);
pst.setInt(1,u.getTel());
pst.setString(2,u.getPassword());
pst.setInt(3, u.getIde());
int rows = pst.executeUpdate();
if(rows > 0){
flag = true;
}
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return flag;
}
//检验用户名及密码是否正确
public boolean checkout(int tel, String password){
boolean flag = false;
Connection conn = null;
Statement st = null;
ResultSet rs = null;
conn = DBO.getConnection();
try {
st = (Statement) conn.createStatement();
String sql = "select * from user where tel = " + tel;
rs = (ResultSet) st.executeQuery(sql);
while(rs.next()){
if(rs.getString("password").equals(password)){
flag = true;
}
}
}
catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
finally{
DBO.close(rs, st, conn);
}
return flag;
}
//删除用户
public boolean del(int tel) {
// TODO Auto-generated method stub
boolean flag = false;
Connection conn = null;
PreparedStatement pst = null;
conn = DBO.getConnection();
String sql = "delete from user where tel = ?";
try {
pst = conn.prepareStatement(sql);
pst.setInt(1, tel);
int rows = pst.executeUpdate();
if(rows > 0){
flag = true;
}
}
catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
finally {
DBO.close(pst, conn);
}
return flag;
}
//更新用户数据
public boolean update(User u) {
// TODO Auto-generated method stub
boolean flag = false;
Connection conn = null;
PreparedStatement pst = null;
conn = DBO.getConnection();
String sql = "update user set password = ?, ide = ? where tel = ?";
try {
pst = conn.prepareStatement(sql);
pst.setString(1, u.getPassword());
pst.setInt(2, u.getIde());
pst.setInt(3, u.getTel());
int rows = pst.executeUpdate();
if (rows > 0){
flag = true;
}
}
catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
finally{
DBO.close(pst, conn);
}
return flag;
}
//查找用户
public User getUserByTel(int tel) {
// TODO Auto-generated method stub
User u = new User();
Connection conn = null;
Statement st = null;
ResultSet rs = null;
conn = DBO.getConnection();
String sql = "select * from user where tel = " + tel;
try {
st = conn.createStatement();
rs = st.executeQuery(sql);
if(rs.next()){
u.setTel(rs.getInt("tel"));
u.setPassword(rs.getString("password"));
u.setIde(rs.getInt("ide"));
}
}
catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
finally {
DBO.close(rs, st, conn);
}
return u;
}
//获得用户表
public List<User> getUsers() {
// TODO Auto-generated method stub
List<User> list = new ArrayList<User>();//建好对象
Connection conn = null;
Statement st = null;
ResultSet rs = null;
conn = DBO.getConnection();
String sql = "select * from user";
try {
st = conn.createStatement();
rs = st.executeQuery(sql);
while(rs.next()){
User u = new User();
u.setTel(rs.getInt("tel"));
u.setPassword(rs.getString("password"));
u.setIde(rs.getInt("ide"));
list.add(u);
}
}
catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
finally {
DBO.close(rs, st, conn);
}
return list;
}
}
5.编写测试程序，对所写方法进行测试。分别对上述所写的
//添加注册
public boolean add(User u);
//检验用户名及密码是否正确
public boolean checkout(int tel, String password);
//删除用户
public boolean del(int tel);
//更新用户数据
public boolean update(User u);
//查找用户
public User getUserByTel(int tel);
//获得用户表
public List<User> getUsers();
这些方法进行测试。因为共有五个方法，为了看起来更加明了，让初学者更明白，所以创建了五个不同的类，分别对它们进行测试程序的编写。
1>创建一个名称为“ceshi”的包，并在其中创建一个名称为“TestAdd”的类对 add(User u)方法进行测试代码如下：
package ceshi;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.SQLException;
import model.User;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
import db.DBO;
public class TestAdd {
public static void main(String[] args) {
Connection conn = DBO.getConnection();
if(conn != null){
System.out.println("数据库连接成功");
String sql = "insert into user(tel,password,ide) values(?,?,?)";
PreparedStatement pst;
try {
pst = conn.prepareStatement(sql);
pst.setInt(1, 666);
pst.setString(2, "abd");
pst.setInt(3,666);
int rows = pst.executeUpdate();
if(rows > 0){
System.out.println("添加数据完成");
}
else{
System.out.println("添加数据失败");
}
}
catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
else{
System.out.println("数据库连接失败");
}
UserManager um = new UserManagerImplement();
for(int i = 40;i < 50;i++){
User u = new User();
u.setTel(i);
u.setPassword("pwd" + i);
u.setIde(i);
boolean flag = um.add(u);
System.out.println("添加数据完成");
}
}
}
2>创建一个名称为“TestDelete”的类对del(int tel)方法进行测试。代码如下：
package ceshi;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
public class TestDelete {
public static void main(String[] args) {
// TODO Auto-generated method stub
UserManager u = new UserManagerImplement();
boolean flag = u.del(40);
if(flag == true){
System.out.println("删除成功");
}
else{
System.out.println("删除失败");
}
}
3>创建一个名称为“TestUpdate”的类对update(User u)方法进行测试。代码如下：
package ceshi;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
import model.User;
public class TestUpdate {
public static void main(String[] args) {
// TODO Auto-generated method stub
UserManager suc = new UserManagerImplement();
User u = suc.getUserByTel(6);
u.setPassword("23456");
u.setIde(436);
boolean flag = suc.update(u);
if(flag){
System.out.println("数据更新成功");
}else{
System.out.println("数据更新失败");
}
}
}
4.>创建一个名称为“TestGetUser”的类对getUserByTel()方法进行测试。代码如下：
package ceshi;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
import model.User;
public class TestGetUser {
public static void main(String[] args) {
// TODO Auto-generated method stub
UserManager suc = new UserManagerImplement();
User u = suc.getUserByTel(6);
if(u.getTel() == 6){
System.out.println("成功找到用户");
System.out.println("TEL:" + u.getTel());
System.out.println("密码:" + u.getPassword());
System.out.println("验证码：" + u.getIde());
}
else{
System.out.println("寻找用户失败");
}
}
}
5.>创建一个名称为“TestGetList”的类对 getUsers()方法进行测试。代码如下：
package ceshi;
import java.util.List;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
import model.User;
public class TestGetList {
public static void main(String[] args) {
// TODO Auto-generated method stub
UserManager suc = new UserManagerImplement();
List<User> list = suc.getUsers();
for(User u : list){
System.out.println("TEL: " + u.getTel() + " 密码:" + u.getPassword() + " 验证码：" + u.getIde());
}
}
}
6.下面进行前台页面与后台数据库交流的程序编写。
所需要的共分为三种页面：1.登录页面；2.注册页面；3.所查看内容页面。
后台需要将前台注册页面的内容写入到数据库，所以需要建立Servlet。
编写一个名称为“kongzhi”的类，并在其中建立名为“add”的Servlet，将前台数据写入到后台数据库。代码如下：
package kongzhi;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import model.User;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
public class add extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost( request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
int tel = Integer.parseInt(request.getParameter("tel"));
String password = request.getParameter("password");
//int ide = Integer.parseInt(request.getParameter("ide"));
//chuang jian dui xiang
UserManager um = new UserManagerImplement();
User u = new User();
//jin ru shu ju kong zhi liu
u.setTel(tel);
u.setPassword(password);
// u.setIde(ide);
boolean flag;
flag=um.add(u);
if(flag==true){
response.sendRedirect("denglu.jsp");
}
}
}
“add”的功能就是就是将数据写到后台，并且从这个页面跳转到"denglu.jsp"登录页面。
而在登录页面还需要有这样的一个方法，它能够判断输入的用户名，密码以及验证码是否正确，如果正确，则页面跳转到所需要查看页面，否则给出提示信息。所以同样在“kongzhi”包下，建立一个名为“thesec”的Servlet。代码如下：
package kongzhi;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import jiekou.UserManager;
import jiekou.UserManagerImplement;
public class thesec extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request,response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//jie jue zhong wen lun ma
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
//liang ge lie ming can shu de ding yi
int tel = Integer.parseInt(request.getParameter("tel"));//yong hu ming
String password = request.getParameter("password"); //mi ma
String diannao = (String) request.getSession().getAttribute("diannao");//dian nao yan zheng ma
String ren = request.getParameter("ren");//ren de yan zheng ma
//can shu ding yi
UserManager um=new UserManagerImplement();
boolean flag;
//jian ce shi fou zheng que ,bing taio zhuan dao xiang ying ye mian
flag=um.checkout(tel,password);
if(flag == true && diannao.equalsIgnoreCase(ren)){
response.sendRedirect("index.jsp");
}
else{
response.setContentType("text/html");
PrintWriter out = response.getWriter();
out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");
out.println("<HTML>");
out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");
out.println(" <BODY>");
out.println("<h1>");
out.println("用户名或密码错误登录失败！！");
out.println("<h1>");
out.println(" </BODY>");
out.println("</HTML>");
out.flush();
out.close();
}
}
}
然后，登录界面还需要动态随机生成验证码，所以就建立一个名为“ImageServlet”的“Servlet”来生成验证码图片。代码如下：
package kongzhi;
import java.awt.Color;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.Random;
import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.awt.Font;
public class ImageServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
/**
* BufferedImage(int width, int height, int imageType)
构造一个类型为预定义图像类型之一的 BufferedImage。
1、定义BufferedImage图片缓冲区对象
*/
BufferedImage bi = new BufferedImage(70,40,BufferedImage.TYPE_INT_RGB);
/**
* getGraphics()
此方法返回 Graphics2D，但此处是出于向后兼容性的考虑。
2、得到画笔工具
*/
Graphics g = bi.getGraphics();
/**Color(int r, int g, int b)
创建具有指定红色、绿色和蓝色值的不透明的 sRGB 颜色，这些值都在 (0 - 255) 的范围内。
3、得到画笔工具，并设置画板的背景颜色及大小
*/
Color c = new Color(1,1,1);
g.setColor(c);
/**fillRect(int x, int y, int width, int height)
填充指定的矩形。*/
g.fillRect(0, 0, 73, 20);
/**
* 设置验证码
*/
char ch[] = "abcdefghigklmnopqrstuvwxyz0123456789".toCharArray();
Random r = new Random();
StringBuffer sb = new StringBuffer();
for(int i = 0; i < 4;i++){
int in = r.nextInt(ch.length);
//设置字体大小
Font f = new Font("宋体",Font.BOLD ,20); //把字体对象放到这new
g.setFont(f);
//为四个随机数设置随机的颜色
g.setColor(new Color(r.nextInt(255),r.nextInt(255),r.nextInt(255)));
/**
* drawString(String str, int x, int y)
使用此图形上下文的当前字体和颜色绘制由指定 string 给定的文本。
*/
g.drawString(ch[in]+"",i*15+3,18);
sb.append(ch[in]);
}
request.getSession().setAttribute("diannao", sb.toString()); //将生成的字符串保存到session中
/**
* write(RenderedImage im, String formatName, OutputStream output)
使用支持给定格式的任意 ImageWriter 将一个图像写入 OutputStream。
*/
ImageIO.write(bi, "JPG", response.getOutputStream());
}
}
有了验证码图片，还需要有一个能够判断所输入验证码与给出验证码是否相同的方法。所以就建立一个名为“YanZhengMa”的Servlet。代码如下：
package kongzhi;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class YanZhengMa extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost( request,response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//luan ma
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
//1、获取页面验证码
String ren = request.getParameter("ren");
//2、获取session保存的验证码
String diannao = (String) request.getSession().getAttribute("diannao");
PrintWriter out = response.getWriter();
//3、比较验证码
if(ren.equalsIgnoreCase(diannao)){
out.print("正确");
}else{
out.print("错误");
}
}
}；
7.后台做完了，下面就开始前台jsp页面的设计了。前台页面共分为三种：1.登录页面；2.注册页面；3.所要访问的页面。在工程“Sueecss”中，“WebRoot”下的“WEB-INF”下分别建立“denglu.jsp”，“zhuce.jsp”，“index.jsp”分别为登录界面，注册界面以及所需访问的界面。
登录界面代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'denglu.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript">
function reLoadCode(){
var t = new Date().getTime();
//设置唯一的时间，防止IE缓存。
document.getElementById("imageCode").src="ImageServlet?t="+t;
}
</script>
<style type="text/css">
<!--
.body{padding-left:630px;padding-top: 100px;}
-->
</style>
</head>
<body>
<form action="thesec" method="post" >
<center><h1>登录界面</h1></center>
<div class="body">
<table>
<tr><td>用户名：</td> <td><input type="text" name="tel"> </td><td> </td></tr>
<tr><td>好密码：</td> <td><input type="password" name="password"></td><td> </td></tr>
<tr><td>验证码：</td> <td><input type="text" name="ren"/></td>
<td> <img src="ImageServlet" id="imageCode" alt="验证码" title="验证码"> </td>
<td> <a href="javaScript:reLoadCode()">看不清</a></td>
<td> </td></tr>
<tr>
<td></td>
<td><input name="submit" type="submit" class="button" style="width:150px; height:30px " value="登录" /></td>
</tr>
<tr>
<td></td>
<td><font size="+1" color="#000099">
<a href="zhuce.jsp">注册新用户</a>
</td></font>
</tr>
</table>
</div>
</form>
</body>
</html>
登陆界面效果图：
注册界面代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'zhuce.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<style type="text/css">
<!--
.body{padding-left: 630px;padding-top: 100px;}
-->
</style>
</head>
<body>
<form action = "add" method = "post">
<center><h1>新用户注册</h1></center>
<div class="body">
<table>
<tr><td>用户名:</td><td><input name="tel" type="text" value=""/></td></tr>
<tr><td>密码:</td><td><input name="password" type="password" value=""/></td></tr>
<tr><td></td><td><input type="submit" style="width:160px; height:30px "value="注册" /></td></tr>
</table>
</div> <br>
</form>
</body>
</html>
注册界面效果图如下：
所需访问的界面代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<h1>恭喜成功</h1>
</body>
</html>
这就是制作登录界面的所有过程了，虽然制作有点粗糙，但是过程很详细，希望对有些朋友有用，也是记录自我成长的一步。
177
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
