用jsp實現網站登錄界面的制作,並連接數據庫


            課堂測試

任務需求:

撰寫一篇博客

需要網站系統開發需要掌握的技術;

本次課堂測試的源程序代碼;

運行結果截圖;

說明課堂測試未按時完成的原因。

列出你對這門課的希望和自己的目標,並具體列出你計划每周花多少時間在這門課上。

 

 

這里介紹一下怎樣連接數據庫,並用jsp制作一個簡單的登錄界面

1.首先需要搭建好環境,有Tomcat,eslipse,jdk等,並配置好環境變量,並安裝好數據庫,這里我使用的數據庫是mysql數據庫,並下載了一個MySQL的圖形界面的軟件,當上面的准備工作完成后就可以開始做了。

2.(1)首先應該連接好數據庫

這是數據庫的圖形顯示界面,

 (2)打開后首先創建一個mysql新連接。

 

(3)然后在這個界面設置好這個連接點的名字,還有密碼,密碼需要記住,在以后打開mysql后連接數據庫的的時候需要輸入,其他的內容不需要修改,完成后點擊確定即可。

 

(4)在這個連接點的wzw1下新建一個表

 

(5)新建表以后需要在表格中填入信息,因為我們用到的是用戶的用戶名和密碼,所以建立user和password

 

(6)點擊添加字段

 

 

(7)添加字段以后然后繼續填入信息

 

(8)然后點擊保存,在彈出的界面中輸入表的名字

 

(9)我新建的表名是wzw2,打開然后看到這個界面,說明,建表成功

 

這樣,你就完成了mysql的對於建立登陸界面的初級設置。

3,接下來,打開eslipse,新建一個這樣的工程

 

會出現如下界面

 

第一次打開需要配置好tomcat

 

然后輸入工程名,點擊finish即可

4.建立好工程后,從你的mysql-connector-java下找到下圖所示的文件,將他復制下來

 

打開創建的工程,在文件名為WebContent下的WEB—INF下的lib文件下,粘貼復制的內容,這樣就可以把mysql和這個工程相連接,如下圖所示

 

這樣就連接成功了

 

5.然后可以新建一個jsp文件

 

輸入自己想命名的文件名,點擊finish

 

打開jsp文件會出現如下界面,需要將charset=ISO-8859-1改為charset=utf-8

 

寫jsp文件需要了解一些html的編寫語法,下面是我的代碼

 

 

 

<%@ 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>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 

 

<script>

    function $(id) {

        return document.getElementById(id);    //這個是返回一個id格式命名的對象,比如說下面的用戶名標簽里面的id是“user”,那么返回的就是user這個對象,

        //返回的對象可以留給下面的check()方法使用

    }

    function check(){//check()方法是用來判斷是否跳轉到下一個jsp界面。

        var user=$("user").value;

        var psd=$("psd").value;//用user和psd獲取對象的信息

        $("userinfo").innerHTML="";

        $("psdinfo").innerHTML="";//用userinfo和psdinfo來書寫提示內容,例如沒有輸入用戶名這個提示信息,沒有輸入密碼等,

        if(user=="")//如果用戶名為空,將userinfo的內容賦為如下內容,即可以顯示提示信息

            {

                $("userinfo").innerHTML="用戶名不能為空";

                $("user").focus();

                return false;//這時候不能跳轉頁面,所以返回為false

            }

        if(psd=="")

            {

                $("psdinfo").innerHTML="密碼不能為空";//同上

                $("psd").focus();

                return false;

            }

        return true;

    }

    //script之中寫的是Java的內容,下面的是

</script>

 

 

 

<title>登錄</title>

</head>

<body background=file:///E:/工作目錄/myJavaweb/1.jpg>

 

    <center>

    <form action ="loginResultre.jsp" method="post" onsubmit="return check()">//這個標簽是用來引用下一個jsp文件,引用方式是通過看check(),如果是true就進入下一個界面,否則就停在這個界面。

    <table>

    <tr><td>用戶名</td><td><input name="userName" id="user"><span id="userinfo"></span></td></tr>

    <tr><td>密碼</td><td><input type="password"name="userword" id="psd"><span id="psdinfo"></span></td></tr>

    <tr><td><input type="submit" value="登錄"></td></tr>

    </table>

    </form>

    </center>

</body>

</html>

 

 

 

<%@ page language="java" import="java.sql.*" 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>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>登錄結果</title>

</head>

<body>

    <%//這個《%是用來編譯Java內容

        Connection conn = null;

        PreparedStatement pstmt = null;

        ResultSet rs = null;//定義好鏈接,執行,和結果

        String driverName = "com.mysql.jdbc.Driver";

        String userName = "root";//數據庫的名

        String userPwd = "199762";//數據庫密碼

        String dbName = "wzw1";//數據表的名字

        String url1 = "jdbc:mysql://localhost:3306/" + dbName;

        String url2 = "?user=" + userName + "&password=" + userPwd;

        String url3 = "&useUnicode=true&characterEncoding=UTF-8";//規定好字符集

        String url = url1 + url2 + url3;//將上面三條的信息總起來

        request.setCharacterEncoding("UTF-8");//規定好字符集

        Class.forName(driverName);//連接數據庫

        conn = DriverManager.getConnection(url);//把信息傳過來

        String sql = "select * from wzw1 where user=? and password=?";//查詢的命令

        pstmt = conn.prepareStatement(sql);//執行

        String user = request.getParameter("userName");//獲取上一個頁面的信息

        String password = request.getParameter("userPwd");

        pstmt.setString(1, user);//對兩個內容進行處理

        pstmt.setString(2, password);

        rs = pstmt.executeQuery();//查詢

        if(rs.next()) {

            %><center><h1>用戶 <%=rs.getString("user")%>登陸成功!</h1></center>

        <%}

        else {

            %><center><h1>用戶名或密碼錯誤!</h1></center>

        <%}

        if(rs != null) {

            rs.close();

        }

        if(pstmt != null) {

            pstmt.close();

        }

        if(conn != null) {

            conn.close();//這里哪里出現問題了,就關掉那個變量

        }

    %>

</body>

</html>

結果截圖:

主頁:

 

登錄后的結果

 

如果輸入為空,則提示。

 

 

 

 

課堂測試未完成的原因:暑假里用的時間不夠多,沒有認真對待。

 

希望和目標:希望能利用Java技術實現網頁的動態設計,理解Java算法,完成老師交給的任務。

 

計划花在軟件工程上的時間:周一到周五:每天一小時,周六日:每天四個小時。

合計13小時。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM