这个高颜值的开源第三方网易云音乐播放器你值得拥有
簡介
我平時主要的聽歌軟件是網易云音樂,但是它有很多花里胡哨的功能,比如電臺、直播、朋友、播客、云村等等,說實話這些我都不需要,基本也不會用,大部分的時間都只把它當做一個本地播放器,因為它畢竟是一個商業(yè)軟件,需要賺錢,所以也能理解,相對來說,電腦上的客戶端會簡潔一點,網頁版最純粹,但是顏值一般(大家的審美可能不一樣,這里僅是個人觀點~)。
所以有沒有一個既簡潔純粹,顏值又高的網易云音樂播放器呢,答案是有的,它就是:YesPlayMusic,一個開源的第三方實現(xiàn)。
項目地址:https://github.com/qier222/YesPlayMusic。
這個項目目前有18.1k個star,相當多了,項目基于Vue.js全家桶開發(fā),是一個Web項目,但是通過Electron支持打包成macOS、Windows、Linux三個平臺的客戶端進行使用。
當然這個項目的基礎是另一個開源項目:https://github.com/Binaryify/NeteaseCloudMusicApi,顧名思義,就是網易云音樂的api,這也是一個第三方項目,支持官方的所有接口,使用nodejs開發(fā),基于express框架,請求庫使用的是axios,原理是跨站請求偽造 (CSRF),通過偽造請求頭,調用官方API,簡單來說,就是因為我們的網站域名和網易云音樂的域名不一樣,如果直接請求網易云音樂官方的接口,網易云音樂服務器和瀏覽器為了安全都不允許我們這么干,所以我們需要一個不會被限制的中間商,也就是后端服務,然后我們的網站請求這個服務的接口,帶上認證的cookie,這個服務使用cookie,并且另外再偽造一些請求頭,目的是讓網易云音樂官方服務器認為它是個瀏覽器,這樣它就可以幫我們調網易云音樂官方的接口,然后這個服務再設置為允許跨域請求,那么我們的網站就可以通過請求這個中間商而獲取網易云音樂官方的數(shù)據。
功能&界面
首先來看一下它的基本功能和界面。
登錄
支持掃碼、郵箱登錄和手機號登錄,不支持驗證碼登錄和第三方登錄,不過也夠用了。
如果你不想登錄也可以,直接搜索你的用戶名,同樣也可以聽你的歌單,只是一些私人數(shù)據看不到:
首頁
首頁的欄目有:by Apple Music、推薦歌單、For You(每日推薦)、推薦藝人、新專速遞、排行榜。
by Apple Music是一個數(shù)據寫死的欄目:
For You就是每日推薦,需要登錄才能使用。
發(fā)現(xiàn)頁
首頁部分欄目可以點擊查看全部跳轉到發(fā)現(xiàn)頁,當然也可以直接點擊頂部的tab切換到發(fā)現(xiàn)頁,發(fā)現(xiàn)頁主要是查看推薦歌單、排行榜、按分類搜索歌單:
音樂庫
音樂庫需要登錄后使用,也就是你的個人空間,可以查看你喜歡的歌曲、收藏的歌單、專輯、藝人、MV、云盤及聽歌排行:
搜索
搜索結果包括:藝人、專輯、歌曲、視頻以及歌單:
歌單詳情
點擊某個歌單或專輯可以跳轉到歌單詳情頁面,詳情頁面可以查看簡介、歌單所有歌曲,當然也可以進行播放:
播放
最后就是播放功能了,底部會固定顯示一個播放欄,顯示當前播放的歌曲,也可以進行播放控制、切歌:
點擊底部欄會上劃打開一個全屏的播放界面,可以看到歌詞:
評論功能
聽歌看評論已經成為一種習慣了,評論最初也是網易云音樂的特色,但是很可惜這個項目并不支持查看評論功能,作者也明確表示不會支持:
因為它是開源的,所以作者不支持,可以自己來支持,于是我fork了它的倉庫,花了一天時間加上了評論的查看、發(fā)表、回復及點贊功能。
入口在底部播放欄:
點擊后會上劃全屏顯示評論列表:
支持熱度和時間兩個維度排序,也支持查看樓層回復,可以對歌曲發(fā)表評論,也可以點擊某個樓層進行回復,不過目前有一個小問題,發(fā)表的評論或點贊數(shù)據不會立刻出現(xiàn),需要等待一會(兩分鐘)刷新列表才會顯示,原因是因為api服務增加了緩存處理:
為了不被官方服務器封掉,我也沒有去掉或修改緩存時間。
使用
如果看到這里你已經心動了,那么就可以著手使用了,首先如果你不想折騰,那么可以直接在線使用,不需要評論功能可以直接訪問這個項目提供的默認在線地址:https://music.qier222.com/。如果需要評論功能那么可以使用我修改后并部署的地址:https://music.lxqnsys.com/。
當然,同時我也打包了客戶端安裝包,如果喜歡通過客戶端方式使用的可以去這里下載https://github.com/wanglin2/YesPlayMusic。
這個項目本身支持多種部署方式,部署至Vercel(Vercel是一個零配置的靜態(tài)資源和無服務器云計算(serverless)部署平臺)、部署到你自己的服務器、Docker部署等,這里只介紹第一種,因為不僅免費、簡單、而且可以生成你自己的地址,不用擔心使用別人地址的會失效的問題,傻瓜式教程如下:
1.如果你沒有GitHub賬號,那么先注冊一個。
2.打開Vercel網站,使用github賬號登錄:
3.部署網易云API
打開NeteaseCloudMusicApi項目倉庫,點擊右上角的【Fork】按鈕:
這樣就會把該項目復制到你的名下:
然后打開Vercel網站,點擊右上角的【New Project】按鈕創(chuàng)建新項目:
然后在左側項目列表中找到你fork的NeteaseCloudMusicApi項目,項目太多不好找也可以直接搜索:
點擊【Import】按鈕導入,然后配置也可以不用改動,直接點擊【Deply】按鈕進行部署:
等待部署完畢,點擊左側預覽區(qū)域,就會打開項目,復制新打開頁面的地址即可:
4.部署YesPlayMusic項目
接口服務部署完了,接下來就可以部署YesPlayMusic項目了,步驟和部署接口是一樣的,不過Fork完之后需要:
點擊倉庫的【Add File】,選擇 【Create new file】,輸入【vercel.json】,將下面的內容復制粘貼到文件中,并將 https://your-netease-api.example.com 替換為你剛剛部署的網易云 API 的地址:
{"rewrites": [{"source": "/api/:match*","destination": "https://your-netease-api.example.com/:match*"}] }接下來打開Vercel,步驟和之前一樣,區(qū)別是最后一步要修改一點配置:
點擊 【Environment Variables】,填寫 Name 為 VUE_APP_NETEASE_API_URL,Value 為 /api,點擊 【Add】。最后點擊【Deploy】就可以部署到Vercel了。
默認生成的域名是Vercel的子域名https://xxx.vercel.app,如果你自己有域名,那么也可以綁定成你自己的,在項目詳情頁面點擊【Setting】按鈕:
然后再點擊左側的【Domains】按鈕,在右側輸入你要綁定的域名,點擊【Add】:
接下來只要去你購買域名的服務商里配置一下CNAME映射即可:
回到Vercel頁面,會自動檢測是否映射成功,最后等待證書生成完成,就可以通過我們自己的域名進行訪問了:
本文到此結束~
總結
以上是生活随笔為你收集整理的这个高颜值的开源第三方网易云音乐播放器你值得拥有的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: php pdo更新,php - 使用PD
- 下一篇: 计算机时代 英语,雅思8分范文:计算机时