網(wǎng)絡相冊管理系統(tǒng)畢業(yè)設計

摘要數(shù)碼產(chǎn)品的普及，傳統(tǒng)的相冊已經(jīng)退出了市場，現(xiàn)在人們一般都用數(shù)碼相機，照片都存在電腦上，電子相冊就是把照片通過掃描儀掃描到電腦里，它具有傳統(tǒng)相冊無法比擬的優(yōu)越性。隨著互聯(lián)網(wǎng)的發(fā)展，人們已經(jīng)不滿足于只是把照片放在自己的電腦里，他們還希望可以將自己拍攝的數(shù)碼照片傳送到網(wǎng)絡中，以供網(wǎng)絡中的其他朋友分享瀏覽，充分展現(xiàn)自己的風采，網(wǎng)絡相冊服務也因此應運而生并日趨盛行。本文就是以此為背景，結(jié)合實際，從相關(guān)技術(shù)簡介、需求及概要設計、詳細設計及實現(xiàn)、實現(xiàn)效果、測試分析等幾個方面詳細闡述了一個能夠?qū)φ掌M行網(wǎng)絡存儲、留言回復等交互功能的網(wǎng)絡相冊管理系統(tǒng)的設計實現(xiàn)。本網(wǎng)絡相冊管理系統(tǒng)采用JSP/Servlet等實現(xiàn)技術(shù)，以及先進的框架技術(shù)配合實現(xiàn)。系統(tǒng)可劃分為用戶注冊/登陸模塊、用戶信息管理模塊、用戶相冊管理模塊、用戶相片管理模塊、用戶留言管理模塊個模塊。通過對各個功能模塊的實現(xiàn)、集成，最終完成的系統(tǒng)實現(xiàn)為用戶提供基于網(wǎng)絡社區(qū)的基本的網(wǎng)絡相冊服務。關(guān)鍵詞：信息化；相冊；網(wǎng)絡相冊AbstractAlongwiththedevelopmentoftheInternet,peoplearenotcontenttojustputthephotosonyourcomputer,theyalsohopethatcanbepassedtothenetworkanddigitalphotosofthemselvestootherfriendsinthenetworkbrowsing,tofullydemonstratetheirelegantdemeanour,webalbumsservicealsoarisesatthehistoricmomentandanincreasinglypopular.Thisarticleisbasedonthisbackground,combinedwiththeactual,fromtherelatedtechnologyintroduction,demandandgeneraldesign,detaileddesignandimplementation,theimplementationeffect,thetestandanalysisandsoonseveralaspectsindetailelaboratedtheacancarryonthenetworkstorage,leaveamessagebacktothephotothedesignoftheinteractivefunctionssuchaswebalbumsmanagementsystemimplementation.ThiswebalbumsmanagementsystemUSEStheJSP/Servletimplementationtechnology,andadvancedtechnologywiththeframeworkofimplementation.Systemcanbedividedintouserregistration/loginmodule,userinformationmanagementmodule,usermanagementmodule,userphotoalbummanagementmodule,usermanagementmodulemessagemodule.Throughtheimplementationofeachfunctionmodule,integrationandfinishingsystemimplementationtoprovidebasicwebalbumsservicebasedonnetwork.Keywords:informationtechnology,photoalbum,webalbums目錄208971引言 1109582相關(guān)技術(shù)簡介 2185242.1WEB建站思想 2315862.1.1JavaWEB應用簡介 2272442.1.2Web工程過程 2172562.2WEB系統(tǒng)實現(xiàn)技術(shù) 3191612.2.1WEB服務實現(xiàn)技術(shù) 3121062.2.2數(shù)據(jù)庫技術(shù) 4153222.2.3系統(tǒng)數(shù)據(jù)庫連接 4107402.3Tomcat的工作模式 481802.4運行環(huán)境和開發(fā)工具的選擇 5189382.4.1運行環(huán)境 52642.4.2開發(fā)工具 5289033系統(tǒng)需求及概要設計 612483.1系統(tǒng)需求描述 6302483.2主界面設計 6212313.3系統(tǒng)模塊細分 7169403.4關(guān)鍵技術(shù) 8239163.4.1對相片上傳格式的設置 891413.4.2縮略圖的生成 8204643.4.3圖片顯示特效 9144413.5系統(tǒng)數(shù)據(jù)庫設計 9143883.5.1數(shù)據(jù)庫設計 9192293.5.2系統(tǒng)表結(jié)構(gòu) 9250073.5.3數(shù)據(jù)庫的完整性和安全性 10239393.5.4數(shù)據(jù)庫的連接實現(xiàn) 11253694系統(tǒng)實現(xiàn)效果 12184.1系統(tǒng)公共模塊實現(xiàn)效果 1254134.1.1系統(tǒng)首頁的整體頁面效果 12292844.1.2用戶成功登錄頁面 1292004.1.3用戶注冊界面效果 1359884.1.4圖片留言界面效果 13145774.1.5興趣社區(qū)界面效果 14255964.1.6個人管理界面效果 14269994.2賬號管理模塊實現(xiàn)效果 15256364.3相冊及相片模塊實現(xiàn)效果 16138074.4圖片留言管理模塊實現(xiàn)效果 1944855系統(tǒng)測試報告 2121895.1跨瀏覽器測試結(jié)果及分析 21204895.2用戶相冊模塊測試結(jié)果及分析 21220285.3測試結(jié)論 21184445.4遇到問題及解決 22229466結(jié)論 2321266參考文獻 2427993致謝 251引言相冊在很早以前就有了，但是原來的相冊是以紙質(zhì)照片的形式的存在的，它使用人工方式進行管理，工作量大。而且相冊還存在不易保管，不方便攜帶，容易丟失，翻看不方便，占用空間等等問題。后來隨著時代的發(fā)展，科技的進步，攝影技術(shù)的發(fā)展，旅游業(yè)的進步，照片數(shù)量急速增加，使用傳統(tǒng)的方式來管理照片顯然力不從心，而個人電腦的發(fā)展，照片數(shù)碼化，加速了電子相冊的產(chǎn)生與進步，電子相冊解決了傳統(tǒng)相冊不易保管，不方便攜帶，容易丟失，翻看不方便，占用空間等等問題。而由于網(wǎng)絡技術(shù)的發(fā)展，網(wǎng)絡已經(jīng)漸漸的大眾化。在網(wǎng)絡沖印也已實現(xiàn)的今天，人們對于電子相冊的需求也不再局限于保管相片那么簡單。人們更希望把自己的照片同好友分享，希望照片更方便于攜帶，方便于搜索和查閱。而近年來，隨著各式網(wǎng)絡社區(qū)的出現(xiàn)，web2.0概念的普及，為了提高網(wǎng)站的知名度，用戶的黏度，迫使社區(qū)類網(wǎng)站不斷改進擴充自己的功能。而出于用戶對電子相冊分享的需要，使得網(wǎng)絡相冊能和網(wǎng)絡社區(qū)極好的結(jié)合，也使其成為網(wǎng)絡社區(qū)中一個不可或缺的組成部分。隨著互聯(lián)網(wǎng)的普及和發(fā)展，越來越多的人選擇了網(wǎng)絡，利用網(wǎng)絡相冊來保存自己的照片，這讓網(wǎng)絡相冊行業(yè)迅速的紅火起來?？梢?，網(wǎng)絡相冊作為一項基礎互聯(lián)網(wǎng)應用，正在隨著網(wǎng)絡環(huán)境的日益成熟以及用戶需求的持續(xù)增長而得到快速發(fā)展。而以交互分享為核心的網(wǎng)絡相冊2.0理念也成為產(chǎn)品功能改善和用戶體驗提升的重要標志。而本課題就是在這樣的前提下提出的，由于網(wǎng)絡相冊用戶的大量增加，制作一款以web2.0概念為出發(fā)點，以良好的用戶體驗為基礎，為用戶提供一個以存儲、交互為核心，結(jié)合了社區(qū)模式的平臺，而且又兼具一些與眾不同的功能的網(wǎng)絡相冊管理系統(tǒng)，來滿足用戶的需要，就顯得十分必要，也十分具有現(xiàn)實意義和價值了。 2相關(guān)技術(shù)簡介2.1WEB建站思想JavaWeb應用有一組靜態(tài)HTML頁、Servlet、JSP和其他相關(guān)的class組成。每種組件在Web應用中都有固定的存放目錄。Web應用的配置信息存放在web.xml文件中。在發(fā)布某些組件（如Servlet）時，必須在web.xml文件中添加相應的配置信息。2.1.1JavaWEB應用簡介Tomcat服務器最主要的功能就是充當JavaWeb應用的容器。在Sun的JavaServlet規(guī)范中，對JavaWeb應用做了這樣的定義：“JavaWeb應用由一組Servlet、HTML頁、類，以及其他可以綁定的資源構(gòu)成。它可以在各種供應商提供的實現(xiàn)Servlet規(guī)范的Web應用中運行。”JavaWeb應用的主要特征之一就是它與Context的關(guān)系。每個Web應用有惟一的Context。當JavaWeb應用運行時，Servlet容器為每個Web應用創(chuàng)建惟一的ServletContext對象，它被同一個Web應用中所有的組件共享。2.1.2Web工程過程Web工程過程活動貫穿Web生命周期，從應用概念的生成到開發(fā)、發(fā)布、不斷的精化和升級系統(tǒng)。為了降低開發(fā)基于Web的應用系統(tǒng)的復雜性，需要一個描述開發(fā)基于Web的應用系統(tǒng)階段的過程模型。(1)Web分析基于Web的應用系統(tǒng)的需求分析是很重要的活動，需要一個系統(tǒng)而嚴密的方法。根據(jù)Web特性和Web應用的特定需求，需要采用更為開放、靈活的需求分析方法。(2)Web設計Web設計不但包括功能設計和性能設計,還要包括頁面風格設計，包括頁面的主色調(diào)、頁面框架結(jié)構(gòu)、文字顏色搭配、動畫和圖片的放置等。有效的Web站點設計需要注意可用性，要把基于Web的系統(tǒng)設計成易于導航，吸引人和有用?，F(xiàn)在，比較流行的Web設計方法是以用戶為中心的設計。(3)Web開發(fā)Web開發(fā)過程包括后臺數(shù)據(jù)庫程序的開發(fā)、頁面程序的編寫和所有網(wǎng)頁的制作。在設計階段決定的Web框架基礎上，進行具體的頁面設計和制作。把內(nèi)容提供人員的內(nèi)容連接到具體的頁面。(4)Web測試基于Web的應用系統(tǒng)的測試不但需要檢查和驗證是否按照設計的要求運行，而且還要評價系統(tǒng)在不同用戶的瀏覽器的顯示是否合適。重要的是，還要從最終用戶的角度進行安全性和可用性測試。2.2WEB系統(tǒng)實現(xiàn)技術(shù)2.2.1WEB服務實現(xiàn)技術(shù)目前比較成熟的技術(shù)主要有ASP、PHP和JSP?，F(xiàn)對它們做一些說明：PHP是一種跨平臺的服務器端的嵌入式腳本語言。它大量地借用C，Java和Perl語言的語法，并耦合PHP自己的特性，使WEB開發(fā)者能夠快速地寫出動態(tài)產(chǎn)生頁面。它支持目前絕大多數(shù)數(shù)據(jù)庫。JSP是Sun公司推出的新一代網(wǎng)站開發(fā)語言JSP可以在Servlet和JavaBean的支持下，完成功能強大的站點程序。JSP技術(shù)特點：1.簡化的頁面生成技術(shù)。JSP頁面用標準的HTML或XML命令來處理頁面的格式化和布局設計，而用類似HTML、XML的標記和Java語言編寫的腳本程序生成頁面內(nèi)容。這使得頁面形式與頁面內(nèi)容互相獨立，非常有利于大型項目的分工合作。2.與Java平臺有機集成。JSP技術(shù)是Java2平臺的重要組成部分，JSP使用Java語言作為它的腳本語言。在JSP頁面中可以使用幾乎所有的Java組件和JavaAPI，這就能充分發(fā)揮出Java語言的強大功能。使用JSP技術(shù)可以創(chuàng)建具有高度可伸縮性和可靠性的Web應用程序。3.硬件平臺和服務器無關(guān)性。JSP作為Java家族的一員，秉承了Java技術(shù)的“一次編寫，隨處可用(WriteOnce，RumAnywhere)”的特性，可以運行于大多數(shù)流行的操作系統(tǒng)平臺及Web服務器，這種與服務器硬件和操作系統(tǒng)平臺的無關(guān)性是JSP相對于其它動態(tài)網(wǎng)頁技術(shù)最大的一個優(yōu)點。4.功能可擴展性。如同Microsoft的JSP技術(shù)可以通過ActiveX/COM組件來擴展功能一樣，JSP可以通過JavaBean和EJB(Enterprise

JavaBean)以及自定義的標記來擴展功能。JSP可以通過JDBC，與諸如Oracle、SQLServer這樣的大型關(guān)系數(shù)據(jù)庫進行連接。JSP提供了一些隱含對象。這些隱含對象在JSP頁面中可以直接引用，而不必首先聲明。利用JSP提供的這些隱含對象，可以使腳本功能更加強大，并且編程更加容易、方便。例如，利用request對象，可以很容易地接收用戶在HTML表單中提交的信息。2.2.2數(shù)據(jù)庫技術(shù)MySQL（通常被讀作My-sequel）是一個開放源碼的關(guān)聯(lián)式數(shù)據(jù)庫管理系統(tǒng)。MySQL被廣泛地應用在Internet上的中小型網(wǎng)站中。由于其體積小、速度快、總體擁有成本低，尤其是開放源碼這一特點，許多中小型網(wǎng)站為了降低網(wǎng)站總體擁有成本而選擇了MySQL作為網(wǎng)站數(shù)據(jù)庫。MySQL所使用的SQL語言是用于訪問數(shù)據(jù)庫的最常用標準化語言。2.2.3系統(tǒng)數(shù)據(jù)庫連接JDBC技術(shù)是JavaDataBaseConnectivity的縮寫，它是SUN公司提供的一種支持基本SQL功能的通用的應用程序接口(ApplicationProgrammingInterface)。它由一組用Java語言編寫的類和接口組成。通過這些類和接口，程序開發(fā)人員可以在Java語言中方便地建立與數(shù)據(jù)庫的鏈接，通過執(zhí)行相應SQL語句，完成對不同數(shù)據(jù)庫的訪問。因此，開發(fā)人員使用JDBCAPI可以不必編寫一個應用程序來訪問Sybase數(shù)據(jù)庫，又另外編寫一個應用程序去訪問Oracle數(shù)據(jù)庫，再寫一個應用程序訪問Microsoft的SQLServer。不但如此，使用Java語言編寫的應用程序可以在任何支持Java的平臺上運行，不必在不同的平臺上開發(fā)不同的應用程序。簡單地說，JDBC能完成下列三件事：1.同一個數(shù)據(jù)庫建立連接；2.向數(shù)據(jù)庫建立連接；3.處理數(shù)據(jù)庫返回的結(jié)果。2.3Tomcat的工作模式Tomcat作為Servlet容器，有以下幾種工作模式。（1）獨立的Servlet容器在這種模式下，Tomcat可以作為獨立的JavaWeb服務器，Servlet容器作為構(gòu)成Web服務器的一部分而存在。獨立的Servlet容器是Tomcat的默認模式。（2）進程內(nèi)的Servlet容器Servlet容器分為Web服務器插件和Java容器兩部分。Web服務器插件在其他Web服務器內(nèi)部地址空間打開一個Java虛擬機（JVM,JavaVirtualMachine），Java容器在此JVM中運行Servlet。如有客戶端發(fā)出調(diào)用Servlet的請求，插件獲得對此請求的控制并將它傳遞（使用JNI通信機制）給Java容器。進程內(nèi)Servlet容器對于單進程、多線程的服務器非常適合，可以提供較高的運行速度，但缺乏伸縮性。（3）進程外的Servlet容器Servlet容器分為Web服務器插件和Java容器兩部分。Web服務器插件在其他Web服務器的外部地址空間打開一個JVM，Java容器在此JVM中運行Servlet，如有客戶端發(fā)出調(diào)用Servlet的請求，插件獲得對此請求的控制并將它傳遞（采用IPC通信機制）給Java容器。進程外Servlet容器對客戶請求的響應速度不如進程內(nèi)容器，但進程外容器具有更好的伸縮性和穩(wěn)定性。2.4運行環(huán)境和開發(fā)工具的選擇2.4.1運行環(huán)境所必須具備的開發(fā)環(huán)境：(1)JDK1.6.0(2)Mysql(3)操作系統(tǒng)為Window7(4)MyEclipse(5)Dreamweaver(6)apache-tomcat-.2開發(fā)工具Dreamweaver是建立Web站點和應用程序的專業(yè)工具。

它將可視布局工具、應用程序開發(fā)功能和代碼編輯支持組合為一個功能強大的工具，使每個級別的開發(fā)人員和設計人員都可利用它快速創(chuàng)建界面吸引人并且基于標準的站點和應用程序。3系統(tǒng)需求及概要設計本章主要根據(jù)需求分析的結(jié)果對系統(tǒng)的總體功能進行設計，對模塊進行劃分，并對各個模塊以及他們之間的關(guān)系進行概述，為了更好地提升系統(tǒng)性能，進行了架構(gòu)方案的設計。最后設計了能夠完成系統(tǒng)所有功能所需的數(shù)據(jù)庫。3.1系統(tǒng)需求描述這個交互平臺以網(wǎng)絡相冊為主體，通過用戶上傳相冊產(chǎn)生主體數(shù)據(jù)；而通過好友、評論等功能實現(xiàn)用戶之間的交互，從而在用戶間形成社會網(wǎng)絡，通過社會網(wǎng)絡加強系統(tǒng)用戶交互，提高系統(tǒng)用戶黏度。系統(tǒng)需要向用戶提供簡單，方便的操作界面，提高用戶的可操作性，降低用戶的使用難度；系統(tǒng)還需要向用戶提供良好的界面表現(xiàn)效果，以提高用戶體驗，提高系統(tǒng)的用戶黏度。在現(xiàn)在多種瀏覽器并行的今天，跨瀏覽器也是系統(tǒng)需求中必不可少的一條。如果無法解決這點，將大大影響用戶體驗。3.2主界面設計訪問網(wǎng)絡相冊程序時首先進入網(wǎng)絡相冊的主界面，如圖3-1所示。在該頁面中共包括功能導航區(qū)域、圖片展示區(qū)域、用戶操作區(qū)域及版權(quán)信息區(qū)域4個部分。其中，功能導航區(qū)域、用戶操作區(qū)域及版權(quán)信息區(qū)域是固定的內(nèi)容，用來進行其他操作，而圖片展示區(qū)域是按類別顯示圖片信息。在圖片展示區(qū)域按照數(shù)據(jù)庫中類別個數(shù)顯示，每種類型圖片最多顯示五張（即一行的容量），其中類別，相冊，圖片相關(guān)參照數(shù)據(jù)庫操作。當運行程序時，首先執(zhí)行index.jsp頁面，在該頁面中訪問Servlet實現(xiàn)類，通過該實現(xiàn)類轉(zhuǎn)發(fā)到另一個頁面。功能導航區(qū)域用功能導航區(qū)域用戶圖片展示區(qū)域操作區(qū)域版權(quán)信息區(qū)域圖3-1主頁面設計3.3系統(tǒng)模塊細分根據(jù)系統(tǒng)需求，最終把該系統(tǒng)劃分成用戶注冊/登錄模塊，用戶信息管理模塊，用戶相冊管理模塊，用戶圖片管理模塊，用戶留言管理模塊，并各自向用戶提供簡單有效的功能及服務。系統(tǒng)整體的功能結(jié)構(gòu)（如圖3-2）：網(wǎng)絡相冊管理系統(tǒng)用戶注冊/登錄模塊網(wǎng)絡相冊管理系統(tǒng)用戶注冊/登錄模塊用戶信息管理模塊用戶相冊管理模塊用戶相片管理模塊用戶留言管理模塊圖3-2系統(tǒng)功能結(jié)構(gòu) 該系統(tǒng)的五大模塊細分為十個部分，分別如下：(1)用戶注冊用戶注冊了相關(guān)信息才能用此相冊系統(tǒng)。(2)用戶登錄用戶登錄時需要輸入用戶賬號和密碼。若用戶登錄成功，則用戶可以進入相冊系統(tǒng)；若用戶登錄失敗，則需重新登錄。(3)分欄顯示相冊分欄顯示相片類別操作時用戶登錄后才能進行的操作，通過數(shù)據(jù)庫連接在頁面上分別顯示不同類別的圖片。(4)上傳相片用戶在相片上傳表單中輸入完整的信息后，單擊“上傳”按鈕即可。(5)將圖片設置為相冊封面用戶點擊“設為封面”，后臺程序連接數(shù)據(jù)庫，更改相冊的封面信息，實現(xiàn)改變封面的功能。(6)相片刪除用戶登錄成功后，可以將當前的圖片刪除，單擊“刪除此相片”即可刪除當前相片。(7)相片留言用戶登錄成功后，可單擊當前圖片，進入留言界面，也即對圖片進行評論。(8)留言管理用戶登錄成功后，可以對屬于自己的圖片進行管理，可刪除留言，回復留言。(9)刪除操作用戶登錄成功后，可以對自身信息進行管理，再刪除相冊時，屬于本相冊的圖片信息也要刪除；同理，刪除圖片時，對圖片的留言和回復信息業(yè)一并刪除。(10)個人信息管理用戶登錄成功后，可以查看個人信息，修改密碼，上傳頭像。3.4關(guān)鍵技術(shù)3.4.1對相片上傳格式的設置在計算機文件中，相片的格式多種多樣，通常情況下相片可以是“JPG”、“jpg”、“gif”、“bmp”、“BMP”等格式。因此，用戶需要保證上傳的圖片就是相片所需的圖片格式，可以通過Java源代碼解決這一問題，具體如下：(1)將系統(tǒng)中所允許上傳的相片格式存儲在String類型的數(shù)據(jù)中，并設置這個數(shù)組的對象，該對象的名稱為type。(2)設置相片的固定格式存儲在String類型的fileType對象，調(diào)用java.util.Arrays類中的binarySearch()方法，該方法的參數(shù)分別為type和fileType，主要查詢fileType對象內(nèi)容在type數(shù)組對象中的位置并將返回結(jié)果賦予int類型變量，該變量的名稱為place。(3)判斷place變量值，如果該變量值為正數(shù)，則說明fileType在type數(shù)組對象中存在，其中正數(shù)為具體位置；如果該變量值為負數(shù)，則說明fileType在type數(shù)組對象中不存在，其負數(shù)值為-1。(4)在本系統(tǒng)中也可以上傳其他類型的文件，只是在上傳的時候自己控制文件類型。3.4.2縮略圖的生成(1)在相冊管理模塊中，相片資料的上傳是必不可少的功能，但隨著高分辨率相片的普及，上傳圖片的容量會很大，例如300萬像素的相片文件大小基本上是大于600KB。在很多圖片的網(wǎng)頁中，圖片容量越大打開網(wǎng)頁的速度越慢。為了解決這個問題，用戶上傳圖片時可以在類中處理一張大相片并縮小它。(2)在本系統(tǒng)中上傳圖片時只是設置了上傳的文件的最大值，并未實現(xiàn)縮略圖效果，在網(wǎng)頁上顯示時設置了圖片的格式，比如寬和高各為多少像素，這樣控制圖片的大小。這樣操作有一個問題，在圖片自身比設定的小時，顯示的圖片不清楚。3.4.3圖片顯示特效在相冊管理模塊中，圖片的顯示特效主要的無間斷圖片滾動效果和幻燈片瀏覽圖片。3.5系統(tǒng)數(shù)據(jù)庫設計3.5.1數(shù)據(jù)庫設計本系統(tǒng)數(shù)據(jù)庫采用Mysql,數(shù)據(jù)庫名稱為xiangce，該數(shù)據(jù)庫中一共有五個數(shù)據(jù)表，分別是：user(用戶表)，photos（相冊表），photo（圖片表），message（留言表），xingqu（相冊分類表）。3.5.2系統(tǒng)表結(jié)構(gòu)這個章節(jié)列舉了系統(tǒng)的表結(jié)構(gòu)（如表3-1至表3-10）。表3-1用戶表（user）字段名數(shù)據(jù)類型描述idVARCAHR(30)用戶IDnameVARCAHR(30)用戶名sexVARCAHR(10)性別passVARCAHR(30)密碼touxiangVARCAHR(300)用戶頭像名稱表3-2相冊表（photos）字段名數(shù)據(jù)類型描述nameVARCAHR(30)相冊名fenleiVARCAHR(30)相冊所屬分類user_idVARCAHR(30)相冊所屬用戶coverVARCAHR(300)相冊封面圖片名稱表3-3圖片表（photo）字段名數(shù)據(jù)類型描述nameVARCAHR(300)圖片名稱photos_nameVARCAHR(30)圖片所屬相冊表3-4留言表（message）字段名數(shù)據(jù)類型描述idINT(100)留言編號photo_nameVARCAHR(300)圖片名稱user_idVARCAHR(30)留言者IDnoteVARCAHR(300)留言信息replyVARCAHR(300)回復信息表3-5相冊分類表（xingqu）字段名數(shù)據(jù)類型描述fenleiVARCAHR(30)相冊分類名3.5.3數(shù)據(jù)庫的完整性和安全性1.完整性：主要是指數(shù)據(jù)的正確性和相容性，防止數(shù)據(jù)庫中存在不符合語義的數(shù)據(jù)，防止錯誤信息的輸入和輸出，即所謂垃圾進垃圾出所造成的無效操作和出錯處理。在這一部分我主要是在信息提交時用腳本控制，并在寫入數(shù)據(jù)庫時再次進行檢查。后臺JAVA文件控制寫入數(shù)據(jù)庫：if("".equals(name)||"".equals(fenlei)){System.out.println("請輸入完整信息！");resp.sendRedirect("daohang/replyself/xiangceguanli/new_photos.jsp?flag=info");}else{ if(rs.next()){ System.out.println(name+"已存在，請換一個用戶名！"); resp.sendRedirect("daohang/replyself/xiangceguanli/new_photos.jsp?flag=wrong"); }}2.安全性：主是保護數(shù)據(jù)庫防止惡意的破壞和非法的存取，也就是說安全性措施的防范對象是非法用戶和非法操作。前臺頁面提示用戶未登錄信息：<%//查詢當前登錄用戶信息 try { Stringuser_id=(String)session.getAttribute("user_id"); if(user_id==null){%><b>您還未登錄，不能留言！</b><% }%>3.5.4數(shù)據(jù)庫的連接實現(xiàn)<%@pagelanguage="java"import="java.util.*"pageEncoding="utf-8"%><%@pageimport="java.sql.*"%><head><linkhref="css/example.css"rel="stylesheet"type="text/css"><title>圖片留言</title></head><body><%//連接數(shù)據(jù)庫操作 request.setCharacterEncoding("utf-8"); Stringname=request.getParameter("user"); Stringpass=request.getParameter("pass"); Stringurl="jdbc:mysql://:3306/xiangce"; StringdbUser="root"; StringdbPass=""; Connectionconn=null; try { Class.forName("com.mysql.jdbc.Driver"); }catch(ClassNotFoundExceptione) {out.println("驅(qū)動加載失敗"); } try { conn=DriverManager.getConnection(url,dbUser,dbPass);}catch(SQLExceptione) {out.println("數(shù)據(jù)庫連接失敗"); }%></body></html>4系統(tǒng)實現(xiàn)效果本章著重介紹通過了上述的概要設計和詳細設計之后，系統(tǒng)各個功能模塊的實現(xiàn)效果圖：包括系統(tǒng)的關(guān)鍵模塊效果圖和特色模塊效果圖的展示。4.1系統(tǒng)公共模塊實現(xiàn)效果4.1.1系統(tǒng)首頁的整體頁面效果單擊“注冊”按鈕，進入注冊頁面注冊，然后登錄。（如圖5-1）圖5-1系統(tǒng)首頁4.1.2用戶成功登錄頁面用戶登錄成功后，跳轉(zhuǎn)到success頁面，右上角用戶操作區(qū)域顯示用戶信息（用戶頭像，用戶ID，用戶名稱）。（如圖5-2）圖5-2登錄成功頁4.1.3用戶注冊界面效果用戶賬號自己定義，且為用戶的鍵屬性，如果已存在，有提示信息提示重新填寫。（如圖5-3）圖5-3用戶注冊頁4.1.4圖片留言界面效果單擊圖片進入留言界面，如果當前為登錄用戶右上角用戶區(qū)域顯示用戶信息，否則提示為登錄。（如圖5-4）圖5-4用戶留言頁4.1.5興趣社區(qū)界面效果登錄成功首頁上有導航條目，本系統(tǒng)用js設計實現(xiàn)，鼠標點擊“興趣社區(qū)”會出現(xiàn)相冊分類名稱，隨意選擇進入一個頁面，上圖為“汽車社區(qū)”，圖片來自數(shù)據(jù)庫中相冊分類名稱為“汽車”的所有相冊。至于每個頁面的大圖，本來想用js實現(xiàn)動態(tài)效果的，可是由于時間，能力，經(jīng)歷有限，未能實現(xiàn)，此處只是調(diào)用了一張大圖，靜態(tài)的。（如圖5-5）圖5-5汽車社區(qū)瀏覽頁4.1.6個人管理界面效果個人管理頁面包括賬號管理（個人信息展示，修改密碼，上傳頭像），相冊管理（相冊信息展示，添加圖片，新建相冊，刪除相冊），圖片留言管理（留言信息展示，回復留言，刪除留言），注銷登錄。（如圖5-6）圖5-6個人管理頁4.2賬號管理模塊實現(xiàn)效果1、個人信息展示頁面顯示當前登錄用戶的個人信息，包括頭像、賬號、名稱、性別、和密碼（如圖5-7所示）圖5-7個人信息展示2、修改密碼頁面請用戶輸入新密碼并且確認密碼，提交后修改數(shù)據(jù)庫中的user表（如圖5-8所示）圖5-8修改密碼3、上傳頭像頁面首先顯示用戶當前頭像信息，上傳頭像后修改用戶當前頭像為剛上傳頭像（如圖5-9所示）圖5-9上傳頭像效果4.3相冊及相片模塊實現(xiàn)效果相冊首頁顯示當前登錄用戶的相冊信息。如圖5-10所示：首先可以看到有兩個相冊，其中一個有圖片（其中圖片作為封面），另一個沒有圖片（使用默認圖片作為封面）。還可以對相冊進行添加圖片，刪除相冊的操作。圖5-10相冊首頁2、新建相冊頁面須填寫相冊標題和相冊分類，相冊分類選項內(nèi)容來自數(shù)據(jù)庫中xingqu表（如圖5-11所示）圖5-11新建相冊頁3、相冊瀏覽頁面顯示當前相冊的名稱和其中所有的圖片，每張圖片下方有設為封面和刪除兩個屬性，單擊圖片即可進入圖片瀏覽頁面（如圖5-12所示）圖5-12相冊瀏覽頁面4、相片瀏覽頁面主要顯示圖片加留言回復信息（如圖5-13）圖5-13相片瀏覽頁面5、相片上傳頁面只是實現(xiàn)了單張圖片的上傳，沒有批量上傳，上傳后修改數(shù)據(jù)庫中photo表使其新增一行信息（如圖5-14）圖5-14相片上傳頁面4.4圖片留言管理模塊實現(xiàn)效果1、留言頁面左側(cè)顯示圖片及所有者，以及圖片的留言回復信息；右側(cè)上方顯示當前登錄用戶頭像、ID、用戶名，下方顯示留言欄，用戶可進行評論（如圖5-15）圖5-15留言頁面2、查看留言信息頁面，此處為操作方便使用表格顯示留言信息，表格中內(nèi)容包括圖片名稱、留言人賬號、評論、回復（此處區(qū)分已回復和未回復）、刪除操作（如圖5-16）圖5-16留言信息頁面3、回復留言頁面顯示當前圖片和圖片名稱，以及這條評論及評論者，下方有回復欄，登錄者可進行回復（如圖5-17）圖5-17回復留言頁面5系統(tǒng)測試報告考慮到系統(tǒng)的功能點較多，測試用例的篇幅較大，故而只列舉一些主要模塊的測試用例，并簡要敘述了測試的結(jié)果缺陷分析。5.1跨瀏覽器測試結(jié)果及分析本系統(tǒng)在實現(xiàn)過程中一直使用搜狗——兼容模式。表6-1跨瀏覽器測試結(jié)果瀏覽器頁面測試結(jié)果在線編輯測試結(jié)果搜狗——兼容模式通過通過搜狗——高速模式個別頁面錯位通過I/E個別頁面錯位通過Firefox29個別頁面無法顯示上傳的圖片未通過在跨瀏覽器的測試中，個別頁面存在微小錯位，存在一定缺陷，有待改進CSS的布局。5.2用戶相冊模塊測試結(jié)果及分析表6-2創(chuàng)建相冊的測試結(jié)果用例預期結(jié)果實際結(jié)果相冊名為空提示輸入完整信息提示輸入完整信息相冊分類未選擇提示輸入完整信息提示輸入完整信息相冊名已存在提示換一個相冊名提示換一個相冊名相冊名大于設定值提示字符越界提示字符越界相冊名小于等于設定值提示可用提示可用除此之外還對腳本過濾，權(quán)限過濾做了測試，測試結(jié)果和預期相同。因此相冊模塊基本通過測試。5.3測試結(jié)論通過測試發(fā)現(xiàn)系統(tǒng)功能基本完整、權(quán)限過濾、重復提交檢測等功能良好，但是在腳本過濾、二次檢測等方面還有待改進，存在一定安全性的缺陷。而在跨平臺（主要是跨瀏覽器平臺）上的，以及頁面的定位設計上還存在一定的缺陷，需要改進。另外，由于缺乏測試工具，沒有對系統(tǒng)進行性能測試，因為無法對系統(tǒng)性能提供改進意見和方案，需要進一步進行。5.4遇到問題及解決在整個設計過程中，我遇到了很多問題，比如異常的不斷出現(xiàn)，數(shù)據(jù)庫無法存儲漢字形式，還有在設計過程中對頁面布局的不斷修改使工作量加大等等。設計到最后，我有以下幾點感想：（1）設計最初的準備工作一是環(huán)境的搭建，開始我并沒有意識到這個問題，直到后來一些讓人摸不著頭腦的問題的出現(xiàn)，我才慢慢找出問題。開始數(shù)據(jù)庫里存儲不了漢字信息，一直用“拼音加英文”的模式對數(shù)據(jù)庫進行更新操作，當然，這樣寫特別單調(diào)，后來把MyEclipse中filter選項該為”UTF-8”格式，實現(xiàn)了對數(shù)據(jù)庫的漢字存儲；再后來遇到的問題，就是瀏覽器地址導航欄傳輸不了漢字，以至于我以漢字作為index的操作無法執(zhí)行，在tomcat中config文件夾下的sever.xml文件中添加

URIEncoding="utf-8"語句，讓tomcat支持中文格式，實現(xiàn)地址欄對漢字的傳輸。二是頁面布局的設計，現(xiàn)在看我的頁面效果其實只引用了兩種界面，雖然編寫的網(wǎng)頁有好多，但都是在一個的基礎上實現(xiàn)的，所以先設計整個頁面的布局會省去很多事，像我在設計過程中修改界面工作量很大，問題倒是還好，就是太耗時間。（2）圖片上傳及顯示過程在沒實現(xiàn)這個功能之前，我一直以為圖片是要存儲到數(shù)據(jù)庫中的。呵呵，問題在解決以后就不再是問題了。上傳圖片是在根目錄下創(chuàng)建一個文件夾，把上傳的圖片信息都存儲到里面，再將圖片名稱存儲到數(shù)據(jù)庫中相應位置，在頁面需要顯示時訪問數(shù)據(jù)庫進行調(diào)用即可。（3）交互功能的簡單實現(xiàn)在強調(diào)交互功能的社區(qū)功能中我也只是實現(xiàn)了留言回復功能，寫過好友管理模塊，可是因為SESSION屬性不穩(wěn)定，再加上我設計的好友交互沒什么實際作用，后來就舍棄了這部分功能。6結(jié)論本設計方案達到了任務書的要求(1)實現(xiàn)了圖片的上傳與保存；(2)系統(tǒng)簡單的實現(xiàn)了系統(tǒng)相冊的實時更新和簡單的用戶、相冊功能；(3)通過加入好友、評論、留言等模塊實現(xiàn)用戶間的交互，實現(xiàn)網(wǎng)絡社區(qū)概念；(4)通過標簽技術(shù)的運用和合理的數(shù)據(jù)庫設計，達到均衡負載的效果。由于時間、水平和經(jīng)驗有限，系統(tǒng)還存在這大量的不足與欠缺：(1)一些重要的功能并沒有完全完成，比如好友管理、站內(nèi)信、及時查詢回復信息等交互功能，后臺管理的操作等都需要進一步完善。(2)系統(tǒng)異常處理機制不夠完善，雖然有簡單的異常捕獲機制，但是卻缺乏規(guī)劃，沒有對異常流進行專門的設計；(3)JavaScript缺乏面向?qū)ο笏枷?、過于過程化；(4)系統(tǒng)健壯性存在問題，安全性有待提高；(5)軟件設計思想不夠成熟，存在大量的冗余代碼，修改和維護不便，需要結(jié)合設計模式進行代碼重構(gòu)?？偟膩碚f，這次畢業(yè)設計對于我來說，既是一次機遇，又是一次挑戰(zhàn)。通過這次的畢業(yè)設計，我學到了很多東西，通過自己的實踐，對于網(wǎng)站設計和圖片管理都有了更深入了解，增強了動手能力。很多實際的設計過程中遇到的問題，都需要通過在已經(jīng)掌握的書本知識的基礎上，結(jié)合具體問題進行具體分析才能得到解決，而這也是只靠看書所不能學到的。參考文獻[1]BenjaminNLee,Wen-YenChen,EdwardY.Chang.Fotofiti:WebServiceforPhotoManagement[J].MM’06,October23–27,2006,SantaBarbara,California,USA.ACM1595934472/06/0010.[2]艾瑞公司.2006中國網(wǎng)絡相冊研究報告[R].2007．[3]明日科技,王國輝,王毅,王殊宇.Javaweb開發(fā)典型模塊大全[M].人民郵電出版社,2009.[4]明日科技.JavaScript網(wǎng)頁特效范例寶典[J].人民郵電出版社,2007.[5]栗菊民.JavaWeb應用程序設計[M].機械工業(yè)出版社,2007.[6]王曉悅.精通Java:JDK,數(shù)據(jù)庫系統(tǒng)開發(fā)Web開發(fā)[M].人民郵電出版社,2007.[7]崔尚森,張白一.Web應用開發(fā)技術(shù):JSP[M].西安電子科技大學出版社,2007.[8]劉中兵等.精通Tomcat:JavaWeb應用開發(fā),框架分析與組件配置,系統(tǒng)集成與案例實戰(zhàn)[M].清華大學出版社,2007.[9]明日科技,劉彬彬,馬文強.Eclipse應用開發(fā)完全手冊[M].人民郵電出版社,2007.[10]四維科技,葉達峰.Eclipse編程技術(shù)與實例[M].人民郵電出版社,2006.[11]張云濤.eclipse精要與高級開發(fā)技術(shù)——java技術(shù)大系.[M].電子工業(yè)出版社,2005.[12]楊敏,王英華.DreamweaverCS3中文版從新手到高手[M].清華大學出版社,2009.[13]馬威.DreamweaverCS3網(wǎng)頁制作[M].清華大學出版社,2009.致謝在本系統(tǒng)的設計實現(xiàn)和論文撰寫過程中，需要感謝很多為本課題實現(xiàn)提供支持和幫助的人。首先，我要感謝我的指導老師——高媛老師。感謝她在整個系統(tǒng)的設計實現(xiàn)過程中對我的督促，為我講解課題的要點，并在設計思路上給予點撥。其次，我要感謝我的同學——劉勝美。在我遇到問題時給予的耐心而細致的解答；感謝她在我的系統(tǒng)設計實現(xiàn)過程中給予的細致的指導和幫助，我與她討論相關(guān)功能，她為我指出設計中存在的問題并協(xié)助我完成設計，她的認真細致給我留下了深刻的印象。還要感謝我的同學——郭淑娟、李超陽、齊曉平和趙賞。他們在我遇到問題時給予我無私幫助，讓我快速的解決一個又一個難題。最后，我還要感謝poco網(wǎng)站給予我參照，讓我在沒思路的時候可以仿照其實現(xiàn)功能。原本是以它為原型設計的，只是由于本人時間、能力和經(jīng)驗有限，只能實現(xiàn)其基本功能。總之，要感謝所有在我完成設計的過程中給予過我?guī)椭睦蠋熂巴瑢W，感謝他們的熱情幫助和大力的支持，在此表達我最衷心的感謝?；贑8051F單片機直流電動機反饋控制系統(tǒng)的設計與研究基于單片機的嵌入式Web服務器的研究MOTOROLA單片機MC68HC（8）05PV8/A內(nèi)嵌EEPROM的工藝和制程方法及對良率的影響研究基于模糊控制的電阻釬焊單片機溫度控制系統(tǒng)的研制基于MCS-51系列單片機的通用控制模塊的研究基于單片機實現(xiàn)的供暖系統(tǒng)最佳啟停自校正（STR）調(diào)節(jié)器單片機控制的二級倒立擺系統(tǒng)的研究基于增強型51系列單片機的TCP/IP協(xié)議棧的實現(xiàn)基于單片機的蓄電池自動監(jiān)測系統(tǒng)基于32位嵌入式單片機系統(tǒng)的圖像采集與處理技術(shù)的研究基于單片機的作物營養(yǎng)診斷專家系統(tǒng)的研究基于單片機的交流伺服電機運動控制系統(tǒng)研究與開發(fā)基于單片機的泵管內(nèi)壁硬度測試儀的研制基于單片機的自動找平控制系統(tǒng)研究基于C8051F040單片機的嵌入式系統(tǒng)開發(fā)基于單片機的液壓動力系統(tǒng)狀態(tài)監(jiān)測儀開發(fā)模糊Smith智能控制方法的研究及其單片機實現(xiàn)一種基于單片機的軸快流CO〈,2〉激光器的手持控制面板的研制基于雙單片機沖床數(shù)控系統(tǒng)的研究基于CYGNAL單片機的在線間歇式濁度儀的研制基于單片機的噴油泵試驗臺控制器的研制基于單片機的軟起動器的研究和設計基于單片機控制的高速快走絲電火花線切割機床短循環(huán)走絲方式研究基于單片機的機電產(chǎn)品控制系統(tǒng)開發(fā)基于PIC單片機的智能手機充電器基于單片機的實時內(nèi)核設計及其應用研究基于單片機的遠程抄表系統(tǒng)的設計與研究基于單片機的煙氣二氧化硫濃度檢測儀的研制基于微型光譜儀的單片機系統(tǒng)單片機系統(tǒng)軟件構(gòu)件開發(fā)的技術(shù)研究基于單片機的液體點滴速度自動檢測儀的研制基于單片機系統(tǒng)的多功能溫度測量儀的研制基于PIC單片機的電能采集終端的設計和應用基于單片機的光纖光柵解調(diào)儀的研制氣壓式線性摩擦焊機單片機控制系統(tǒng)的研制基于單片機的數(shù)字磁通門傳感器基于單片機的旋轉(zhuǎn)變壓器-數(shù)字轉(zhuǎn)換器的研究基于單片機的光纖Bragg光柵解調(diào)系統(tǒng)的研究單片機控制的便攜式多功能乳腺治療儀的研制基于C8051F020單片機的多生理信號檢測儀基于單片機的電機運動控制系統(tǒng)設計Pico專用單片機核的可測性設計研究基于MCS-51單片機的熱量計基于雙單片機的智能遙測微型氣象站MCS-51單片機構(gòu)建機器人的實踐研究基于單片機的輪軌力檢測基于單片機的GPS定位儀的研究與實現(xiàn)基于單片機的電液伺服控制系統(tǒng)用于單片機系統(tǒng)的MMC卡文件系統(tǒng)研制基于單片機的時控和計數(shù)系統(tǒng)性能優(yōu)化的研究基于單片機和CPLD的粗光柵位移測量系統(tǒng)研究單片機控制的后備式方波UPS提升高職學生單片機應用能力的探究基于單片機控制的自動低頻減載裝置研究基于單片機控制的水下焊接電源的研究基于單片機的多通道數(shù)據(jù)采集系統(tǒng)基于uPSD3234單片機的氚表面污染測量儀的研制基于單片機的紅外測油儀的研究96系列單片機仿真器研究與設計基于單片機的單晶金剛石刀具刃磨設備的數(shù)控改造基于單片機的溫度智能控制系統(tǒng)的設計與實現(xiàn)基于MSP430單片機的電梯門機控制器的研制基于單片機的氣體測漏儀的研究基于三菱M16C/6N系列單片機的CAN/USB協(xié)議轉(zhuǎn)換器基于單片機和DSP的變壓器油色譜在線監(jiān)測技術(shù)研究基于單片機的膛壁溫度報警系統(tǒng)設計基于AVR單片機的低壓無功補償控制器的設計基于單片機船舶電力推進電機監(jiān)測系統(tǒng)基于單片機網(wǎng)絡的振動信號的采集系統(tǒng)基于單片機的大容量數(shù)據(jù)存儲技術(shù)的應用研究基于單片機的疊圖機研究與教學方法實踐基于單片機嵌入式Web服務器技術(shù)的研究及實現(xiàn)基于AT89S52單片機的通用數(shù)據(jù)采集系統(tǒng)基于單片機的多道脈沖幅度分析儀研究機器人旋轉(zhuǎn)電弧傳感角焊縫跟蹤單片機控制系統(tǒng)基于單片機的控制系統(tǒng)在PLC虛擬教學實驗中的應用研究基于單片機系統(tǒng)的網(wǎng)絡通信研究與應用基于PIC16F877單片機的莫爾斯碼自動譯碼系統(tǒng)設計與研究基于單片機的模糊控制器在工業(yè)電阻爐上的應用研究基于雙單片機沖床數(shù)控系統(tǒng)的研究與