【正文】 ............................ 31 圖 58 ss 的聊天頁(yè)面圖 ........................................................................................................... 32 圖 59 xia 的聊天頁(yè)面圖 ......................................................................................................... 32 基于 jQuery 的 Ajax 聊天室應(yīng)用 VI 表格清單 表 41 用戶信息表 .................................................................................................................. 21 表 42 聊天信息表 .................................................................................................................. 21 表 61 用戶登錄信息等價(jià)類劃分 .......................................................................................... 37 表 62 用戶登錄信息測(cè)試用例 .............................................................................................. 38 畢業(yè)設(shè)計(jì)（論文） 1 引 言 Inter 是目前世界上最大的 計(jì)算機(jī)互聯(lián)網(wǎng)絡(luò)，它遍布全球，將世界各地各種規(guī)模的網(wǎng)絡(luò)連接成一個(gè)整體。因而各種聊天服務(wù)備受用戶青睞，在這方面的開發(fā)與應(yīng)用也較多，聊天服務(wù)也成為互聯(lián)網(wǎng)提供的重要服務(wù)之一，因此，建立一個(gè)好的在線交流聊天系統(tǒng)十分重要 。 基于 jQuery 的 Ajax 聊天室應(yīng)用 2 第 1 章 緒論 系統(tǒng)概述 近年來(lái)計(jì)算機(jī)技術(shù)的快速發(fā)展，特別是計(jì)算機(jī)網(wǎng)絡(luò)的發(fā)展，越來(lái)越深刻的改變了人們生活的方方面面 ， 使得人們能以更低廉的價(jià)格，開發(fā)出更方便、更實(shí)用的網(wǎng)絡(luò)工具。 本設(shè)計(jì)主要是實(shí)現(xiàn)一個(gè)能夠方便人們?cè)诰€交流的聊天室，能夠及時(shí)顯示在線人員和聊天內(nèi)容。然而 等 聊天工具雖然方便、實(shí)用，但是，娛樂(lè)功能太多，有很多吸引人的娛樂(lè)功能，從一定程度上來(lái)說(shuō)，是一種娛樂(lè)工具，不能作為用于作為即時(shí)通訊、文件共享的專用工具。因此，采用 JSP 開發(fā)在線聊天系統(tǒng)可以提高開發(fā)效率和系統(tǒng)性能。本系統(tǒng)采用第二種方式，將聊天信息存入數(shù)據(jù)庫(kù)中，管理起來(lái)較方便。它是功能豐富的 JavaEE 集成開發(fā)環(huán)境 ，包括了完備的編碼、調(diào)試、測(cè)試和 發(fā)布功能 ，完整支持 HTML， Struts， JSP， CSS，JavaScript， Spring， SQL， Hibernate。 MySQL 的 SQL“ 結(jié)構(gòu)化查詢語(yǔ)言 ” 。 MySQL 是一個(gè)快速、多線程、多用戶的 SQL 數(shù)據(jù)庫(kù)服務(wù)器。用多線程和 C 語(yǔ)言實(shí)現(xiàn)的 MySql 能很容易充分利用 CPU。 （ 4）MySQL 支持 ODBC for Windows。 （ 6） MySQL 擁有一個(gè)非常快速而且穩(wěn)定的基于線程的內(nèi)存分配系統(tǒng)，可以持續(xù)使用面不必?fù)?dān)心其穩(wěn)定性。 Tomcat 服務(wù)器 Tomcat 是 Apache 軟件 基金會(huì)（ Apache Software Foundation）的 Jakarta 項(xiàng)目中的一個(gè)核心項(xiàng)目，由 Apache、 Sun 和其他一些公司及個(gè)人共同開發(fā)而成。當(dāng)配置正確時(shí)， Apache 為 HTML 頁(yè)面服務(wù)，而 Tomcat 實(shí)際上運(yùn)行 JSP 頁(yè)面和 Servlet。本系統(tǒng)采用 Tomcat 版本 。 JSP 頁(yè)面由 HTML 代碼和嵌入其中的 Java 代碼所組成。 JSP 是一種編譯性程序，當(dāng)一個(gè) JSP 應(yīng)用程序被首次訪問(wèn)時(shí)， JSP 所在的服務(wù)器首先將 JSP 程序轉(zhuǎn)變成為 java 程序，然后編譯成 class 類文件，最后加載到服務(wù)器內(nèi)存中為客戶端請(qǐng)求提供服務(wù)。 JSP 有五種內(nèi)置對(duì)象 ： 1. request 對(duì)象：該 對(duì)象 封裝了用戶提交的信息，通過(guò) 調(diào)用該對(duì)象相應(yīng)的方法可以獲取封裝的信息，即使用該對(duì)象可以獲取用戶提交信息。從一個(gè)客戶打開瀏覽器并連接到服務(wù)器開始，到客戶關(guān)閉瀏覽器離開這個(gè) 服務(wù)器結(jié)束，被稱為一個(gè)會(huì)話。 5. out 對(duì)象 ： out 對(duì)象是一個(gè)輸出流，用來(lái)向客戶端輸出數(shù)據(jù)。 JavaScript 自身存在 3 個(gè)弊端，即復(fù)雜的文檔對(duì)象模型（ DOM） ，不一致的瀏覽器實(shí)現(xiàn)和缺乏便捷的開發(fā)、調(diào)試工具。 Ajax 技術(shù) Ajax 即 “ Asynchronous JavaScript and XML”（ 異步 JavaScript 和 XML） ， Ajax 不是一種新的編程語(yǔ)言，而是一種用于創(chuàng)建更好更快以及交互性更強(qiáng)的 Web 應(yīng)用程序的技術(shù)。 Ajax 可使因特網(wǎng)應(yīng)用程序更小、更快， 更友好。 jQuery 使用戶能更方便地處理 HTML documents、 events、實(shí)現(xiàn)動(dòng)畫效果，并且方便地為網(wǎng)站提供 Ajax 交互?？傊?，無(wú)論是網(wǎng)頁(yè)設(shè)計(jì)師、后臺(tái)開發(fā)者、業(yè)余愛好者還是項(xiàng)目管理者，都很有必要去學(xué)習(xí) jQuery。使用 Struts 的目的是為了幫助我們減少在運(yùn)用 MVC 設(shè)計(jì)模型來(lái)開發(fā) Web 應(yīng)用的時(shí)間。 對(duì)于整個(gè) Struts 1 框架而言，控制器就是它的核心， Struts 1 的控制器由兩個(gè)部分組成：核心控制器和業(yè)務(wù)邏輯控制器。 Struts 2 與 Struts 1 相比，確實(shí)有很多革命性的改進(jìn)，但它并不是新發(fā)布的新框架，而是在另一個(gè)赫赫有名的框架： WebWork 基礎(chǔ)上發(fā)展起來(lái)的。 系統(tǒng)環(huán)境 開發(fā)環(huán)境 開發(fā)模式系統(tǒng)基于 Browser/Server 模式進(jìn)行設(shè)計(jì) 開發(fā)工具： 、 開發(fā)語(yǔ)言： JAVA： 、 JSP、 HTML、 JavaScript 后臺(tái)數(shù)據(jù)庫(kù)： MySQL Server 服務(wù)器：采用 Tomcat 服務(wù)器 運(yùn)行環(huán)境 硬件環(huán)境： 1. 服務(wù)器端 服務(wù)器 端的最低配置是由建立站點(diǎn)所需的軟件來(lái)決定的，在最低配置的情況下，服務(wù)器的往往不盡如人意，現(xiàn)在的硬件性能已經(jīng)相當(dāng)出色，而且價(jià)格也很便宜，因此通常應(yīng)給服務(wù)器端配置高性能的硬件。 jQuery 憑借簡(jiǎn)潔的語(yǔ)法和跨平臺(tái)的兼容性，極大地簡(jiǎn)化了 JavaScript 開發(fā)人員遍歷 HTML 文檔、操作 DOM、處理事件、執(zhí)行動(dòng)畫和開發(fā) Ajax 的操作，其獨(dú)特而又優(yōu)雅的代碼風(fēng)格改變了 JavaScript 程序員的設(shè)計(jì)思路和編寫程序的方式 [1]。 jQuery 不需要安裝，把下載的 放到網(wǎng)站上的一個(gè)公共位置，想要在某個(gè)頁(yè)面上使用 jQuery 時(shí)，只需要在相關(guān)的 HTML 文檔中引入該庫(kù)文件的位置即可。 }) /script 這段代碼的作用類似于傳統(tǒng) JavaScript 中得 方法。利用 CSS 選擇器能輕松地對(duì)某個(gè)元素添加樣式而不改動(dòng) HTML 結(jié)構(gòu)，只需通過(guò)添加不同的 CSS 規(guī)則，就可以得到各種不同樣式的網(wǎng) 頁(yè)。其中， $(“ID”)用來(lái)代替 ()函數(shù) ，即通過(guò) ID 獲取元素； $(“tagName”)用來(lái)代替 ()函數(shù) ，即通過(guò)標(biāo)簽名獲取 HTML 元素。 Ajax 的優(yōu)勢(shì)： 1. 不需要插件支持 Ajax 不需要任何瀏覽器插件，就可以被大多數(shù)主流瀏覽器所支持，用戶只需要允許 JavaScript 在瀏覽器上執(zhí)行即可。 基于 jQuery 的 Ajax 聊天室應(yīng)用 10 4. 減輕服務(wù)器和寬帶的負(fù)擔(dān) Ajax 的工作原理相當(dāng)于在用戶和服務(wù)器之間加了一個(gè)中間層，使用戶操作與服務(wù)器響應(yīng)異步化。為了使得Ajax 應(yīng)用能在各個(gè)瀏覽器中正常運(yùn)行，程序員必須花費(fèi)大量的精力編碼以兼顧各個(gè)瀏覽器之間的差別，來(lái)讓 Ajax 應(yīng)用能夠很好地兼容各個(gè)瀏覽器。然而，對(duì)于用戶來(lái)說(shuō)，他們經(jīng)常會(huì)碰到這種情況，當(dāng)單機(jī)一個(gè)按鈕觸發(fā)了一個(gè) Ajax 交互后又覺(jué)得不想這樣做，接著會(huì)習(xí)慣性地單擊“后退”按鈕，結(jié)果發(fā)生了最不愿意看到的結(jié)果，瀏覽器后退到了先前的一個(gè)頁(yè)面，通過(guò) Ajax 交互得到的內(nèi)容完全消失了。 同時(shí)，目前許多 Web 開發(fā)者已經(jīng)習(xí)慣使用可視化的工具，對(duì)親自動(dòng)手編寫代碼有畏懼感，這也在一定程度上影響了大家對(duì) Ajax 的應(yīng)用。 url(String) ： 請(qǐng)求的 HTML 頁(yè)的 URL 地址。 jQuery 中，可以指定選擇符，來(lái)篩選載入的 HTML 文檔，DOM 中將僅插入篩選出的 HTML 代碼。//在這里 this 指向的是當(dāng)前的 DOM 對(duì)象，即 $(.)[0] //alert(responseText)。 2. ( url, [data], [callback] )：使用 GET 方式來(lái)進(jìn)行異步請(qǐng)求 參數(shù)： url(String)： 發(fā)送請(qǐng)求的 URL 地址 。請(qǐng)求成功時(shí)可調(diào)用回調(diào)函數(shù)。//請(qǐng)求狀態(tài)： success， error 等等。 callback(Function)：（ 可選 ） 載入成功時(shí)回調(diào)函數(shù) （ 只有當(dāng) Response 的返回狀態(tài)是success 才是調(diào)用該方法 ） 。如果需要在出錯(cuò)時(shí)執(zhí)行函數(shù)，請(qǐng)使用 $.ajax。})。 點(diǎn)擊提交： 這里設(shè)置了請(qǐng)求的格式為 json查看請(qǐng)求報(bào)頭（圖 32） ： 圖 32請(qǐng)求報(bào)頭信息 如果你設(shè)置了請(qǐng)求的格式為 json，此時(shí)你沒(méi)有設(shè)置 Response 回來(lái)的 ContentType為： = application/json， 那么你將無(wú)法捕捉到返回的數(shù)據(jù)。 參數(shù) ： url(String)： 待載入 JS 文件地址。注意： Safari 2 或更早的版本不能在全局作用域中同步執(zhí)行腳本。 jQuery 代碼 ： $.getScript()。 5. jQuery Ajax 事件 Ajax 請(qǐng)求會(huì)產(chǎn)生若干不同的事件，我們可以訂閱這些事件并在其中處理我們的邏輯。全局事件可以如下定義： $(loading).bind(ajaxSend, function(){ $(this).show()。 })。 ( options )： 通過(guò) HTTP 請(qǐng)求加載遠(yuǎn)程數(shù)據(jù) 。大多數(shù)情況下你無(wú)需直接操作該對(duì)象，但特殊情況下可用于手動(dòng)終止請(qǐng)求。 當(dāng)設(shè)置 datatype 類型為 ‘ script’ 的時(shí)候，所有的遠(yuǎn)程 (不在同一個(gè)域中 )POST 請(qǐng)求都回轉(zhuǎn)換為 GET 方式。數(shù)據(jù)類型設(shè)置為 “ jsonp” 時(shí)， jQuery 將自動(dòng)調(diào)用回調(diào)函數(shù)。 timeout Number 設(shè)置請(qǐng)求超時(shí)時(shí)間（毫秒）。注意，同步請(qǐng)求將鎖住瀏覽器，用戶其它操作 必須等待請(qǐng)求完成才可以執(zhí)行。 // the options for this ajax request } cache Boolean （ 默認(rèn) ： true） jQuery 新功能，設(shè)置為 false 將不會(huì)從瀏覽器緩存中加載請(qǐng)求信息。 // the options for this ajax request } contentType String （ 默認(rèn) ： application/xformurlencoded） 發(fā)送信息至服務(wù)器時(shí)內(nèi)容編碼類型。GET 請(qǐng)求中將附加在 URL 后。如 {foo:[bar1, bar2]}轉(zhuǎn)換為 39。 dataType String 預(yù)期服務(wù)器返回的數(shù)據(jù)類型。不會(huì)自動(dòng)緩存結(jié)果。 基于 jQuery 的 Ajax 聊天室應(yīng)用 16 error Function （ 默認(rèn) ： 自動(dòng)判斷 （ xml 或 html）） 請(qǐng)求失敗時(shí)將調(diào)用此方法。設(shè)置為 false 將不會(huì)觸發(fā)全局 Ajax 事件，如 ajaxStart 或 ajaxStop。如果要發(fā)送 DOM 樹信息或其它不希望轉(zhuǎn)換的信息，請(qǐng)?jiān)O(shè)置為 false。 我們可以定義這些事件來(lái)很好的處理我們的每一次的 Ajax 請(qǐng)求。這個(gè)方法有兩個(gè)參數(shù)：服務(wù)器返回?cái)?shù)據(jù)，返回狀態(tài) function (data, textStatus) { // data could be xmlDoc, jsonObj, html, text, etc... this。使用 HTTP 包 LastModified 頭信息判斷。 function (XMLHttpRequest, textStatus, errorThrown) { // 通常情況下 textStatus 和 errorThown只有其中一個(gè)有值 this。 jsonp： JSONP 格式。 html： 返回純文本 HTML 信息；包含 script 元素。foo=bar1amp。必須為 Key/Value 格式。 data Object, String 發(fā)送到服 務(wù)器的數(shù)據(jù)。參數(shù)： XMLHttpRequest 對(duì)象，成功信息字符串。 XMLHttpRequest 對(duì)象是唯一的參數(shù)。 async Bo