動漫社區(qū)網站設計和實現網絡工程專業(yè)

《動漫社區(qū)網站設計和實現網絡工程專業(yè)》由會員分享，可在線閱讀，更多相關《動漫社區(qū)網站設計和實現網絡工程專業(yè)（37頁珍藏版）》請在裝配圖網上搜索。

1、 動漫社區(qū)網站設計與實現動漫社區(qū)網站設計摘 要本動漫社區(qū)網站共有用戶登錄注冊板塊，動漫資訊推送功能板塊，視頻播放功能板塊，用戶評論區(qū)功能板塊，視頻搜索功能板塊，用戶個人空間功能板塊等六大板塊。用戶登錄注冊模塊實現了網站用戶的信息管理；動漫資訊推送功能模塊方便用戶獲取最新最熱的動漫資訊，并可選擇自己喜愛的資訊種類；視頻播放功能模塊是網站的核心功能之一，用戶可以方便快捷的觀看視頻；用戶評論區(qū)功能模塊既能使得用戶在觀看完視頻后作出自己的評價也可以看到其他用戶的評價，并作出收藏視頻，對視頻點贊，關注UP主等一系列操作；視頻搜索功能模塊使得用戶可以更為自由的獲取自己喜愛的視頻，用戶可以通過關鍵字查詢在各

2、種視頻分類中獲取自己想要觀看的動漫視頻；用戶個人空間功能模塊，用戶可以進入自己的個人空間，發(fā)表自己的日常動態(tài)，并管理自己的關注區(qū)，收藏區(qū)以及投稿區(qū)等。本網站界面設計注重頁面架構，交互方式，視覺布局等的一致性，給予用戶簡單方便且實用的操作空間。本網站設計綜合了當前國內具有一些代表性的動漫視頻網站的用戶需求及相關功能，可以較好的滿足普通用戶對視頻網站的功能需求。關鍵詞：動漫網站 H5 PHPThe Design of Animation community websiteAbstractThe animation community website includes six modules: a

3、user login registration module，Animation information push module，Video playback module，User comment module，Video search function module，User personal space function module. The user registration module is used to manage the information of the website user； Push module for anime information allows us

4、ers to access the latest and hottest animation information and choose their favorite types of information. Video playback module is one of the core functions of the site, users can quickly and easily watch videos；User comment module allows users to watch videos after making their own evaluation and

5、look through evaluations from other users. and users can also put video link to their collection area, give the video a praise, concern about the UP users.；The video search module allows users to get their favorite videos more freely, users can get these video that they want to watch by querying in

6、a variety of video categories using keyword.；User personal space module allows user to enter their own personal space, publish their daily activities, and manage their own areas they concern about, collection area and submission area etc. The interface design of this website focus on the page struct

7、ure and interactive mode，Visual layout and so o, which can give users a simple, convenient and practical operating space. This website design combines some representative functions from other animation video , and can meet functional requirements which user want.Key Words: Anime website H5 PHP目 錄摘 要

8、IAbstractII目 錄III圖清單V表清單VI1 概述11.1 課題研究背景及意義11.2 國內外研究狀況以及現發(fā)展水平11.3項目創(chuàng)新點21.4開發(fā)環(huán)境31.5 本章小結32 可行性研究42.1 技術可行性分析42.3 操作可行性分析52.4 環(huán)境可行性分析53 需求分析63.1用戶角色分析63.2功能板塊劃分63.3數據流圖及流程圖73.4數據字典93.5本章小結104 概要設計114.1模塊層次圖114.2子系統(tǒng)功能模塊114.3數據庫概念結構設計124.4數據庫表設計155 詳細設計195.1概述195.2登錄注冊模塊205.3資訊推送模塊215.4視頻播放模塊225.5用戶評論

9、模塊245.6視頻搜索模塊255.7個人空間模塊266 結論27參考文獻29致謝31圖清單圖序號圖名稱頁碼圖3-1系統(tǒng)總流程圖7圖3-2網站設計頂層數據流圖8圖3-3用戶功能設計流圖8圖3-4網站管理員功能數據流圖8圖4-1總系統(tǒng)層次圖11圖4-2用戶子系統(tǒng)層次圖12圖4-3管理員總系統(tǒng)層次圖12圖4-4網站用戶實體屬性圖13圖4-5網站管理員屬性圖13圖4-6視頻實體屬性圖14圖4-7評論實體屬性圖14圖4-8日志實體屬性圖15圖4-9收藏實體屬性圖15圖4-10關注實體屬性圖15圖5-1用戶注冊界面20圖5-2用戶登陸界面20圖5-3網站主界面21圖5-4網站主界面22圖5-5視頻播放界面

10、23圖5-6視頻播放界面23圖5-7用戶評論界面24圖5-8視頻搜索界面25圖5-9個人空間界面26表清單表序號表名稱頁碼表4.1視頻表16表4.2推送表16表4.3關注表17表 4.4空間表17表 4.5 收藏表17表 4.6投稿表18表 4.7用戶表18表 4.8管理員表18表 4.9 關注表19表 4.10點贊表19表 4.11收藏表19表 4.12評論表19301 概述動漫文化是視覺時代的重要文化形態(tài)之一，它是21世紀人文快速發(fā)展下科技、藝術、思想的高度融合。一部令人津津樂道的動漫，它的畫面，音樂，內容大都是深入人心的。恰如宮崎駿老師的天空之城。像大多數的80后甚至90后小的時候接觸動

11、漫往往是通過觀看電視節(jié)目和光盤。由于電腦和網絡在我國的普及程度度越來越高，人們可以更快更好的從因特網上獲取到自己想要看到的視頻。為了跟隨潮流，動漫文化自然也應當與互聯(lián)網向結合。這樣，可以進入更多人的視野也更易被獲取。動漫文化類型的網站自然應運而生。1.1 課題研究背景及意義目前網絡上已經有如天涯、知乎、微博、百度貼吧之類的平臺供人們交流討論著社會上的種種，也有如嗶哩嗶哩、ACFUN這樣的年輕人文化娛樂社區(qū)。但少有專為動漫文化愛好者、動漫產業(yè)者提供的雙向交流平臺。本課題則基于此需求，擬設計一個動漫社區(qū)網站，為廣大動漫人士提供最新的動漫資訊以及動漫文化思想碰撞的平臺。動漫社區(qū)網站可以加深大家對動漫

12、文化的了解，促進動漫文化的發(fā)展，推進動漫產業(yè)的進步和升級。在國家機器的政策推動下，隨著我國動漫產業(yè)整體開花的局面變好，之類的網站將受到更多人的歡迎，創(chuàng)造更多的經濟和文化價值。于我個人而言，我本身是個動漫文化愛好者，能完成這類網站的設計和實現對于我而言是一件十分愉悅的事。不僅如此，這次獨立自主的完成設計開發(fā)，也讓我深切體會到了書本上所提到的軟件項目開發(fā)的種種問題，加深了項目開發(fā)的認知。當然，編碼技巧上也有了極大的提升，對于如何提高自己的編碼質量有了一定的明悟。1.2 國內外研究狀況以及現發(fā)展水平歐美動漫產業(yè)發(fā)展已經有100多年的歷史，歐美的動漫文化中有著許多出色且深入人心的動漫主題人物諸如米老鼠

13、，唐老鴨，湯姆貓等。其二，歐美國家的互聯(lián)網產業(yè)的發(fā)展和普及也領先國內?；谏鲜龅膬蓚€原因，歐美國家產生了具有大量優(yōu)秀的動漫主題網站。舉個例子，迪士尼網站就是個非常成熟的以動漫為主題的網站。隨著迪士尼產業(yè)的升級和擴大，迪士尼網站已經不單單局限于視頻播放，更是涵蓋了線上活動，新聞，信息，購物，比賽等諸多功能。在成為一個成功的商業(yè)化動漫文化主題網站前進了好幾步。是一個非常好的范例。除了商業(yè)化用途，也有其他優(yōu)秀的貫徹推廣動漫文化的視頻網站。如知名的AnimeFreak TV網站，是一個可以在線觀看動漫電影，劇集的免費視頻網站，動漫視頻資源極其豐富。如果說AnimeFreak TV網站代表著動漫視頻網站

14、的橫向發(fā)展中佼佼者的話，那么蓋亞互動網站就是縱向發(fā)展的領軍者?，F如今的蓋亞互動網站已經演變成了一個在線社區(qū)網站。蓋亞互動將游戲世界，虛擬世界，“論壇論劍”，社交網絡等等融合到了一起，是一個起于動漫文化，又將動漫文化帶到更多更深的地方的一個網站。反觀國內動漫文化方興未艾。繼前年的大圣歸來上映數月內斬獲9.56億票房，一舉創(chuàng)下我國國產動漫產業(yè)票房的紀錄后，去年7月上映的大魚海棠，首日票房便已經突破了7460萬元，再次刷新了國產動漫產業(yè)票房?！皣团d”的種子正在逐漸發(fā)芽，越來越多的人試著去接受動漫文化，感受動漫文化的魅力，享受觀看動漫帶來的那份喜悅。隨著時下我國的互聯(lián)網產業(yè)高速發(fā)展，“互聯(lián)網+”概

15、念的提出。國內早先涌現的已動漫文化為主體的視頻網站也變得越來越火熱。諸如，嗶哩嗶哩，AcFun等網站。但相較之下還是略顯匱乏，一些動漫視頻網站的制度也存在一定的缺陷。不僅如此，因為越來越多的人涌入ACG網站，也引起了網站的整體用戶素質水平下滑。新舊用戶之間的價值觀問題以及年齡差異帶來的交流問題等等日漸浮現。如何更好的解決無謂的爭端，營造良性的網站交流氛圍，國內的ACG網站還有不短的一段路要走。文化差異問題是一個任何以某文化為中心的網站都要面對的問題，是根的問題。國內的ACG網站只能一邊解決這個問題，一邊緩步的發(fā)展更多的網站功能?？偨Y下來，盡管國外的動漫網站相對成熟完善，但國內的動漫網站正在不斷

16、的發(fā)展，正在逐步形成具有中國特色動漫文化的主題網站。1.3 項目創(chuàng)新點本課題采用HTML5中新的多媒體元素如視頻標簽來設計動漫視頻播放板塊。采用了AJAX這種交互性強的Web應用程序技術，可以在不重載頁面的情況下與Web服務器交換數據，即在不需要刷新頁面的情況下，就可以產生局部刷新的效果，更小、更快、更友好。該網站將通過H5、CSS3、原生JS、相關插件等工具將各模塊更緊密的銜接在一起，在頁面上力求簡潔與美觀并重，各模塊分工明確、細致，減少各種bug的出現。而在功能上。本課題不止是如傳統(tǒng)的觀影，人與動漫的“交融”，亦著重于人與人的交流。在這里，受眾與受眾的交流，受眾與動漫方的交流，動漫產業(yè)之間

17、的競爭和合作也可以體現。1.4 開發(fā)環(huán)境Sublime Text 3Sublime Text 3 是時下H5網站及App開發(fā)的先進的文本編輯器。最初的Sublime Text是在2008年1月份由程序員Jon Skinner開發(fā)出來的。Sublime Text 3不僅具有漂亮，簡介，易操作的界面，還向用戶提供了許多強大的功能。Sublime Text 3的主要功能包括多選擇，多窗口，自定義鍵綁定，代碼縮略圖，即時項目轉換等。Sublime Text 3是一個跨平臺的編輯器，同時支持多個操作系統(tǒng)，是項目開發(fā)的強有力的工具。Navicat for MySqlNavicat for MySql是一款

18、強大的數據庫管理，開發(fā)及維護的專為MySql設計的軟件開發(fā)工具。Navicat for MySql在某種意義上可以稱為前端開發(fā)軟件，它不僅功能齊備包含觸發(fā)器，存儲過程，檢索，函數，事件等，還提供了直觀而強大的圖形界面。Navicat for MySql的出現，大大降低了軟件開發(fā)的成本，提高了開發(fā)的效率，一定程度上解放了PHP，J2EE等開發(fā)程序員的大腦。1.5 本章小結本章節(jié)主要是對網站設計與實現的初步階段的簡要介紹，對網站開發(fā)的背景，意義及國內外的發(fā)展狀況做出了一定的闡述。此階段可以使我們更加明確課題研究開發(fā)的方向，方法。2 可行性研究2.1 技術可行性分析本網站是使用成熟的H5技術合集來搭

19、建網站頁面和功能模塊。使用目前廣受歡迎的前端框架Bootstrap來架構頁面，并且完成部分頁面功能。采用AngularJS負責構建部分頁面應用程序。使用AJAX+PHP+MySql三者聯(lián)結的方式完成前端與數據庫的信息交互，不僅節(jié)約帶寬，還可以減輕服務器壓力，將一些簡單的功能運算移交到客戶端。本網站設計關鍵技術簡介如2.2.1，2.2.2及2.2.3所示。2.2.1 JavaScriptJS在最初被創(chuàng)造的時候，本意是希望其能夠如java一般，人們比較中意的是語言當中的函數式?？墒亲詈笸瓿傻臅r候，就函數腳本語言的風格角度而言，JS更類似于C語言的風格。就發(fā)展到目前而言，JS是時下所有主流瀏覽器唯一

20、支持的腳本語言2。而體現在本網站的開發(fā)設計中，JS的作用就是網站可以在一些情況下不與服務器產生數據交流而能動態(tài)的改變我們網站的頁面內容也就是DOM。2.2.2 H5在這里需要明確一點，本文中說的H5不等于HTML5.HTML5是一個目前網絡上應用的最新的也最為廣泛的超文本標記語言。本文的H5實際指的是一個web網站開發(fā)技術合集，當然，在現實工作中也可被理解為一類產品。而體現在本網站的開發(fā)設計中，H5的主要作用就是通過使用其中的與多媒體特性相關的技術也可以說是標簽來替代Adobe Flash。2.2.3 PHP在本網站開發(fā)中PHP并未有過多復雜的算法邏輯，也沒有使用PHP相關框架。本網站主要通過

21、Ajax+PHP+MySql三方聯(lián)動配合的方式來完成前后端的數據交互，體現網站的動態(tài)運行。 2.2經濟可行性分析隨著動漫產業(yè)在我國的飛速發(fā)展，借助互聯(lián)網這個平臺。本類網站足可以吸引到足夠的受眾。由此，無論是視頻會員機制或是廣告位機制等一系列時下視頻網站獲取經濟利益的方式在足夠的受眾群支持下都可以逐步實行。不僅如此，隨著網站的運營和升級還可以不斷的融入新的元素，諸如線上線下活動，網上購物，虛擬世界，游戲競技等等。在互聯(lián)網流量，廣告變現，個性化服務等一系列增值服務的盈利模式下，去除視頻版權費支出，網站運營升級支出，網站依然可以獲得不俗的盈利。2.3 操作可行性分析本網站的頁面提示較為豐富，導航欄，

22、標題，按鈕等頁面元素命名貼近功能本意。頁面的操作簡單，快捷，方便。用戶可以根據頁面的提示和相關小功能即便不使用用戶手冊也能對頁面進行相關許可內的操作。所以本網站具備操作可行性。2.4 環(huán)境可行性分析該站點開發(fā)及測試環(huán)境為Windows 10，谷歌瀏覽器，Sublime Text3，Navicat for MySQL，WampServer64開發(fā)成功并測試成功。本網站具備一定的環(huán)境可行性。3 需求分析3.1用戶角色分析根據網站設計需求規(guī)劃，系統(tǒng)用戶主要分為兩種角色：網站用戶，網站管理員。網站用戶可以在網站進行注冊登錄。用戶登入網站后可以瀏覽不同種類的動漫視頻，獲取網站最新的推送視頻資源。用戶在觀

23、看完視頻后還可以做出點贊，收藏，關注UP主，評論視頻等操作。用戶擁有屬于自己的個人空間，可以在個人空間里發(fā)表日志，查看收藏視頻，查看關注UP主，查看自己的投稿等。網站管理員主要負責日常的網站運營維護等工作。網站管理員需要審核用戶的視頻投稿，在確認視頻沒有違法違紀的內容后將視頻加入網站視頻庫。3.2功能板塊劃分本網站的功能模塊大致分為六個部分。六個功能模塊分別是用戶登錄注冊模塊，動漫資訊推送功能板塊，視頻播放功能板塊，用戶評論區(qū)功能板塊，視頻搜索功能板塊，用戶個人空間功能板塊等。3.2.1網站用戶系統(tǒng)網站用戶功能模塊主要分為：登錄注冊，獲取推送，觀看視頻，發(fā)表評論，搜索視頻，發(fā)表日志，進行投稿等

24、。(1） 登錄注冊用戶注冊賬號，設置個人id。(2） 獲取推送用戶在瀏覽網站頁面內容時，可以根據頁面提示獲取網站推送的視頻資源。(3） 觀看視頻用戶可以觀看自己喜愛的視頻資源。(4） 發(fā)表評論用戶可以在觀看完視頻后作出自己的評論，發(fā)表感想。(5） 搜索視頻用戶可以通過視頻名字的關鍵字查詢視頻，獲取視頻資源。(6） 發(fā)表日志用戶擁有自己的個人空間并可以在自己的個人空間里發(fā)表日志。(7） 進行投稿用戶可以制作或搬運視頻通過網站提供的方法進行視頻投稿。3.2.2管理員系統(tǒng)網站管理員主要負責網站的日常運營維護以及審核投稿，更新視頻庫。管理員需要在確認視頻投稿中沒有違法違紀的內容之后才可以將視頻更新進數

25、據庫。3.3數據流圖及流程圖（1） 網站設計系統(tǒng)總流程圖如圖3-1所示 圖3-1系統(tǒng)總流程圖（2）網站設計頂層數據流圖 圖3-2網站設計頂層數據流圖（3）用戶功能數據流圖如圖3-3所示 圖3-3用戶功能數據流圖（4）網站管理員功能數據流圖如圖3-4所示 圖3-4網站管理員功能數據流圖3.4數據字典主要的數據字典如圖3-5所示：名字：身份信息別名：用戶，管理員描述：網站管理員以及網站用戶的賬號，名稱以及密碼定義：身份信息用戶信息+管理員信息名字：視頻信息別名：無描述：用戶觀看視頻，點贊，收藏，關注以及評論。定義：視頻信息視頻源地址+視頻播放量+視頻點贊量+視頻收藏量+視頻評論名字：空間信息別名：

26、個人空間描述：用戶進入自己的個人空間，發(fā)表日志，查看收藏，關注以及投稿定義：空間信息日志信息+收藏+關注+投稿+基礎信息名字：視頻搜索別名：關鍵字查找描述：用戶根據相關視頻名中的關鍵字在數據庫中索引查找自己喜愛的視頻 定義：視頻搜索=關鍵字+數據庫查找名字：視頻推送別名：獲取更多描述：用戶根據頁面提示按鈕刷新推送視頻的信息定義：視頻推送=頁面提示+數據庫推送3.5本章小結本章對網站的需求進行了詳細的分析，明確了開發(fā)網站所需用戶種類以及每一類用戶所需求的功能模塊，確認了網站設計所需要劃分出的子系統(tǒng)。最后對網站開發(fā)所需要的數據流圖以及數據字典做出了詳細的設計和分析介紹。4 概要設計4.1模塊層次圖

27、動漫社區(qū)網站主要分為兩個子系統(tǒng)：網站用戶子系統(tǒng)，網站管理員子系統(tǒng)。整個動漫社區(qū)網站的系統(tǒng)功能模塊如圖4-1所示。 圖4-1總系統(tǒng)層次圖4.2子系統(tǒng)功能模塊（1）網站用戶子系統(tǒng)網站用戶子系統(tǒng)的主要登錄的是一般的網站用戶。用戶在登入后可以通過頁面提示來瀏覽推送視頻信息，觀看視頻，發(fā)表評論，關鍵字搜索相關視頻以及進入個人空間進行一些操作等。如圖4-2所示。 圖4-2用戶子系統(tǒng)層次圖（2）管理員子系統(tǒng)管理員子系統(tǒng)的主要登錄對象是網站管理員。網站管理員除了需要對網站進行一些日常的運維操作之外還要審核用戶的投稿視頻。當網站管理員確認視頻中沒有違法違紀的內容后，管理員會將視頻更新進網站視頻庫，如圖4-3所示

28、。 圖4-3管理員子系統(tǒng)層次圖4.3數據庫概念結構設計本網站的實體主要有網站用戶實體，網站管理員實體，視頻實體，評論實體，日志實體，收藏實體，關注實體，投稿實體等（1）網站用戶實體屬性圖，用戶實體由登錄郵箱，日志，收藏，登錄密碼，關注，用戶昵稱，用戶頭像，投稿組成。如圖4-4所示。 圖4-4網站用戶實體屬性圖 （2）網站管理員屬性圖，網站管理員主要有三個屬性，管理員昵稱，郵箱以及管理員登錄的密碼等。如圖4-5所示。 圖4-5網站管理員實體屬性圖 （3）視頻實體屬性圖，視頻實體由UP主，簡圖，評論，點贊，收藏，簡介，名稱以及播放組成。如圖4-6所示。 圖4-6視頻實體屬性圖（4）評論實體屬性圖，

29、評論實體共有用戶頭像，用戶，點贊，評論信息以及發(fā)表時間組成。如圖4-7所示。 圖4-7評論實體屬性圖（5）日志實體屬性圖，日志實體由用戶頭像，用戶，評論信息，發(fā)表時間，點贊組成。如圖4-8所示。 圖4-8日志實體屬性圖（6）收藏實體屬性圖，收藏實體由視頻名，簡介，視頻源組成。如圖4-9所示。 圖4-9收藏實體屬性圖（7）關注實體屬性圖，關注實體由UP名，簡介，鏈接組成如圖4-10所示。 圖4-10關注實體屬性圖4.4數據庫表設計根據以上章節(jié)的介紹，設計數據庫及表如下所示。（1）動畫視頻庫視頻表視頻表主要用于存儲視頻庫中的視頻信息，網站用戶可以通過關鍵字查找功能在視頻庫中找到自己喜愛的視頻。tu

30、表示視頻封面圖，up表示該視頻的投稿人，name表示視頻名稱，bf表示視頻表量，dz表示視頻點贊量。如表4.1所示。表4.1 視頻表字段名數據類型長度備注tuupnamebfdz varcharvarcharvarcharvarcharvarchar3232323232NOT NULL(Key)NOT NULL NOT NULL NOT NULLNOT NULL （2）娛樂區(qū)視頻推送庫視頻表娛樂區(qū)視頻推送庫視頻表主要用于用戶通過頁面提示，如點擊按鈕等來獲取新的視頻源。UP表示視頻投稿人，browse表示播放量，praise表示視頻點贊量，link表示視頻源地址，pic表示視頻封面圖，title

31、表示視頻標題。如表4.2所示。表 4.2 推送表字段名數據類型長度備注UPbrowsepraiselinkpic titlevarcharvarcharvarcharvarcharvarcharvarchar323232323232NOT NULL (Key)NOT NULLNOT NULL NOT NULL NOT NULL NOT NULL（3）用戶個人空間庫及各個表用戶個人空間庫由用戶昵稱命名，建有四個表。四個表分別為關注表，空間表，收藏表以及投稿表等。關注表用于顯示用戶所關注UP的信息。tu表示所關注UP主的頭像，name表示所關注up主昵稱，content表示該up的簡介。如表4.3

32、所示。表 4.3 關注表字段名數據類型長度備注tunamecontentvarcharvarcharvarchar323232NOT NULLNOT NULL (Key)NOT NULL空間表用于記錄用戶所發(fā)表的日志。pic表示所關注UP主的頭像，name表示所關注up主昵稱，pl表示該up的日志，dz表示點贊量，sj表示日志發(fā)表時間。如表4.4所示。表 4.4 空間表字段名數據類型長度備注picnamepldzsjvarcharvarcharvarcharvarcharvarchar3232323232NOT NULLNOT NULLNOT NULLNOT NULLNOT NULL (Key

33、)收藏表用于記錄用戶所收藏的視頻信息。tu表示所收藏的視頻的封面，name表示所關注up主昵稱，content表示所收藏的視頻的簡介。如表4.5所示。表 4.5 收藏表字段名數據類型長度備注tunamecontentvarcharvarcharvarchar323232NOT NULLNOT NULL (Key)NOT NULL投稿表用于記錄用戶的投稿的信息。tu表示用戶投稿的視頻的封面，name表示投稿視頻的名稱，content表示用戶投稿視頻的簡介。如表4.6所示。表 4.6 投稿表字段名數據類型長度備注tunamecontentvarcharvarcharvarchar323232NOT

34、 NULLNOT NULL (Key)NOT NULL（4）用戶數據庫用戶表用戶數據庫用戶表主要用于記錄用戶的注冊信息。name表示用戶昵稱，user表示用戶郵箱，password表示用戶密碼，pic表示用戶頭像。如表4.7所示。表 4.7 用戶表字段名數據類型長度備注nameuserpasswordpicvarcharvarcharvarcharvarchar32323232NOT NULL(Key)NOT NULL(Key)NOT NULLNOT NULL（5） 管理員表網站管理員數據庫網站管理員表主要負責記錄網站運維人員的ID，密碼以及郵箱賬號。name表示管理員名稱，user表示管理員

35、郵箱，password表示管理員密碼，pic表示管理員頭像。如表4.8所示。表 4.8 管理員表字段名數據類型長度備注nameuserpasswordpicvarcharvarcharvarcharvarchar32323232NOT NULL(Key)NOT NULL(Key)NOT NULLNOT NULL（6）具體視頻數據庫本站對每一個視頻均設有相關的數據庫。數據庫中建有四個表，分別為評論表，關注表，點贊表以及收藏表等。關注表用以記錄關注投稿UP的用戶，點贊表用以記錄對視頻點贊的用戶，收藏表用以記錄收藏視頻的用戶，評論表用以記錄用戶觀看視頻后的感想。四表如下。表 4.9 關注表字段名數據

36、類型長度備注namevarchar32NOT NULL(Key)表 4.10 點贊表字段名數據類型長度備注namevarchar32NOT NULL(Key)表 4.11 收藏表字段名數據類型長度備注namevarchar32NOT NULL(Key)表 4.12 評論表字段名數據類型長度備注picnamepldzsjvarcharvarcharvarcharvarcharvarchar3232323232NOT NULLNOT NULLNOT NULLNOT NULLNOT NULL (Key)5 詳細設計5.1概述本網站使用Sublime Text 3 作為主要開發(fā)工具，使用H5相關技術完

37、成前端設計，使用Ajax和PHP完成前后臺數據庫數據交流，使用Mysql存儲數據。5.2登錄注冊模塊登陸注冊界面如下圖5-1，5-2所示 圖5-1用戶注冊界面 圖5-2用戶登陸界面 在注冊頁面中，用戶可以在頁面使用自己的郵箱地址創(chuàng)建自己的賬號密碼并且注冊自己的獨有昵稱。注冊成功后，用戶可以在登陸頁面輸入郵箱賬號和密碼經后臺驗證無誤后進入主頁面。部分代碼如下。 mysqli_select_db($con,$BB); mysqli_query($con,set names utf8); $res = mysqli_query($con,select name from usersinfo); wh

38、ile ($row = mysqli_fetch_array($res) if ($rowname = $User) $AA = 1; echo $AA; 5.3資訊推送模塊網站主頁面如下圖5-3，5-4所示。 圖5-3網站主界面 圖5-4網站主界面用戶進入網站頁面后可以看到豐富的視頻推送信息。用戶可以通過鏈接進入動畫，娛樂，文章，音樂，游戲，動漫商們等各個頁面瀏覽網站推送。此外，用戶可以點擊“換一批”按鈕來更新推送，獲取其他的推送視頻。部分代碼如下$res=mysqli_query($con,select UP,browse,praise,link,pic,title from more);

39、 $data1 =array(); $res = mysqli_query($con,select UP from more); while ($row = mysqli_fetch_array($res) $data1 = $rowUP; 5.4視頻播放模塊視頻播放頁面如下圖5-5，5-6所示。圖5-5視頻播放界面 圖5-6視頻播放界面用戶通過頁面?zhèn)髦垫溄舆M入視頻播放頁面。用戶可以播放視頻，還可以通過提供的按鈕來調節(jié)視頻播放界面。部分代碼如下。 Your browser does not support the video tag. 播放/暫停 大 正常 小 5.5用戶評論模塊用戶評論頁面如

40、下圖5-7所示。圖5-7用戶評論界面用戶可以在觀看完視頻后在播放頁面的下面發(fā)表自己的觀后感言并瀏覽其他用戶的評論。部分代碼如下 發(fā)表 5.6視頻搜索模塊視頻搜索頁面如下圖5-8所示。圖5-8視頻搜索界面用戶可以在頁面商的搜索框輸入關鍵字通過關鍵字查詢進入視頻搜索頁面。在視頻搜索頁面，用戶可以看到在不同視頻分類下的與關鍵字相關的視頻。部分代碼如下。$data1 =array(); $res = mysqli_query($con,select tu from sp where name like %$Key%); while ($row = mysqli_fetch_array($res) $d

41、ata1 = $rowtu; $data2 =array(); $res = mysqli_query($con,select up from sp where name like %$Key%); while ($row = mysqli_fetch_array($res) $data2 = $rowup; 5.7個人空間模塊個人空間頁面如下圖5-9所示。圖5-9個人空間界面用戶可以個人空間中發(fā)表日志以及管理自己的關注區(qū)，收藏區(qū)，投稿區(qū)。部分代碼如下 我的空間 我的關注 我的收藏 我的投稿 6 結論本網站的開發(fā)設計到此可以算是告一段落了。算算時間的話，從開始到結束大概三個月左右。大學四年來學

42、生從老師們身上學到了很多，但是一直沒有抽出一個整段的時間區(qū)花心思做出一個屬于自己的開發(fā)設計。在大四下的最后一個學期，在指導老師細心的教導和指引下，學生也算是完滿的圓了一樁心愿。最初選擇這個課題是出于自己的愛好。學生小的時候就喜愛動漫，而做一個以動漫為主題中心的網站也是因為這個愛好。網站的開發(fā)技術涉及到H5技術合集，PHP，Mysql等。網站的前端設計采用了BooStrap框架結合CSS3與HTML5的方式來設計架構頁面。整體頁面看上去美觀，大方，簡介；網站采用jQuery，AngularJS與原生js結合的方式來完成頁面功能的開發(fā)設計，諸如頁面間的傳值跳轉，注冊登錄的表單驗證以及輪播圖等等；網

43、站采用Ajax，PHP，Mysql三方聯(lián)動的方式進行前端與數據庫之間的數據交流與數據傳值。通過這個三方聯(lián)動的方式可以降低服務器后臺壓力，利用客戶端的閑余能力完成部分網站部分功能。通過這一次完整的設計開發(fā)，也使得我對課堂上老師所講的軟件開發(fā)流程有了更為深刻的理解。代碼的設計完成只是整個過程的一部分，前期的需求分析以及設計也至關重要。需求分析總結的好與壞直接影響了代碼的質量。在之后的開發(fā)工作中，只有更好更全面的理解需求分析以及更好的把握整體思路才能減少開發(fā)過程中的錯誤，提升我們的代碼質量。在軟件開發(fā)過程中，耐心和細心是必不可缺的。要知道軟件開發(fā)過程中總會有各種各樣的問題和麻煩發(fā)生，有時候甚至需要我

44、們大面積的返工，所以，我們需要細心且耐心的去投入軟件的設計與開發(fā)。參考文獻1 Adam Freeman. HTML5權威指南.人民郵電出版社20142 (美)弗拉納根.Javascript權威指南.機械工業(yè)出版社,20073 陸凌牛.HTML 5與CSS 3權威指南.機械工業(yè)出版社，20114 張恩民.PHP開發(fā)實戰(zhàn)權威指南.清華大學出版社,20125 陸汝鈐,金芝,陳剛.面向本體的需求分析J.軟件學報,2000(08)6 周亮.軟件工程的安全檢測與維護D.東南大學,20167 (美)RickD.Craig,(美)StefanP.Jaskiel.系統(tǒng)的軟件測試M.電子工業(yè)出版社 20038 武

45、時龍,宇平安.計算機課程在線考試系統(tǒng)設計J.赤峰學院學報(自然科學版),20159 畢建忠.數據庫新聞網絡傳播新概念J.中國傳媒科技.2001(12) 10 (加) 克尼亞萬.Servlet和JSP學習指南M. 機械工業(yè)出版社, 2013 11 Multi-Fuzzy Complex Nilpotent MatricesJ. Asit Dey,Madhumangal Pal.International Journal of Fuzzy System Applications (IJFSA). 2016(4)12 The induced intuitionistic fuzzy Einstein

46、 aggregation and its application in group decision-makingJ. Yejun Xu,Yuanyuan Li,Huimin Wang.Journal of Industrial and Production Engineering. 2013(1)13 Interval-valued intuitionistic fuzzy multi-criteria decision making based on the generalized Shapley geometric Choquet integralJ. Hao Cheng,Jie Tan

47、g.Journal of Industrial and Production Engineering. 2016(1)14 The structure and value of modularity in software design. Sullivan K J,Griswold W G,Cai Y et al. Proc. the 8th Eu- ropean Software Engineering Conference held jointly with the 9th ACM SIGSOFT International Symposium on Founda- tions of So

48、ftware Engineering . 200115Software engineering: A roadmap. Boehm B W,Sullivan K. Proc. International Conference on Software Engineering . 200016 Runtime recovery and manipulation of software architecture of component-based systemsJ . Gang Huang,Hong Mei,Fu-Qing Yang.Automated Software Engineering .

49、 2006 (2)17 Specification, implementation, and deployment of componentsJ. Ivica Crnkovic,Brahim Hnich,Torsten Jonsson,Zeynep Kiziltan.Communications of the ACM. 2002(10)18 Component-basedsoftware engineeringJ. Ivica Crnkovic,Stig Larsson,Judith Stafford.ACM SIGSOFT Software Engineering Notes. 2002(3

50、)19 Component-based Development Process and Component LifecycleJ. Michel Chaudron,Stig Larsson,Ivica Crnkovic.Journal of Computing and Information Technology. 2005(4) 20 Web-centred end-user component modellingJ. David Lizcano,Fernando Alonso,Javier Soriano,Genoveva Lpez.Future Generation Computer S

51、ystems致謝有句話說得好，只有當失去，才會回首，才會懷念。時光荏苒，大學四年就過去了，這四年里同學們一起學習，一起玩耍。細細想想，大一剛進校門時的情景仿佛還在昨天，那時的大家懵懂而青澀。在指導老師的認真指導下，我完成了這次的畢業(yè)設計，內心喜悅之時也意識到了別離的時刻要到了。這是第二段文字，而我寫完第一段文字是在半小時前。耳朵里塞著耳機聽著課，明明有好多話想說，可落在鍵盤上又總是一次次的刪去重來。不過既然是致謝環(huán)節(jié)，還是先感謝一波，感謝中一些話也就跟著出來了。感謝四年來老師們的教導，老師們是過來人，走過了風風雨雨，見慣了潮起潮落，很多時候都能寬容我們的錯誤我們的懶惰，一遍遍的教導我們。對老師們，我有兩句話，一句對不起，一句感謝您。感謝四年來同學們的陪伴，有你們的陪伴才有我四年來的笑與淚，才有我一步步的成長。不會忘記大家一起壓馬路的時光，不會忘記一起在圖書館刷題的日子，不會忘記省運會五禽操時的一起灑下的汗水，我怎敢忘記大家。對同學們我只想說，感謝一路有你。