音樂網(wǎng)站課程設(shè)計(jì)報(bào)告

1、22第1節(jié) 課程設(shè)計(jì)題目及背景.3 1.1 設(shè)計(jì)題目3 1.2 設(shè)計(jì)背景.3第2節(jié) 網(wǎng)站設(shè)計(jì)的開發(fā)工具3第3節(jié) 網(wǎng)站建設(shè)過程.4 3.1 網(wǎng)站系統(tǒng)分析.43.2 數(shù)據(jù)庫的設(shè)計(jì).53.3 功能模塊介紹.8第4節(jié) 網(wǎng)站工作流程.11 4.1 連接數(shù)據(jù)庫.11 4.2 用戶登錄.12 4.3 歌曲顯示，以最新歌曲為例.12 4.4 音樂搜索.12第5節(jié) 網(wǎng)站顯示效果.15 5.1 網(wǎng)站主頁.15 5.2 歌曲分類頁面.16 5.3 音樂搜索頁面.17 5.4 用戶留言頁面.17 5.5 音樂播放器頁面.185.6 后臺管理主頁面.19 5.7 用戶管理頁面.19第6節(jié) 總結(jié)和設(shè)計(jì)體會.21第1節(jié) 課

2、程設(shè)計(jì)題目及背景 1.1 設(shè)計(jì)題目 構(gòu)架一個(gè)音樂網(wǎng)站，要求網(wǎng)站必須包含音樂網(wǎng)站的一些基本功能，即前臺的用戶申請登陸功能，聽歌功能，音樂搜索，音樂收藏功能，提交留言和后臺的用戶管理，歌曲管理，留言管理，系統(tǒng)管理。 1.2 設(shè)計(jì)背景 在互聯(lián)網(wǎng)發(fā)展迅猛的今天，我們無時(shí)無刻不與網(wǎng)絡(luò)接觸，可以從中查找我們需要的信息，可以發(fā)布想讓別人知道的信息，可以找到你不認(rèn)識但真心的朋友，也可以第一時(shí)間看到國內(nèi)外的重大事件。當(dāng)我們無事可做的時(shí)候，便開始了娛樂方式的搜索，由此，很多音樂網(wǎng)站和視頻網(wǎng)站應(yīng)運(yùn)而生，服務(wù)大家，為我們的生活增添了色彩。隨著我國網(wǎng)民的增加，也促進(jìn)了音樂網(wǎng)站的開發(fā)。第2節(jié) 網(wǎng)站設(shè)計(jì)的開發(fā)工具 2.1

3、dreamweaver 8.0 2.2 flash 8.0 2.3 firework 8.0 2.4 access數(shù)據(jù)庫 2.5 iis服務(wù)器 說明：dreamweaver用于網(wǎng)站的開發(fā)，flash用于網(wǎng)站flash效果的制作，firework對圖片進(jìn)行處理，iis作為我們的asp網(wǎng)站服務(wù)器，數(shù)據(jù)庫則采用微軟的access數(shù)據(jù)庫。第3節(jié) 網(wǎng)站建設(shè)過程3.1 網(wǎng)站系統(tǒng)分析音樂網(wǎng)站包括兩大功能模塊：前臺和后臺。兩大功能模塊又分為很多子模塊。前臺包括動態(tài)顯示歌曲模塊，動態(tài)顯示時(shí)間模塊，用戶登錄與注冊模塊，關(guān)于我們和留言模塊，音樂搜索模塊。后臺包括用戶管理模塊，歌曲管理模塊，留言管理模塊和系統(tǒng)管理模塊

4、。整體模塊組織如下圖所示：音樂網(wǎng)前臺模塊后臺模塊用戶注冊模塊用戶登錄模塊動態(tài)顯示歌曲留言模塊音樂搜索模塊動態(tài)顯示時(shí)間用戶管理模塊歌曲管理模塊留言管理模塊系統(tǒng)管理模塊3.1.1 前臺模塊詳細(xì)功能描述 用戶注冊：用戶注冊自己的空間 用戶登錄：用戶登錄空間查看音樂收藏 動態(tài)顯示歌曲：根據(jù)類別不同，顯示華人歌曲，日韓歌曲，影視歌曲，傷感歌曲，非主流歌曲等等。 動態(tài)時(shí)間：網(wǎng)頁中顯示動態(tài)的時(shí)間 音樂搜索：搜索數(shù)據(jù)庫中包含的歌曲 留言：用戶提交自己的留言3.1.2 后臺模塊詳細(xì)功能描述 用戶管理：顯示和編輯所有用戶信息，歌曲收藏和刪除用戶 歌曲管理：顯示，編輯和插入歌曲信息，刪除歌曲 留言管理：顯示和刪除留

5、言信息 系統(tǒng)管理：修改管理員密碼和網(wǎng)站信息3.2 數(shù)據(jù)庫的設(shè)計(jì) 3.2.1 用戶信息表（users），屬性和內(nèi)容如下表：列名數(shù)據(jù)類型必填字段默認(rèn)值說明userid自動編號是無用戶idusername文本是無用戶名userpassword文本是無密碼mobile文本是無手機(jī)userqq文本是無qqadddate日期/時(shí)間是是注冊日期psw_quesions文本是無密碼提示psw_answer文本是無密碼答案city文本是無所在城市address文本是無地址sex文本是無性別realname文本是無真實(shí)姓名code文本否無郵編useremail文本是無電子郵箱 3.2.2 音樂信息表（music）

6、，屬性和內(nèi)容如下表：列名數(shù)據(jù)類型必填字段默認(rèn)值說明id自動編號是無音樂編號music_name文本是無音樂名稱artist文本是無藝術(shù)家url文本是是音樂文件地址zhuanji文本是無所屬專輯adddate日期/時(shí)間是是添加日期liebie文本是是所屬分類 3.2.3 管理員信息表（admin），屬性和內(nèi)容如下表：列名數(shù)據(jù)類型必填字段默認(rèn)值說明id自動編號是否管理員編號admin文本是否用戶名adminpassword文本是否密碼3.2.4 留言信息表（liuyan），屬性和內(nèi)容如下表：列名數(shù)據(jù)類型必填字段默認(rèn)值說明ly_id自動編號是否留言編號content文本是否留言內(nèi)容connectio

7、n文本是否留言方式addtime日期/時(shí)間是是留言日期 3.2.5 網(wǎng)站信息表（webmess），屬性和內(nèi)容如下表：列名數(shù)據(jù)類型必填字段默認(rèn)值說明shuoming文本是否網(wǎng)站說明web_name文本是否網(wǎng)站名稱web_yuming文本是否網(wǎng)站域名web_key文本是否關(guān)鍵字describle文本是否描述 3.2.6 歌曲收藏表（shoucang），屬性如下表：列名數(shù)據(jù)類型必填字段默認(rèn)值說明s_id自動編號是否收藏編號username文本是否用戶idmusic_name文本是否音樂idadddate日期/時(shí)間是否收藏時(shí)間 3.2.7 用戶-音樂關(guān)系表（sx），屬性如下表:列名數(shù)據(jù)類型必填字段默認(rèn)

8、值說明s_id自動編號是否編號username文本是否用戶名music_name文本是否歌曲名artist文本是否藝術(shù)家url文本是是音樂地址adddate日期/時(shí)間是是添加日期3.3 功能模塊介紹 3.3.1 登陸注冊模塊 該模塊的工作流程圖如下：登陸界面輸入用戶名和密碼賬號或密碼錯(cuò)誤！n注銷用戶修改注冊信息修改成功點(diǎn)擊注冊鏈接y注冊頁面y檢查表單元素填寫注冊信息yn 3.3.2 動態(tài)顯示歌曲模塊歌曲顯示華人歌曲日韓歌曲歐美歌曲影視歌曲樂隊(duì)歌曲dj歌曲流行歌曲傷感歌曲經(jīng)典歌曲網(wǎng)絡(luò)歌曲非主流歌曲根據(jù)數(shù)據(jù)庫中音樂的類別分別綁定數(shù)據(jù)集判斷有無音樂顯示歌曲列表沒有相關(guān)記錄！yn 該模塊流程圖如下：

9、3.3.3 動態(tài)顯示時(shí)間模塊該模塊采用javascript腳本顯示動態(tài)的系統(tǒng)時(shí)間，代碼如下： /動態(tài)時(shí)鐘 3.3.4 音樂搜索模塊 該模塊的工作流程圖如下：音樂搜索判斷數(shù)據(jù)庫中表中是否存在改信息輸入搜索信息y顯示搜索信息n沒有相關(guān)記錄 3.3.5 留言模塊 該模塊的工作流程圖如下：用戶留言檢查合法性輸入留言信息y提交到數(shù)據(jù)庫n輸入內(nèi)容有誤！ 3.3.6 后臺管理該模塊的工作流程圖如下：后臺管理判斷賬號和密碼正確性y賬號或密碼錯(cuò)誤！n輸入管理員賬號和密碼查看歌曲信息查看用戶信息查看留言信息修改管理員密碼刪除成功！刪除用戶yn刪除歌曲yn添加歌曲輸入歌曲信息檢查表單刪除成功！添加成功！yn刪除成功

10、！刪除留言yn輸入舊密碼輸入新密碼是否正確n檢查表單修改成功！yyn第4節(jié) 網(wǎng)站工作流程 4.1 連接數(shù)據(jù)庫 4.1.1 創(chuàng)建odbc數(shù)據(jù)源 管理工具數(shù)據(jù)源odbc系統(tǒng)dsn打開odbc microsoft access安裝，數(shù)據(jù)源名conn，選擇數(shù)據(jù)庫文件，確定。 4.1.2 連接數(shù)據(jù)庫文件（如下圖） 4.2 用戶登錄 包括3個(gè)頁面：login.asp,loginfo.asp和loginerr.asp,通過添加服務(wù)器行為的登陸用戶行為即可。登陸成功如圖：4.3 歌曲顯示，以最新歌曲為例 4.3.1 做出最新歌曲顯示頁面，如下： 4.3.2 綁定記錄集 添加服務(wù)器行為中的添加記錄集，打開下圖記

11、錄集節(jié)目，正確填寫各項(xiàng)，華人歌曲和日韓歌曲等頁面只是篩選或排序不同而已。此頁面的記錄集如下： 4.3.3 添加重復(fù)區(qū)域和顯示區(qū)域 選中要重復(fù)的區(qū)域，添加服務(wù)器行為中的重復(fù)區(qū)域，選擇相應(yīng)條件即可，選擇插入應(yīng)用程序記錄集分頁記錄集導(dǎo)航條，添加上一頁和下一頁等。 4.3.4 顯示的結(jié)果如下： 4.4 音樂搜索 4.4.1 添加搜索結(jié)果頁面 4.4.2 綁定記錄集 注：request.form(“searchtext”)是從搜索頁面?zhèn)鬟f過來的參數(shù)，并將該參數(shù)與數(shù)據(jù)庫中的歌曲名和藝術(shù)家字段比較，篩選出需要的記錄。4.4.3 搜索結(jié)果顯示，如下： 4.5 音樂播放頁面 4.5.1 dreamweaver中

12、制作出該頁面 注：列表中為框架網(wǎng)頁，包括15個(gè)網(wǎng)頁，即15個(gè)分類，可以查看自己的收藏，并播放收聽美妙的歌曲。 4.5.2 綁定記錄集 注：musicid為點(diǎn)擊試聽后傳遞的參數(shù)第5節(jié) 網(wǎng)站顯示效果 5.1 網(wǎng)站主頁 注：主頁的右上角為動態(tài)時(shí)鐘，上方為網(wǎng)站形象flash，并有設(shè)為首頁和添加收藏功能，可通過上傳作品和下載作品查看說明，中間網(wǎng)站分類導(dǎo)航條和音樂搜索，左下角為會員登錄窗體，可通過鏈接進(jìn)行注冊，下方網(wǎng)站版權(quán)說明，關(guān)于我們和留言提交鏈接。 5.2 歌曲分類頁面 注：歌曲分類頁面均來自于模板，結(jié)構(gòu)相似，只是數(shù)據(jù)集的綁定不同而已，故此不做重復(fù)介紹。 5.3 音樂搜索頁面注：在音樂搜索文本框中輸入

13、搜索文本，點(diǎn)擊音樂搜索按鈕后，會顯示出搜索結(jié)果，同樣也可以在有主頁模板生成的其他頁面進(jìn)行搜索。5.4 用戶留言頁面 輸入反饋內(nèi)容和聯(lián)系方式后，單擊確定提交按鈕，即可將用戶要反饋的內(nèi)容提交給后臺數(shù)據(jù)庫。5.5 音樂播放器頁面 注：點(diǎn)擊音樂名稱鏈接或者點(diǎn)擊試聽后，網(wǎng)站會自動打開該網(wǎng)頁播放器頁面，播放你選中的音樂，而播放器的左邊分類歌曲列表，供你選擇喜歡的各種類型歌曲。5.6 后臺管理主頁面注：在上述登陸后臺頁面中輸入管理員賬號和密碼，輸入正確后登陸到后臺管理，如下： 注：后臺顯示登陸的管理員名稱，進(jìn)入后臺后，可以進(jìn)行一下操作：用戶管理，歌曲管理，留言管理和系統(tǒng)管理。5.7 用戶管理頁面 注：該頁面可以查看用戶的詳細(xì)資料，查看用戶的音樂收藏和刪除用戶。5.8 歌曲管理頁面 注：該頁面可以對音樂資料進(jìn)行查看，編輯和刪除，同樣也可以插入音樂。5.9 留言管理頁面 注：留言頁面，可以查看用戶的留言和建議來提高網(wǎng)站的穩(wěn)定性，亦可以刪除無用的留言。5.10 系統(tǒng)管理頁面 系統(tǒng)管理頁面包括修改管理員密碼和更改網(wǎng)站信息兩個(gè)部分，功能實(shí)現(xiàn)密碼修改和信息信息修改，截圖如下：第6節(jié) 總結(jié)和設(shè)計(jì)體會 通過本次課程設(shè)計(jì)，我對asp網(wǎng)站的構(gòu)建有了更深一步的了解，彌補(bǔ)了課堂上學(xué)習(xí)不到的知識，同時(shí)也對網(wǎng)