feat: v1.1.0 迭代更新

Server:
- 添加房间密码验证 POST /rooms/:id/join
- 添加玩家踢出 POST /rooms/:id/kick/:playerId
- 添加房间过期自动清理（30分钟无活动）
- 添加流量统计 GET /traffic
- 添加token认证中间件保护写操作API
- 房间详情返回玩家列表

Client:
- 添加设置持久化（electron-store）
- 添加设置页面（玩家名、本地端口、自动重连、托盘最小化）
- 添加系统托盘支持（最小化到托盘、右键菜单）
- 添加最近连接服务器记录
- 连接成功自动保存服务器地址
- 加入房间自动填充默认端口

client/renderer/app.js

@@ -4,6 +4,15 @@ const $$ = (sel) => document.querySelectorAll(sel);
 
 let isConnected = false;
 let currentServerUrl = '';
+let appSettings = {};
+
+// Load settings on startup
+(async () => {
+  appSettings = await window.funmc.getSettings();
+  if (appSettings.serverUrl) $('#server-url').value = appSettings.serverUrl;
+  if (appSettings.localPort) $('#join-local-port').value = appSettings.localPort;
+  showRecentServers();
+})();
 
 // ===== Window Controls =====
 $('#btn-min').addEventListener('click', () => window.funmc.minimize());
@@ -42,6 +51,11 @@ $('#btn-connect').addEventListener('click', async () => {
     updateServerStatus(true);
     showMsg('#connect-msg', '连接成功！', 'success');
     showServerInfo(result.data);
+    // Save to recent servers and settings
+    await window.funmc.addRecentServer(url);
+    await window.funmc.setSettings({ serverUrl: url });
+    appSettings.serverUrl = url;
+    showRecentServers();
   } else {
     isConnected = false;
     updateServerStatus(false);
@@ -125,13 +139,14 @@ async function loadRooms() {
   `).join('');
 }
 
-function quickJoin(roomId) {
+async function quickJoin(roomId) {
   // Navigate to join page and fill in room ID
   $$('.nav-item').forEach(n => n.classList.remove('active'));
   document.querySelector('[data-page="join"]').classList.add('active');
   $$('.page').forEach(p => p.classList.remove('active'));
   $('#page-join').classList.add('active');
   $('#join-room-id').value = roomId;
+  if (appSettings.localPort) $('#join-local-port').value = appSettings.localPort;
 }
 
 // ===== Host Page =====
@@ -255,6 +270,62 @@ document.querySelector('[data-page="rooms"]').addEventListener('click', () => {
   if (isConnected) loadRooms();
 });
 
+// ===== Settings Page =====
+document.querySelector('[data-page="settings"]').addEventListener('click', loadSettings);
+
+async function loadSettings() {
+  appSettings = await window.funmc.getSettings();
+  $('#settings-name').value = appSettings.playerName || '';
+  $('#settings-port').value = appSettings.localPort || 25566;
+  $('#settings-autoreconnect').checked = appSettings.autoReconnect !== false;
+  $('#settings-tray').checked = appSettings.minimizeToTray !== false;
+
+  const list = $('#settings-recent-list');
+  const recent = appSettings.recentServers || [];
+  if (recent.length === 0) {
+    list.innerHTML = '<div class="recent-list-empty">暂无记录</div>';
+  } else {
+    list.innerHTML = recent.map(url => `
+      <div class="recent-list-item">
+        <span class="url">${escapeHtml(url)}</span>
+      </div>
+    `).join('');
+  }
+}
+
+$('#btn-save-settings').addEventListener('click', async () => {
+  const settings = {
+    playerName: $('#settings-name').value.trim() || 'Player',
+    localPort: parseInt($('#settings-port').value) || 25566,
+    autoReconnect: $('#settings-autoreconnect').checked,
+    minimizeToTray: $('#settings-tray').checked,
+  };
+  await window.funmc.setSettings(settings);
+  Object.assign(appSettings, settings);
+  $('#join-local-port').value = settings.localPort;
+  showMsg('#settings-msg', '设置已保存', 'success');
+  setTimeout(() => showMsg('#settings-msg', '', ''), 2000);
+});
+
+async function showRecentServers() {
+  const settings = await window.funmc.getSettings();
+  const recent = settings.recentServers || [];
+  const container = $('#recent-servers');
+  if (recent.length === 0) {
+    container.classList.add('hidden');
+    return;
+  }
+  container.classList.remove('hidden');
+  container.innerHTML = recent.map(url => `
+    <div class="recent-item" data-url="${escapeHtml(url)}">${escapeHtml(url)}</div>
+  `).join('');
+  container.querySelectorAll('.recent-item').forEach(item => {
+    item.addEventListener('click', () => {
+      $('#server-url').value = item.dataset.url;
+    });
+  });
+}
+
 // ===== Utilities =====
 function showMsg(selector, text, type) {
   const el = $(selector);

client/renderer/index.html

@@ -50,6 +50,9 @@
         <li class="nav-item" data-page="join">
           <span class="nav-icon">🚀</span> 加入房间
         </li>
+        <li class="nav-item" data-page="settings">
+          <span class="nav-icon">⚙️</span> 设置
+        </li>
         <li class="nav-item" data-page="about">
           <span class="nav-icon">ℹ️</span> 关于
         </li>
@@ -67,6 +70,7 @@
           <div class="form-group">
             <label>服务器地址</label>
             <input type="text" id="server-url" class="input" placeholder="http://your-server:3000" value="http://localhost:3000">
+            <div id="recent-servers" class="recent-servers hidden"></div>
           </div>
           <button class="btn btn-primary" id="btn-connect">连接服务器</button>
           <div class="msg" id="connect-msg"></div>
@@ -182,6 +186,46 @@
         </div>
       </div>
 
+      <!-- Settings Page -->
+      <div class="page" id="page-settings">
+        <h2 class="page-title">设置</h2>
+        <p class="page-desc">客户端偏好设置</p>
+        <div class="card">
+          <div class="form-row">
+            <div class="form-group">
+              <label>玩家名称</label>
+              <input type="text" id="settings-name" class="input" placeholder="你的游戏名">
+            </div>
+            <div class="form-group">
+              <label>默认本地端口</label>
+              <input type="number" id="settings-port" class="input" value="25566">
+            </div>
+          </div>
+          <div class="form-row">
+            <div class="form-group">
+              <label class="toggle-label">
+                <input type="checkbox" id="settings-autoreconnect" checked>
+                <span>自动重连</span>
+              </label>
+              <span class="form-hint">连接断开后自动尝试重新连接</span>
+            </div>
+            <div class="form-group">
+              <label class="toggle-label">
+                <input type="checkbox" id="settings-tray" checked>
+                <span>最小化到托盘</span>
+              </label>
+              <span class="form-hint">关闭窗口时最小化到系统托盘</span>
+            </div>
+          </div>
+          <div class="form-group">
+            <label>最近连接的服务器</label>
+            <div id="settings-recent-list" class="recent-list"></div>
+          </div>
+          <button class="btn btn-primary" id="btn-save-settings">保存设置</button>
+          <div class="msg" id="settings-msg"></div>
+        </div>
+      </div>
+
       <!-- About Page -->
       <div class="page" id="page-about">
         <h2 class="page-title">关于 FunConnect</h2>

client/renderer/style.css

@@ -420,6 +420,57 @@ select.input { cursor: pointer; }
 .step strong { font-size: 13px; display: block; margin-bottom: 3px; }
 .step p { font-size: 12px; color: var(--text-dim); }
 
+/* Settings */
+.toggle-label {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+  font-size: 13px;
+}
+.toggle-label input[type="checkbox"] {
+  width: 18px;
+  height: 18px;
+  accent-color: var(--green);
+  cursor: pointer;
+}
+.recent-servers {
+  margin-top: 6px;
+  background: var(--bg-dark);
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  max-height: 120px;
+  overflow-y: auto;
+}
+.recent-item {
+  padding: 8px 12px;
+  font-size: 12px;
+  color: var(--text-dim);
+  cursor: pointer;
+  transition: background 0.15s;
+  border-bottom: 1px solid var(--border);
+}
+.recent-item:last-child { border-bottom: none; }
+.recent-item:hover { background: rgba(76, 175, 80, 0.1); color: var(--text); }
+.recent-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  margin-top: 6px;
+}
+.recent-list-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: var(--bg-dark);
+  border-radius: 6px;
+  padding: 8px 12px;
+  font-size: 12px;
+  color: var(--text-dim);
+}
+.recent-list-item .url { flex: 1; }
+.recent-list-empty { font-size: 12px; color: #555; padding: 8px 0; }
+
 /* Utility */
 .hidden { display: none !important; }
 

client/src/main/api-client.ts

@@ -47,4 +47,14 @@ export class ApiClient {
     const res = await this.http.get(`/rooms/${roomId}`);
     return res.data;
   }
+
+  async joinRoom(roomId: string, password?: string) {
+    const res = await this.http.post(`/rooms/${roomId}/join`, { password });
+    return res.data;
+  }
+
+  async getTraffic() {
+    const res = await this.http.get('/traffic');
+    return res.data;
+  }
 }

client/src/main/index.ts

@@ -1,10 +1,23 @@
-import { app, BrowserWindow, ipcMain, dialog } from 'electron';
+import { app, BrowserWindow, ipcMain, dialog, Tray, Menu, nativeImage } from 'electron';
 import * as path from 'path';
+import Store from 'electron-store';
 import { RelayClient } from './relay-client';
 import { LocalProxy } from './local-proxy';
 import { ApiClient } from './api-client';
 
+const store = new Store({
+  defaults: {
+    serverUrl: 'http://localhost:3000',
+    playerName: 'Player',
+    localPort: 25566,
+    recentServers: [] as string[],
+    autoReconnect: true,
+    minimizeToTray: true,
+  }
+});
+
 let mainWindow: BrowserWindow | null = null;
+let tray: Tray | null = null;
 let relayClient: RelayClient | null = null;
 let localProxy: LocalProxy | null = null;
 let apiClient: ApiClient | null = null;
@@ -28,12 +41,33 @@ function createWindow() {
 
   mainWindow.loadFile(path.join(__dirname, '../../renderer/index.html'));
 
+  mainWindow.on('close', (e) => {
+    if (store.get('minimizeToTray') && tray) {
+      e.preventDefault();
+      mainWindow?.hide();
+    }
+  });
+
   mainWindow.on('closed', () => {
     mainWindow = null;
     cleanup();
   });
 }
 
+function createTray() {
+  const icon = nativeImage.createEmpty();
+  tray = new Tray(icon);
+  tray.setToolTip('FunConnect - Minecraft 联机客户端');
+  tray.setContextMenu(Menu.buildFromTemplate([
+    { label: '显示主窗口', click: () => { mainWindow?.show(); mainWindow?.focus(); } },
+    { type: 'separator' },
+    { label: '断开连接', click: () => cleanup() },
+    { type: 'separator' },
+    { label: '退出', click: () => { cleanup(); app.quit(); } },
+  ]));
+  tray.on('double-click', () => { mainWindow?.show(); mainWindow?.focus(); });
+}
+
 function cleanup() {
   if (localProxy) {
     localProxy.stop();
@@ -47,9 +81,11 @@ function cleanup() {
 
 app.whenReady().then(() => {
   createWindow();
+  createTray();
 
   app.on('activate', () => {
     if (BrowserWindow.getAllWindows().length === 0) createWindow();
+    else mainWindow?.show();
   });
 });
 
@@ -171,3 +207,41 @@ ipcMain.handle('server:stats', async () => {
     return { success: false, error: err.message };
   }
 });
+
+// ===== Settings =====
+ipcMain.handle('settings:get', () => {
+  return {
+    serverUrl: store.get('serverUrl'),
+    playerName: store.get('playerName'),
+    localPort: store.get('localPort'),
+    recentServers: store.get('recentServers'),
+    autoReconnect: store.get('autoReconnect'),
+    minimizeToTray: store.get('minimizeToTray'),
+  };
+});
+
+ipcMain.handle('settings:set', (_event, settings: Record<string, any>) => {
+  for (const [key, value] of Object.entries(settings)) {
+    store.set(key, value);
+  }
+  return { success: true };
+});
+
+ipcMain.handle('settings:addRecentServer', (_event, url: string) => {
+  const recent = store.get('recentServers') as string[];
+  const filtered = recent.filter((s: string) => s !== url);
+  filtered.unshift(url);
+  store.set('recentServers', filtered.slice(0, 10));
+  return { success: true };
+});
+
+// ===== Room password verification =====
+ipcMain.handle('rooms:verify', async (_event, opts: { roomId: string; password?: string }) => {
+  if (!apiClient) return { success: false, error: '未连接服务器' };
+  try {
+    const data = await apiClient.joinRoom(opts.roomId, opts.password);
+    return { success: true, data };
+  } catch (err: any) {
+    return { success: false, error: err.response?.data?.error || err.message };
+  }
+});

client/src/main/preload.ts

@@ -18,6 +18,14 @@ contextBridge.exposeInMainWorld('funmc', {
   hostRoom: (opts: any) => ipcRenderer.invoke('rooms:host', opts),
   disconnect: () => ipcRenderer.invoke('relay:disconnect'),
 
+  // Room verification
+  verifyRoom: (opts: any) => ipcRenderer.invoke('rooms:verify', opts),
+
+  // Settings
+  getSettings: () => ipcRenderer.invoke('settings:get'),
+  setSettings: (settings: any) => ipcRenderer.invoke('settings:set', settings),
+  addRecentServer: (url: string) => ipcRenderer.invoke('settings:addRecentServer', url),
+
   // Events from main
   onRelayStatus: (callback: (data: any) => void) => {
     ipcRenderer.on('relay:status', (_event, data) => callback(data));