初试Web登录界面
web项目中有形形色色的标签，现在流行的Web项目一般都是HTML+CSS+JSP，来完整的写出一个功能完善，外形美观的Web网页。
周一进行了Web简单登录网站的测验。下面来写一下我的网站是怎么写的。
首先，新建一个工程Dynamic Web。然后缕一下思路，首先，这个网页需要一个连接数据库的程序，需要一个登录界面，需要一个信息核对程序，需要一个登录成功后的界面。然后，开始写程序。
在Java Resources 的src里面新建一个Bean包，然后里面建一个类DBean，在Dean里面要写的就是连接数据库的程序。我是用这种方法来连接数据库的。下面是我的代码：
package bean;
import java.sql.*;
public class DBean {
private String driverStr = "com.microsoft.sqlserver.jdbc.SQLServerDriver";
private String connStr = "jdbc:sqlserver://localhost:1433; DatabaseName=Test";
private String dbusername = "sa";
private String dbpassword = "123456";
private Connection conn = null;
private Statement stmt = null;
public DBean()
{
try
{
Class.forName(driverStr); //加载数据库驱动
conn = DriverManager.getConnection(connStr, dbusername, dbpassword);//连接数据库
stmt = conn.createStatement(); //实例化Statement对象（为了执行不带参数的简单SQL语句）
}
catch (Exception ex) {
System.out.println("无法同数据库建立连接！");
}
}
public int executeUpdate(String s) { //更新表 ，SQL语句
int result = 0;
try {
result = stmt.executeUpdate(s);
} catch (Exception ex) {
System.out.println("执行更新错误！");
System.out.println(s);
}
return result;
}
public ResultSet executeQuery(String s) { //SQL查询
ResultSet rs = null;
try {
rs = stmt.executeQuery(s);
} catch (Exception ex) {
System.out.println( "执行查询错误！");
System.out.println(s);
}
return rs;
}
public void execQuery(String s){ //SQL更改
try {
stmt.executeUpdate(s);
} catch (SQLException e) {
// TODO Auto-generated catch block
System.out.println("执行插入错误");
System.out.println(s);
}
}
public void close() { //关闭连接
try {
stmt.close();
conn.close();
} catch (Exception e) {
}
}
}
通过jdbc方法来连接数据库的。程序中，有连接数据库的函数来进行加载数据库驱动，进行数据库的连接，并且实例化有一个Statement对象。然后还有数据库更新查询函数，用来下面运行SQL更新，查询语句。这个连接数据库的程序就写好了。
然后要进行登录界面，核对界面，登陆成功界面的编写，在WebContent里面新建了三个jsp文件夹
下面是我的程序：
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>登录界面</title>
<script type="text/javascript">
function checkIP() {
//js表单验证方法
var text1=document.getElementById("username").value;//通过id获取需要验证的表单元素的值，返回username的值
var text2=document.getElementById("password").value;//通过id获取需要验证的表单元素的值，返回password的值
if(text1=="")
{//当上面获取的值为空时
alert("用户名不能为空！");//弹出提示
return false;//返回false（不提交表单）
}
if(text2=="")
{//当上面获取的值为空时
alert("密码不能为空！");//弹出提示
return false;//返回false（不提交表单）
}
return true;//提交表单
}
</script>
</head>
<body class="body_one" background="D:/网页图片/hehua.jpg">
<div id="all">
<div id="input">
<center>
<form id="indexform" name="indexForm" action="LoginCheck.jsp" method="post" onsubmit="return checkIP();">
<table border="0" align="center" cellspacing=0 padding:0 >
<tr>
<td>账 户：</td>
<td><input type="text" id="username" name="username"class="textIn_one"></td>
</tr>
<tr><td rowspan="2"> </td></tr>
<tr>
<td> </td>
</tr>
<tr>
<td>密 码：</td>
<td><input type="password" id="password" name="password" class="textIn_one" ></td>
</tr>
<tr><td rowspan="2"> </td></tr>
<tr>
<td> </td>
</tr>
</table>
<table >
<br>
<tr>
<td><div class="button_1">
<input type="submit" value="登录" onclick="checkIP()"style="color:#000;width:120px;height:40px;font-size: 25px;">
</div><div class="button_2">
<input type="reset" value="重置"style="color:#000;width:120px;height:40px;font-size: 25px;">
</div></td>
</tr>
</form>
</table>
</center>
</div>
<p class="Copyright" align="center">Copyright © 2016.Company name All rights reserved.</p>
</div>
</body>
</html>
首先，是有function定义的一个函数来判断是否输入了 账号或者密码，如果没有输入用alter警示语来显示警示框。然后下面是用HTML语言写的一个登录界面，有账号登录和密码登录，有登录按钮和重置按钮。在登录之后页面跳转到了登录核对程序来进行程序核对。
下面是我的程序核对程序：
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@page import="java.sql.*" %>
<%@page import="java.io.PrintWriter" %>
<%@page import="java.io.IOException" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>登录中...</title>
</head>
<body>
<jsp:useBean id="db" class="bean.DBean" scope="page" />
<% //凭借db来 调用bean.DBean程序
request.setCharacterEncoding("UTF-8"); //读取请求数据时所使用的字符编码为UTF-8
String password=(String)request.getParameter("password");//获取文本里面输入的密码
String username=(String)request.getParameter("username");//获取从文本里面输入的账号
session.setAttribute("password",password); //把从文本里面获取的面值，保存在变量password中
session.setAttribute("username",username);
String sql="select * from Test.dbo.userTable where username="+"'"+username+"'";//SQL查询语句，查询username
ResultSet rs=db.executeQuery(sql);//执行SQL语句
if(rs.next()) //查询下一个数据，即password
{
if(password.equals(rs.getObject("password"))) //从数据库中调用密码
{
session.setAttribute("LoginID",username);//将账号保存到LoginID中，方便以后调用
response.sendRedirect("Main.jsp"); // 调到主函数页面
}
else
{
out.print("<script language='javaScript'> alert('密码输入错误，请重新输入！');</script>");//密码不对，提示重新输入
response.setHeader("refresh", "1;url=Login.jsp");//刷新页面，转到登录输入页面进行重新输入
}
}
else{
out.print("<script language='javaScript'> alert('账号输入有误，请重新输入！');</script>");//账号不对提示重新输入
response.sendRedirect("Login.jsp");//调到输入页面
}
rs.close();//关闭数据库调用
db.close(); //停止java文件的调用
%>
</body>
</html>
此界面先引用了连接数据库的程序来连接数据库，然后又定义了账号密码变量，通过request.getParament方法来获页面中输入账号和密码的数据，并赋值给这两个变量。下面再通过SQL查询语句从数据库中调取账号密码数据，来进行if语句的核对，核对成功之后跳转到登录成功界面的程序，登录失败之后跳转到登录程序。以上就是这个程序的大概。登录成功的网页比较简单，具体程序如下：
<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<%
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 'Main.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>
Welcom,<%=session.getAttribute("username") %><br>
</body>
</html>
