记录自己关于web做过的一些实践（登录以及数据库连接）

caciahen

于 2020-03-14 15:19:18 发布

阅读量184

点赞数 1

本文链接：https://blog.csdn.net/caciahen/article/details/104860261

版权

所有写的项目包括购物车，登录，聊天室，主界面跳转等功能

第一部分先写登录以及连接数据库的内容

这一部分是聊天室的登录界面，右上角我设置了时钟的时间提醒，设置了页面的格式等内容。

表单里面包含了两个输入文本框，表单上增加了onsubmit，来实现上面的功能，判断输入的内容是否为空，提交之后，会把表单中两个文本框的内容传递给loginservlet，loginservlet是我实现判断用户名与密码是否在数据库里面的代码，是用java语言实现的，其次，我还设置了reset按钮，实现重写。

<html><SCRIPT LANGUAGE="JavaScript">
var strTime, strDate;
function webClock()
{
	var dNow = new Date();
	var dHours = dNow.getHours();
	var dMinutes = dNow.getMinutes();
	var dSeconds = dNow.getSeconds();
	strTime = dHours;
	strTime += ((dMinutes<10) ? ":0" : ":") + dMinutes;
	strTime += ((dSeconds<10) ? ":0" : ":") + dSeconds;
	clock.time.value = strTime;
	
	setTimeout("webClock()",1000);
}
    function Validator(theForm){
     if(theForm.username.value==""){
      alert("请输入用户名");
      theForm.username.focus();
      return(false);}
      else if (theForm.password.value==""){
       alert("请输入密码");
       theForm.password.focus();
       return(false);}
      else return(true);
    }
     function keyDown(){
      if(event.keyCode==13){
       if (event.scrElement.tagName.toLowerCase()=="textarea"){
        return false;}
       else if (event.scrElement.name.toLowerCase()=="password"){
        document.all.btnlogin.click();
        return false;}
      event.keyCode=9;
      return true; }
     }
     document.onkeydown=keydown;
     window.onload=function(){
      var oInput=document.getElementById("username");
      oInput.focus();
     }
</script>
<head>
<title>网页登录</title>
<style type="text/css">
<meta http-equiv="Content-Type"content="text/html;charset=UTF-8">
  body{margin-top:0px;margin-left:0px;}//上下左右边距
  .head{background-image:url(./bg.jpg);width:100%;height:130px;}
  body{margin:0px;text-align:center;background:#0fe;font-size:12px;}
  a:link,a:visited{text-decoration:none;}
  a:hover{}
/*页面层容器*/
  #container{width:750px;height:460px;margin:auto;padding-bottom:0px;padding-top:120px;
             background-image:url(./bg.jpg);background-repeat:no-repeat;}
  #right{float:right;width:400px;top:255px;left:576px;}
  #container #right form table tr td div .style3 .style3{color:#72CCF1;}
  #container #right form table tr td div .style3{color:#72CCF1;}
  .style3{width:141px;font-size:20px;vertical-align:middle;text-align:right;}
  .style4{height:88px;}
  .style5{width:141px;font-size:10px;vertical-align:middle;color:#72CCF1;}
  
<!--
  body{background-image:url(./image/4.jpg);}
-->
</style>
</head>
  <BODY ONLOAD="webClock()">
   <tr><td><FORM NAME="clock"><div style ="text-align:left">
		时间：<INPUT TYPE="TEXT" NAME="time" SIZE="10"><BR>
		</div>
	</FORM></tr>
 <div class ="head"></div>
 <div id="container">
 <div id="right">
 <form name="form1" method="post" action="LoginServlet" id="form1" onsubmit="return Validator(this)">
 <table width="104%" border="0" cellpadding="6" cellspacing="0">
 <tr><td colspan="2" align="center" class="style4" valign="top">
    <span id="LabTitle"style="color:#3333CC;font-family:宋体;font-size:20pt;">
                           欢乐聊天室</span><br /><br /><br /></td></tr>
    <tr><td><div style ="text-align:center">
     <span class ="style3">您的昵称：</span>
     <input class ="style5" style ="width:133px;"name="username"type="text" maxlength="14"
                    id="username"tabindex="1" /></div></td>
     <td rowspan="2"><div><input style ="height:39px;"type="submit"name="btnlogin"value="登录"
                    id="btnlogin"tabindex="3"/>&nbsp;<input style ="height:39px;"
                    type="Reset"name="btnreset"value="重写"
                    id="btnreset"tabindex="3" /></div></td></tr>
    <tr><td><div style ="text-align:center"><span class="style3">您的密码：</span>
      <input class ="style5" style="width:133px;"name="password" type="password"
                    maxlength="14" id="password" tabindex="2" /></div></td></tr>
 </table>
 </form><br /><br /><br /></div></div>
</BODY>
</html>

之后，我们要实现连接数据库的内容，我是使用的sql server数据库，mysql数据库的使用还在学习中

我们首先应该建立一个db类，里面是使你的软件与数据库连接的内容


	String driverName="com.microsoft.sqlserver.jdbc.SQLServerDriver";

	String dbURL="jdbc:sqlserver://localhost:1433;DatabaseName=shopcar";

	String userName="sa";

	String userPwd="123456";

	try {

		Class.forName(driverName);

		dbConn=DriverManager.getConnection(dbURL, userName, userPwd);

		System.out.println("Connection Successful!");

		

	}catch(Exception e) {

		System.out.println(e.getMessage());

	}

大致内容如上，上面包括drivername，url，username以及userpwd

drivername是有固定的内容的

以下是三种常见的数据库的drivername

Oracle：oracle.jdbc.driver.OracleDriver

Mysql：com.mysql.jdbc.Driver

Sql server：com.microsoft.jdbc.sqlserver.SQLServerDriver

这三个数据库url的格式如下

Oracle：jdbc:oracle:thin:(协议)@xxx.xxx.xxx.xxx:xxx（ip地址和端口号:xxx（数据库名字）
如：jdbc:oracle:thin:@localhost:1521:myDataBase
Mysql：jdbc:mysql://localhost:3306/数据库名
如：jdbc:mysql://127.0.0.1:3306/test
SqlServer：jdbc:microsoft:sqlserver://localhost:1433/数据库名

username以及userpwd是你自己在数据库中设置的登录用户名以及登录密码，连接成功之后，会显示connection successful!的字样，表示数据库已经连接成功。

Loginservlet中，可以写dopost或者是doget,我是使用的doget方法，使用dopost方法会自动跳转到doget方法中去，下面向大家展示的是doget方法

public void doGet(HttpServletRequest request,HttpServletResponse response)throws ServletException,IOException{
		PreparedStatement pst;
		request.setCharacterEncoding("utf-8");
		String username=request.getParameter("username");
		String password=request.getParameter("password");;
		HttpSession session =request.getSession();
		db con=new db();
		try {
			pst = con.PreparedStatement("select * from chatlog where name=? and password=?");
		pst.setString(1,username);
		pst.setString(2,password);
		ResultSet rs=pst.executeQuery();
		if(rs.next()){
	session.setAttribute("user", username);
	response.sendRedirect("chat.html");}
		else{
			response.sendRedirect("chatlogin.html");
		}
 } catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		}

在数据库里面，我设置的聊天室登录的数据库名称叫做chatlog，request.getParameter是接受来自表单的用户名以及密码的内容，然后连接数据库，在chatlog里面搜索是否有用户名和密码符合来自表单的用户名以及密码，我这个搜索的方法只是很多种方法中的一种

rs就是搜索结果的内容，如果搜索到了rs就不为空，如果不为空则实现下面的内容，session.setAttribbute("user",username)是将用户名装到session中，然后传递到chat.html中就是为了在聊天室中显示出发送一方的用户名，然后将页面跳转到chat.html页面中，开始聊天室的聊天

如果rs为空的话，就代表在数据库中没有用户名和密码与输入的用户名密码一致的用户，就将页面跳转到chatlogin.html页面中，再一次登录