第頁(yè)音樂(lè)播放微信小程序的系統(tǒng)實(shí)現(xiàn)與測(cè)試分析案例目錄TOC\o"1-3"\h\u27325音樂(lè)播放微信小程序的系統(tǒng)實(shí)現(xiàn)與測(cè)試分析案例 1110571.1系統(tǒng)實(shí)現(xiàn) 1167461.1.1注冊(cè)登錄功能的實(shí)現(xiàn) 124151.1.2主界面的實(shí)現(xiàn) 274261.1.3歌曲播放功能的實(shí)現(xiàn) 3154421.1.4評(píng)論功能的實(shí)現(xiàn) 3147131.1.5搜索功能的實(shí)現(xiàn) 4136161.1.6歌手展示功能的實(shí)現(xiàn) 469641.1.7推薦功能的實(shí)現(xiàn) 514391.2程序測(cè)試 5146411.2.1本系統(tǒng)測(cè)試 51.1系統(tǒng)實(shí)現(xiàn)用戶(hù)和系統(tǒng)的交互是建立在用戶(hù)界面上的，因?yàn)橛脩?hù)無(wú)法看到代碼，所以只能通過(guò)系統(tǒng)提供的用戶(hù)界面來(lái)和系統(tǒng)進(jìn)行交互，因此用戶(hù)界面是十分重要的。用戶(hù)可以通過(guò)用戶(hù)界面向系統(tǒng)傳遞信息，同時(shí)也可以接收系統(tǒng)的反饋。具有推薦系統(tǒng)的音樂(lè)播放微信小程序的音樂(lè)數(shù)據(jù)是需要合理的界面來(lái)展現(xiàn)的，良好的界面設(shè)計(jì)可以簡(jiǎn)化用戶(hù)操作并帶給用戶(hù)良好的體驗(yàn)感。1.1.1注冊(cè)登錄功能的實(shí)現(xiàn)小程序端用戶(hù)登錄需要注冊(cè)，注冊(cè)時(shí)小程序自動(dòng)獲取微信用戶(hù)的頭像，填寫(xiě)用戶(hù)名和密碼，點(diǎn)擊注冊(cè)按鈕注冊(cè)成功。登錄時(shí)，用戶(hù)填寫(xiě)已注冊(cè)完的用戶(hù)名和密碼，點(diǎn)擊登錄按鈕登錄。效果如下圖6-1所示：圖6-1小程序端用戶(hù)注冊(cè)登錄網(wǎng)頁(yè)端管理員賬號(hào)無(wú)需注冊(cè)，為事先加入數(shù)據(jù)庫(kù)中的數(shù)據(jù)，輸入賬號(hào)和密碼即可完成登錄。效果如下圖6-2所示：圖6-2網(wǎng)頁(yè)端端管理員登錄1.1.2主界面的實(shí)現(xiàn)管理員成功登陸后，自動(dòng)跳轉(zhuǎn)到網(wǎng)頁(yè)端的主頁(yè)。系統(tǒng)主頁(yè)導(dǎo)航欄對(duì)應(yīng)后臺(tái)管理選項(xiàng)。包括樂(lè)庫(kù)管理、歌手管理、歌單管理、用戶(hù)管理、輪播圖管理。點(diǎn)擊導(dǎo)航欄會(huì)分頁(yè)顯示數(shù)據(jù)庫(kù)中數(shù)據(jù)，并顯示操作選項(xiàng)。效果圖如6-3所示：圖6-3管理員系統(tǒng)主界面用戶(hù)成功登錄后，跳轉(zhuǎn)到小程序端的主頁(yè)。主頁(yè)包含三部分：輪播圖、搜索欄、推薦歌單、系統(tǒng)歌單。底部的tabBar對(duì)應(yīng)跳轉(zhuǎn)到不同的功能頁(yè)面。效果圖如圖6-4所示：圖6-4小程序端主界面1.1.3歌曲播放功能的實(shí)現(xiàn)小程序觸發(fā)歌曲播放的方式有六種方式：點(diǎn)擊主頁(yè)的輪播圖觸發(fā)、點(diǎn)擊歌單內(nèi)歌曲名觸發(fā)、點(diǎn)擊搜索歌曲結(jié)果、在歌手主頁(yè)點(diǎn)擊歌曲名觸發(fā)、在播放記錄中點(diǎn)擊歌曲名觸發(fā)、在收藏列表中點(diǎn)擊歌曲名觸發(fā)。以上事件觸發(fā)歌曲播放后，會(huì)跳轉(zhuǎn)到tabBar的正在播放界面。界面靜態(tài)顯示歌曲信息以及歌曲操作表示，以唱片形式將歌曲封面旋轉(zhuǎn)動(dòng)態(tài)顯示。效果圖如下圖6-5所示：圖6-5小程序音樂(lè)播放界面1.1.4評(píng)論功能的實(shí)現(xiàn)在歌曲播放界面右滑顯示用戶(hù)對(duì)當(dāng)前播放歌曲的評(píng)論，評(píng)論記錄評(píng)論內(nèi)容、評(píng)論事件和評(píng)論者，上下滑動(dòng)可翻閱所有評(píng)論。用戶(hù)若想評(píng)論此歌曲，需在文本框“請(qǐng)輸入回復(fù)”中填寫(xiě)想要評(píng)論的內(nèi)容，點(diǎn)擊發(fā)送即可。效果圖如下圖6-6所示：圖6-6評(píng)論功能實(shí)現(xiàn)效果1.1.5搜索功能的實(shí)現(xiàn)搜索功能用于幫助用戶(hù)快速查找到想要獲得的內(nèi)容。小程序的搜索功能提供歌曲搜索、歌手搜索。該搜索功能有模糊查詢(xún)的功能，當(dāng)用戶(hù)輸入關(guān)鍵字時(shí)，系統(tǒng)會(huì)匹配關(guān)鍵字查找，若匹配的結(jié)果為歌曲，則以歌曲-歌手的形式顯示；若匹配結(jié)果為歌手，則以歌手頭像頭像-歌手名結(jié)果顯示。效果圖如圖6-7所示：圖6-7搜索功能實(shí)現(xiàn)效果1.1.6歌手展示功能的實(shí)現(xiàn)為了方便用戶(hù)查詢(xún)歌手，提高查詢(xún)效率。歌手展示功能模塊提供了按照歌手的姓名首字母順序從A~Z排序的功能，并且只給出數(shù)據(jù)庫(kù)中已有歌手的姓名首字母，當(dāng)用戶(hù)點(diǎn)擊某個(gè)字母時(shí)，小程序會(huì)定位到選擇字母的位置。效果如圖6-8所示：圖6-8歌手展示功能實(shí)現(xiàn)效果1.1.7推薦功能的實(shí)現(xiàn)推薦功能的實(shí)現(xiàn)，是使用基于用戶(hù)的協(xié)同過(guò)濾算法，對(duì)用戶(hù)的收藏歌單進(jìn)行分析統(tǒng)計(jì)，為用戶(hù)推薦歌曲，推薦結(jié)果在小程序主頁(yè)顯示。效果如下圖6-9所示：圖6-9推薦功能實(shí)現(xiàn)效果1.2程序測(cè)試對(duì)于系統(tǒng)的測(cè)試主要采用白盒測(cè)試，而且是分模塊進(jìn)行的，會(huì)對(duì)各個(gè)模塊的入口和出口數(shù)據(jù)進(jìn)行嚴(yán)格的檢查。采用白盒測(cè)試，方便測(cè)試人員掌握系統(tǒng)的內(nèi)部結(jié)構(gòu)和處理過(guò)程，并且可以隨時(shí)修改內(nèi)部程序，使得對(duì)系統(tǒng)的測(cè)試工作變得十分便利。因此測(cè)試人員可以通過(guò)檢查程序邏輯并得出相應(yīng)測(cè)試數(shù)據(jù)來(lái)檢查系統(tǒng)各模塊能否正常的運(yùn)行。1.2.1本系統(tǒng)測(cè)試具有推薦功能的音樂(lè)播放微信小程序主要有賬號(hào)操作、歌曲播放、歌曲操作、用戶(hù)管理、歌曲管理、歌手管理、歌單管理、輪播圖管理，這八個(gè)功能模塊都分別包含許多功能，根據(jù)以上介紹的測(cè)試原則，將使用測(cè)試用例文檔分別對(duì)本系統(tǒng)進(jìn)行測(cè)試。由于本系統(tǒng)各功能模塊內(nèi)包含的小功能過(guò)多，就不一一列舉測(cè)試，僅選擇幾個(gè)具有代表性功能的來(lái)進(jìn)行測(cè)試，測(cè)試用例如下。用戶(hù)登錄的測(cè)試用例，如表6-1所示。表6-1用戶(hù)登錄的測(cè)試用例用例描述前提條件用例步驟期待結(jié)果實(shí)際結(jié)果用戶(hù)登錄頁(yè)面用戶(hù)名和密碼都存在且匹配輸入用戶(hù)名和密碼不報(bào)錯(cuò)，成功登錄與期待結(jié)果相同用戶(hù)登錄頁(yè)面用戶(hù)名和密碼都存在但不匹配輸入用戶(hù)名和密碼報(bào)錯(cuò)，登錄失敗與期待結(jié)果相同用戶(hù)登錄頁(yè)面用戶(hù)名不存在輸入用戶(hù)名和密碼報(bào)錯(cuò)，登錄失敗與期待結(jié)果相同用戶(hù)登錄頁(yè)面用戶(hù)名或密碼有一項(xiàng)為空輸入用戶(hù)名和密碼報(bào)錯(cuò)，登錄失敗與預(yù)期結(jié)果相同表6-1用戶(hù)登錄測(cè)試用例，實(shí)際結(jié)果與期待結(jié)果相同，用戶(hù)登錄功能通過(guò)測(cè)試。(2)歌曲播放的測(cè)試用例，如表6-2所示：表6-2歌曲播放的測(cè)試用例用例描述前提條件用例步驟期待結(jié)果實(shí)際結(jié)果小程序主界面輪播圖有跳轉(zhuǎn)播放的點(diǎn)擊事件點(diǎn)擊輪播圖不報(bào)錯(cuò)，成功播放與期待結(jié)果相同小程序主界面輪播圖沒(méi)有跳轉(zhuǎn)播放的點(diǎn)擊事件點(diǎn)擊輪播圖報(bào)錯(cuò)，未獲取到歌曲地址與期待結(jié)果相同歌單詳情頁(yè)面歌單中有該歌曲地址點(diǎn)擊歌曲名不報(bào)錯(cuò)，播放成功與期待結(jié)果相同歌單詳情頁(yè)面歌單中沒(méi)有該歌曲地址點(diǎn)擊歌曲名報(bào)錯(cuò)，播放失敗與預(yù)期結(jié)果相同(3)搜索功能的測(cè)試用例，如表6-3所示：表6-3搜索功能的測(cè)試用例用例描述前提條件用例步驟期待結(jié)果實(shí)際結(jié)果搜索頁(yè)面數(shù)據(jù)庫(kù)中有符合關(guān)鍵字的歌手和歌曲輸入關(guān)鍵字不報(bào)錯(cuò)，搜索成功與期待結(jié)果相同搜索頁(yè)面數(shù)據(jù)庫(kù)中只有符合關(guān)鍵字的歌手輸入關(guān)鍵字不報(bào)錯(cuò)，搜索成功與期待結(jié)果相同搜索頁(yè)面數(shù)據(jù)庫(kù)中只有符合關(guān)鍵字的歌曲輸入關(guān)鍵字不報(bào)錯(cuò)，搜索成功與期待結(jié)果相同搜索頁(yè)面數(shù)據(jù)庫(kù)中沒(méi)有符合關(guān)鍵字的歌曲和歌手輸入關(guān)鍵字報(bào)錯(cuò)，搜索失敗與預(yù)期結(jié)果相同搜索頁(yè)面歷史搜索記錄中有數(shù)據(jù)點(diǎn)擊刪除歷史記錄不報(bào)錯(cuò)，刪除成功與預(yù)期結(jié)果相同搜索頁(yè)面歷史搜索記錄中沒(méi)有數(shù)據(jù)點(diǎn)擊刪除歷史記錄報(bào)錯(cuò)，未獲取到數(shù)據(jù)與預(yù)期結(jié)果相同(4)收藏功能的測(cè)試用例，如表6-4所示：表6-4收藏功能的測(cè)試用例用例描述前提條件用例步驟期待結(jié)果實(shí)際結(jié)果歌曲播放界面用戶(hù)未登錄點(diǎn)擊收藏不報(bào)錯(cuò)，跳轉(zhuǎn)到登錄頁(yè)面與期待結(jié)果相同歌曲播放界面用戶(hù)已登錄且此歌曲未在收藏列表點(diǎn)擊收藏不報(bào)錯(cuò)，成功收藏與期待結(jié)果相同歌曲播放界面用戶(hù)已登錄且此歌曲在收藏列表點(diǎn)擊收藏不報(bào)錯(cuò)，取消收藏與期待結(jié)果相同(5)評(píng)論功能的測(cè)試用例，如表6-5所示：表6-5評(píng)論功能的測(cè)試用例用例描述前提條件用例步驟期待結(jié)果實(shí)際結(jié)果歌曲評(píng)論頁(yè)面用戶(hù)未登錄點(diǎn)擊發(fā)表評(píng)論不報(bào)錯(cuò)，跳轉(zhuǎn)到登錄頁(yè)面與期待結(jié)果相同歌曲評(píng)論頁(yè)面用戶(hù)已登錄但評(píng)論內(nèi)容為空點(diǎn)擊發(fā)表評(píng)論報(bào)錯(cuò)，發(fā)表失敗與期待結(jié)果相同歌曲評(píng)論頁(yè)面用戶(hù)已登錄且評(píng)論內(nèi)容不為空點(diǎn)擊發(fā)表評(píng)論不報(bào)錯(cuò)，發(fā)表成功與期待結(jié)果相同(6)推薦功能的測(cè)試用例，如表6-6