支持自定义名字

public/index.html

@@ -22,6 +22,21 @@
         const list = await store.getAll()
         console.log('本地音乐列表:', list)
 
+        // 读取本地用户名(本地缓存)
+        const name = localStorage.getItem('username')
+        if (!name) {
+            localStorage.setItem('username', `user-${Math.random().toString(36).substr(2)}`)
+        }
+        // 设置自己的主机名
+        const nameInput = document.createElement('input')
+        nameInput.type = 'text'
+        nameInput.placeholder = '请设置你的名字'
+        nameInput.onchange = event => {
+            localStorage.setItem('username', event.target.value)
+            window.location.reload() // 简单刷新页面
+        }
+        document.body.appendChild(nameInput)
+
         // 初始化音乐列表(加入本地缓存)
         const musicList = new MusicList({ list })
         musicList.on('remove', item => {
@@ -64,7 +79,7 @@
         })
 
         // 初始化客户端列表
-        const clientList = new ClientList({})
+        const clientList = new ClientList({ name })
 
         // 缓冲分片发送
         const CHUNK_SIZE = 1024 * 128 // 每个块的大小为128KB