feat: simplify journal connection via WebSocket upgrade

Refactor the journal server to run over WebSockets on the existing
HTTP server instead of a separate MQTT TCP port. This removes the need
for a separate port configuration and simplifies the connection flow
by auto-connecting to the current host.

- Remove `--mqtt-port` CLI option
- Attach Aedes broker to the HTTP server via WebSocket upgrade
- Update UI to remove manual broker URL and player name inputs
- Add "Content Source" access from the sidebar
- Update JournalPanel to auto-connect to the local server
This commit is contained in:
2026-07-06 15:30:21 +08:00
parent 53c33587fb
commit 862ba9c01b
10 changed files with 242 additions and 242 deletions
+7 -13
View File
@@ -210,7 +210,6 @@ export function createContentServer(
port: number,
distPath: string = distDir,
host: string = "0.0.0.0",
mqttPort: number = 1883,
): ContentServer {
let contentIndex: ContentIndex = {};
@@ -275,28 +274,24 @@ export function createContentServer(
// ---- Journal / MQTT broker ----
let journal: Awaited<ReturnType<typeof createJournalServer>> | null = null;
createJournalServer(contentDir, mqttPort).then((j) => {
journal = j;
});
// 创建请求处理器
// 创建 HTTP 服务器 BEFORE journal so we can pass it in
const handleRequest = createRequestHandler(
contentDir,
distPath,
() => contentIndex,
);
// 创建 HTTP 服务器
const server = createServer(handleRequest);
createJournalServer(contentDir, server).then((j) => {
journal = j;
});
server.listen(port, host, () => {
const displayHost = host === "0.0.0.0" ? "localhost" : host;
console.log(`\n开发服务器已启动:http://${displayHost}:${port}`);
console.log(`内容目录:${contentDir}`);
console.log(`静态资源目录:${distPath}`);
console.log(
`MQTT 代理端口:${mqttPort} (connect via tcp://${displayHost}:${mqttPort})\n`,
);
console.log(`Journal 连接:ws://${displayHost}:${port}\n`);
});
return {
@@ -319,7 +314,6 @@ export const serveCommand: ServeCommandHandler = async (dir, options) => {
const contentDir = resolve(dir);
const port = parseInt(options.port, 10);
const host = options.host || "0.0.0.0";
const mqttPort = parseInt(options.mqttPort || "1883", 10);
createContentServer(contentDir, port, distDir, host, mqttPort);
createContentServer(contentDir, port, distDir, host);
};