feat: web模式支持自定义base

package.json

@@ -56,6 +56,7 @@
     "cac": "^6.7.14",
     "cli-progress": "3.11.2",
     "colorette": "2.0.19",
+    "ejs": "^3.1.9",
     "express": "^4.18.2",
     "got": "12.3.1",
     "inquirer": "^9.2.9",

src/command.ts

@@ -10,6 +10,7 @@ export default (() => {
   cli
     .option('-n, --number <number>', '搜索时的页码数', { default: 1 })
     .option('-s, --size <size>', '搜索时的歌曲数量', { default: 20 })
+    .option('-b, --base <base>', 'base URL')
     .option('-i, --songListId <songListId>', '歌单ID')
     .option('-l, --lyric', '是否下载歌词')
     .option('-p, --path <path>', '音乐批量下载的目标目录路径')

src/index.ts

@@ -4,14 +4,12 @@ import choose from './choose'
 import searchMusic from './searchMusic'
 import download from './download'
 import qrcodeGenerator from './qrcode'
-import type { SongInfo } from './types'
+import type { SongInfo, CommandOptions } from './types'
 
 !(async () => {
-  const {
-    options: { qrcode, port, open, path, lyric },
-  } = command
-  if (qrcode) {
-    return await qrcodeGenerator({ port, open, path, lyric })
+  const { options } = command
+  if (options.qrcode) {
+    return await qrcodeGenerator(options as CommandOptions)
   }
   const result = await searchMusic(<SongInfo>command)
   const { songs = [] } = await choose(<SongInfo>result)

src/qrcode/index.ts

@@ -10,7 +10,7 @@ import express, { NextFunction, Request, Response } from 'express'
 import search from '../services/search'
 import lyricDownload from '../services/lyric'
 import { getNetworkAddress } from '../utils'
-import type { ServiceType } from '../types'
+import type { ServiceType, CommandOptions } from '../types'
 
 interface DownloadRequestType {
   service: ServiceType
@@ -38,35 +38,25 @@ const config = {
   },
 }
 
-export default async ({
-  port,
-  open: isOpen,
-  path,
-  lyric: withLyric,
-}: {
-  port?: string
-  open?: boolean
-  path?: string
-  lyric?: boolean
-}) => {
+export default async (options: CommandOptions) => {
+  const { port, open: isOpen, path, lyric: withLyric, base = '' } = options
   const app = express()
 
+  app.set('view engine', 'ejs')
+
   app.use(
-    express.static(
-      resolve(__dirname, process.env.IS_DEV === 'true' ? '../../template' : '../template')
-    )
+    `/${base}`,
+    express.static(resolve(__dirname, process.env.IS_DEV === 'true' ? '../../public' : '../public'))
   )
 
-  const realPort = port ?? (await portfinder.getPortPromise(config.portfinder))
-
-  const onStart = () => {
-    const address = `http://${getNetworkAddress()}:${realPort}`
-
-    console.log('\n扫描二维码，播放及下载音乐')
-    qrcode.generate(address, config.qrcode)
-    console.log(`访问链接: ${address}\n`)
-    isOpen && open(address)
-  }
+  app.get(`/${base}`, (_, res) => {
+    res.render(
+      resolve(__dirname, process.env.IS_DEV === 'true' ? '../../views/index' : '../views/index'),
+      {
+        base,
+      }
+    )
+  })
 
   app.get(
     '/search',
@@ -132,5 +122,16 @@ export default async ({
     })
   })
 
+  const realPort = port ?? (await portfinder.getPortPromise(config.portfinder))
+
+  const onStart = () => {
+    const address = `http://${getNetworkAddress()}:${realPort}/${base}`
+
+    console.log('\n扫描二维码，播放及下载音乐')
+    qrcode.generate(address, config.qrcode)
+    console.log(`访问链接: ${address}\n`)
+    isOpen && open(address)
+  }
+
   app.listen(realPort, onStart)
 }

src/types.ts

@@ -32,6 +32,8 @@ export interface CommandOptions {
   port?: string
   songListId: string
   service: ServiceType
+  open?: boolean
+  base?: string
 }
 
 export interface SearchSongInfo {

template/index.html → views/index.ejs

@@ -4,8 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
     <title>Music Player</title>
-    <link rel="icon" type="image/svg+xml" href="/music.svg" />
-    <link rel="icon" type="image/png" href="/music.png" />
+    <link rel="icon" type="image/svg+xml" href="<%= base?.length ? `/${base}` : '' %>/music.svg" />
+    <link rel="icon" type="image/png" href="<%= base?.length ? `/${base}` : '' %>/music.png" />
     <link
       href="https://cdn.bootcdn.net/ajax/libs/ant-design-vue/1.7.7/antd.min.css"
       rel="stylesheet"
@@ -14,7 +14,7 @@
       href="https://cdn.bootcdn.net/ajax/libs/aplayer/1.10.1/APlayer.min.css"
       rel="stylesheet"
     />
-    <link href="/index.css" rel="stylesheet" />
+    <link href="<%= base?.length ? `/${base}` : '' %>/index.css" rel="stylesheet" />
     <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.9/vue.min.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/ant-design-vue/1.7.7/antd.min.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/aplayer/1.10.1/APlayer.min.js"></script>
@@ -203,4 +203,4 @@
       }).$mount('#app')
     </script>
   </body>
-</html>
+</html>