如何建設網站並與數據庫相連(以access爲例)

        當我第一次做網頁的時候經歷了諸多坎坷,因爲網站的建設不同於普通編程語言的開發。比如java,你只需要安裝好jdk,再下載個eclipse等集成開發環境你就可以開始開發了。但是網站的開發涉及多種語言,使用多個軟件,因此剛開始接觸實在讓人撓頭。不過如果能夠做很好的梳理,那就沒有那麼困難了。

        適逢一個朋友問我有關網站連接access數據庫的問題,那我這裏就以access數據庫爲例,詳細講述一下網站的開發過程。當然,開發過程多種多樣,我在此處權作拋磚引玉吧。下面的過程描述我會盡量囉裏囉嗦一些,力求讓大家明白,諸位可不要被這麼長的篇幅嚇到喔,其實沒那麼困難。

        首先我們先縱觀全局,看一下開發網站需要哪些工作。

        上圖所示是網站建設中涉及的基本工作,下面我們梳理一下網站建設的流程

        (1)使用notepad++、dreamweaver等編寫網頁(高手可以直接用記事本喔,不過大量開發的時候感覺挺耽誤時間呢~)。網頁使用的語言包括靜態語言html,樣式表css,腳本語言javascript,動態語言jsp、php、asp等。一般jsp開發(即傳說中的j2ee)使用my eclipse集成開發環境,asp開發則使用微軟出品的Visual Studio。

        (2)完成網頁編寫後則架設服務器,將所編寫的網頁全部放在服務器軟件的對應文件夾中(如tomcat是webapps文件夾)。爲了能夠正常運行服務器軟件,有時還要做些配置或安裝。如使用tomcat服務器軟件的話就要先安裝java的jdk。

        (3)網頁中的數據一般存放在數據庫中。Jsp和php常用的是mysql數據庫,asp常用的是SQL Server數據庫,銀行等金融機構的重要數據一般放在oracle數據庫中。

        下面我們通過一個簡單的登錄界面示例來說明網站的開發過程。

(一)編寫網頁

        1 下載notepad++(http://notepad-plus-plus.org/download/v5.9.3.html)並安裝。


        安裝完成後打開notepad++,新建文件login.jsp,在編輯界面中輸入如下代碼:

<%@page contentType="text/html;charset=gb2312"%>

<html>

<head>

<title>測試access的登錄界面</title>

</head>

<body>

<form id="form1" name="form1" method="post" action="testdb.jsp">

       <div align="center">

              <label>用戶名</label>

              <input type="text" name="user" id="user" />

              <br />

              <label>密   碼</label>

              <input type="text" name="password" id="password" />

              <br />

              <br />

              <input type="submit" name="login" id="login" value="登錄" />

       </div>

</form>

</body>

</html>


        這裏多說一句,如果用eclipse或者my eclipse做開發,需要配置一下jdk的環境變量:

        (1)在桌面“我的電腦”(vista和win7中是“計算機”)圖標上右鍵,選擇“屬性”,再選擇“高級系統設置”,選中標籤“高級”,點擊下方的按鈕“環境變量”。


 

        (2)在“系統變量”的“Path”的內容後追加“C:\Program Files\Java\jdk1.6.0_27\bin”“C:\Program Files\Java\jre6\bin”(注意:這是我安裝jdk後的路徑所在,請大家對照着修改爲自己安裝的jdk和jre的bin文件夾的位置),各內容直接用英文的分號“;”隔開,點擊確定。


 

(二)架設服務器軟件

        1 首先安裝java的jdk(http://www.oracle.com/technetwork/java/javase/downloads/index.html

        雖然當前最新版是java 7,但是鑑於CSDN上對java 7的諸多不盡人意的評價,爲保險起見我們此處仍用java 6,java 7就留待以後探索吧。


 

        點擊jdk的下載,在新界面中首先選擇接受oracle的協議(accept),然後下載windows x86版的jdk,然後安裝之。


 

        2 下載tomcat服務器軟件(http://tomcat.apache.org/download-70.cgi


 

        上圖下載的是免安裝版的tomcat,需要做相應配置如下(該配置過程參考了網頁http://www.huomo.cn/sysapp/article-3582.html):

        (1)在tomcat的安裝目錄的bin文件夾下(C:\apache-tomcat-7.0.21\bin)分別找到startup.bat和shutdown.bat,右鍵用記事本打開它們,分別在兩個文件的最前面加上下面兩行內容:

        SET JAVA_HOME=C:\Program Files\Java\jdk1.6.0_27

        SET CATALINA_HOME=C:\apache-tomcat-7.0.21

        (說明:

                SET JAVA_HOME=JDK目錄

                SET CATALINA_HOME=前面解壓後Tomcat的目錄或者%cd%)

                這樣我們可以通過雙擊startup.bat運行服務器,雙擊shutdown.bat關閉服務器。

        (2)修改\conf\tomcat-users.xml文件:

        在<tomcat-users>標籤內加入

        <role rolename="manager"/>

        <role rolename="admin"/>

        <user username="admin" password="admin" roles="admin,manager"/>

        這樣纔可以使用Tomcat的管理界面。

        (3)將Tomcat加入服務

        a. 修改bin目錄中的service.bat文件:找到set CATALINA_HOME=%cd%,如果從來沒有安裝過Tomcat,或者保證Services.msc啓動服務管理器檢查沒有Apache Tomcat系統服務,到此你就可以轉到第二步了。否則,找到以下幾行:

        (a) set SERVICE_NAME=Tomcat5

        “Tomcat5”修改成你需要的服務名,這個將是以後使用net start/stop來操作的服務名稱。

        (b) set PR_DISPLAYNAME=Apache Tomcat

        “Apache Tomcat”改爲你需要的顯示服務名,這個將顯示在服務管理器中。

        (c) set PR_DESCRIPTION=Apache Tomcat Server -

        這一行改不改無所謂,是服務的描述,根據自己的喜好決定吧。

        b. 運行cmd打開控制檯,進入Tomat目錄/bin文件夾,輸入如下命令運行。

service.bat install

        程序提示:The service 'Tomcat5(或者你修改一後的SERVICE_NAME)' has been installed  說明服務Tomcat已經被安裝成功。

順便說一下,運行service.bat remove可以移除服務。

        c. 到這裏,服務添加成功,運行services.msc,可以看到添加的服務,默認狀態下該服務是手動運行的,在它的屬性中,將啓動類型更改爲“自動”,以後機器啓動以後Tomcat就在後臺啓動了。

        說明:就本示例而言,後面(2)(3)兩步可以不做。當然,如果嫌上述配置步驟太複雜,我們可以直接下載下圖所示的安裝版的tomcat:


 

        (4)我們隨便打開一個瀏覽器,在地址欄中輸入http://localhost:8080,如果可以看到tomcat的歡迎界面,則說明安裝配置成功。

        3. 在tomcat的webapps文件夾下新建文件夾testdb,將剛剛創建的login.html和testdb.jsp文件拷貝到其中。然後打開瀏覽器,在地址欄中輸入http://localhost:8080/testdb/login.jsp,我們可以看到登錄界面:


(三)建立數據庫

        1 打開2003版ACCESS,點擊“文件”->“新建”。屏幕右側出現一個新窗口,包括一些選項。選擇“空數據庫”,會彈出對話框,在對話框中爲數據庫命名爲testdb.mdb,點擊“創建”。


 

        2 在新彈出的編輯框中,點擊“使用設計器創建表”:


 

        在表中“字段名稱”處輸入user和password,“數據類型”均設爲“文本”,下方的“允許空字符串”處均設爲“否”。


 

        選中user,右鍵選擇“主鍵”,由此可將user字段設爲“主鍵”。


 

        點擊當前對話框右上方的×號,出現提示框“是否保存對錶1的設計的修改”,點擊“是”,在新彈出的對話框中將表名命名爲“userTable”。


 

        3 雙擊圖中的userTable,在表中輸入2條記錄,分別是“apple,123”和“banana,321”,代表用戶(user)apple的密碼(password)是123,用戶banana的密碼是321。


 

        這樣就成功建立了我們需要的示例數據庫。

(四)建立網頁與數據庫之間的連接

        數據庫中存入的是合法的用戶名及其對應密碼信息。現在我們將網站與數據庫建立連接。當我們點擊網頁中的“登錄”時,網頁login.html調用testdb.jsp,用輸入的用戶名對數據庫進行查詢,得到該用戶名對應的密碼,然後看該密碼是否與剛剛網頁輸入的密碼相匹配。如果匹配,則返回“登錄成功”的消息,否則返回“用戶名或密碼錯誤,登錄失敗”的消息。

        1 打開“開始”菜單中的“控制面板”,找到“管理工具”中的“數據源ODBC”。


 

        在“用戶DSN”標籤下點擊“添加”。


 

        選擇Microsoft Access Driver,點擊“完成”。


 

        在彈出的對話框中輸入數據源名testdbODBC,選擇剛剛建立完成的數據庫testdb。


 

        2 用notepad++新建文件testdb.jsp(同樣存放在webapps目錄下的testdb中),輸入如下代碼(參考了http://www.jb51.net/article/6742.htm

http://developer.51cto.com/art/200909/149734.htm兩個網頁):

<%@page contentType="text/html;charset=gb2312"%>

<%@page import="java.sql.*"%>

<html>

<body>

<%

       try{

              Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");

       }

       catch(ClassNotFoundException e){

              out.print(e);

       }

       try{

              String url = "jdbc:odbc:testdbODBC";

              String user = request.getParameter("user");

              out.print(user+",");

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

              Connection conn = DriverManager.getConnection(url,"testdbODBC","jsp.com.cn");

              Statement stmt = conn.createStatement();

              ResultSet rs = stmt.executeQuery("SELECT password FROM userTable WHERE user='"+user+"'");

              if(!rs.next())

                     out.print("抱歉,您的用戶名或密碼輸入錯誤,登錄失敗~");

              else{

                     if(rs.getString(1).equals(password))

                            out.print("恭喜您!登錄成功!");

                     else

                            out.print("抱歉,您的用戶名或密碼輸入錯誤,登錄失敗~");

              }

              rs.close();

              stmt.close();

              conn.close();

       }

       catch(Exception ex){

              out.print(ex);

       }

%>

</body>

</html>


        3 打開瀏覽器,在地址欄輸入http://localhost:8080/testdb/login.jsp,輸入用戶名apple和密碼123,點擊“登錄”,出現結果如下:


 

        輸入錯誤的用戶名app和密碼123(或者你也可以輸入其他錯誤的用戶名和密碼),點擊“登錄”,出現結果如下:


 

        好啦,至此已完成一個簡單的網頁與access數據庫的連接,大功告成!


        更多內容歡迎大家訪問我的個人博客:溫馨咖啡小屋http://warmcafe.info

發佈了35 篇原創文章 · 獲贊 14 · 訪問量 8萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章