MusicHub -- 三合一(qq、xiami、網易雲) 音樂搜刮

2019年8月24日 152次阅读 来源: Spades

每次去搜個歌，恰巧又不曉得在哪一個平台宣布，這個時刻是否是很煩，要去每一個平台上搜一遍。前两天 周月半 發了新歌《不愛我就拉倒》，我前後找了兩三個平台，末了發現是QQ音樂獨家宣布，更可氣的是我沒有qq音樂app，orz….. 一個多合一搜刮很主要！

結果

《MusicHub -- 三合一(qq、xiami、網易雲) 音樂搜刮》
《MusicHub -- 三合一(qq、xiami、網易雲) 音樂搜刮》
《MusicHub -- 三合一(qq、xiami、網易雲) 音樂搜刮》

簡介

MusicHub ，三合一搜刮平台，數據泉源：網易雲、QQ、蝦米。
Demo地點：MusicHub

git

MusicHub 記得給star啊朋友們

工程構造

-- musichub
    -- App
        -- build   => webpack配置文件
        -- config  => 工程配置文件
        -- src     => 前端源文件目次
        -- static  => 靜態資本文件目次
        -- index.html  => htmlwebpackplugin 模板文件
        -- package.json  =>  依靠文件
    -- Server
        -- config  => 工程配置文件
        -- router  => 路由
        -- service => server效勞
        -- spider  => 爬蟲
        -- static  => 靜態資本
        -- view    => 頁面html文件
        -- package.json   => 依靠文件

手藝棧

  • 前端(App)

    • vue + vue-router + webpack
    • 瀏覽器兼容：應用兩套代碼做了PC、mobile兼容，PC端用了Element組件、Mobile端用了cube-ui 組件
    • 代碼作風搜檢：Eslint + airbnbbase

  • 效勞端(Server)

    • Koa：應用koa搭建了RESTful API效勞器
    • request： spider運用request要求數據
    • 效勞端襯着：剖析UserAgent，推斷當前裝備範例：PC/Mobile，依據裝備範例襯着對應頁面

疾速運用

  • 前端(App)
       – 裝置依靠：yarn (發起運用yarn裝置依靠，依靠里有一個git堆棧(對cube-ui做了修正)，npm 5.5.1 會報錯

    • 開闢形式運轉: yarn run dev (需要將 App/src/view/desktop/components/Result.vue和App/src/view/desktop/components/Result.vue中 axios.defaults.baseURL 設置為 ‘http://localhost:3000/api/v1′
    • 打包：yarn run build，打包天生html文件將會在Server/view目次下，其他文件(css、js等)會在Server/static文件夾下(需要將 App/src/view/desktop/components/Result.vue和App/src/view/desktop/components/Result.vue中 axios.defaults.baseURL 設置為 ‘/api/v1’

  • 效勞端(Server)

    • 修正端口：修正Server/config/index.js中port
    • 開闢者形式運轉：yarn run dev
    • product形式：yarn run prod
    原文作者：Spades
    原文地址: https://segmentfault.com/a/1190000014952933
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞