Merge pull request #2368 from myifeng/mian-ota-test

更新test页面，适配OTA认证

main/xiaozhi-server/test/js/xiaoZhiConnect.js

@@ -2,23 +2,49 @@ import { log } from './utils/logger.js';
 import { otaStatusStyle } from './document.js'
 
 // WebSocket 连接
-export async function webSocketConnect(otaUrl,wsUrl,config){
-    if (!validateWsUrl(wsUrl)) {
-        return;          // 直接返回，不再往下执行
-    }
+export async function webSocketConnect(otaUrl, config){
 
     if (!validateConfig(config)) {
         return;
     }
-    const ok = await sendOTA(otaUrl, config);
-    if (!ok) return;
 
-    // 使用自定义WebSocket实现以添加认证头信息
-    let connUrl = new URL(wsUrl);
-    // 添加认证参数
+    // 发送OTA请求并获取返回的websocket信息
+    const otaResult = await sendOTA(otaUrl, config);
+    if (!otaResult) {
+        log('无法从OTA服务器获取信息', 'error');
+        return;
+    }
+
+    // 从OTA响应中提取websocket信息
+    const { websocket } = otaResult;
+    if (!websocket || !websocket.url || !websocket.token) {
+        log('OTA响应中缺少websocket信息', 'error');
+        return;
+    }
+
+    // 使用OTA返回的websocket URL
+    let connUrl = new URL(websocket.url);
+
+    // 添加token参数（从OTA响应中获取）
+    if (websocket.token) {
+        if(websocket.token.startsWith("Bearer ")){
+            connUrl.searchParams.append('authorization', websocket.token);
+        } else {
+            connUrl.searchParams.append('authorization','Bearer ' + websocket.token);
+        }
+    }
+
+    // 添加认证参数（保持原有逻辑）
     connUrl.searchParams.append('device-id', config.deviceId);
     connUrl.searchParams.append('client-id', config.clientId);
-    log(`正在连接: ${connUrl.toString()}`, 'info');
+
+    const wsurl = connUrl.toString()
+
+    log(`正在连接: ${wsurl}`, 'info');
+
+    if (wsurl) {
+        document.getElementById('serverUrl').value = wsurl;
+    }
 
     return new WebSocket(connUrl.toString());
 }
@@ -48,7 +74,7 @@ function validateWsUrl(wsUrl){
 }
 
 
-// OTA发送请求，验证状态
+// OTA发送请求，验证状态，并返回响应数据
 async function sendOTA(otaUrl, config) {
     try {
         const res = await fetch(otaUrl, {
@@ -90,14 +116,9 @@ async function sendOTA(otaUrl, config) {
 
         const result = await res.json();
         otaStatusStyle(true)
-        return true; // 成功
+        return result; // 返回完整的响应数据
     } catch (err) {
         otaStatusStyle(false)
-        return false; // 失败
+        return null; // 失败返回null
     }
-}
-
-
-
-
-
+}

main/xiaozhi-server/test/test_page.html

@@ -133,8 +133,8 @@
             <div class="connection-controls">
                 <input type="text" id="otaUrl" value="http://127.0.0.1:8002/xiaozhi/ota/"
                     placeholder="OTA服务器地址，如：http://127.0.0.1:8002/xiaozhi/ota/" />
-                <input type="text" id="serverUrl" value="ws://127.0.0.1:8000/xiaozhi/v1/"
-                    placeholder="WebSocket服务器地址，如：ws://127.0.0.1:8000/xiaozhi/v1/" />
+                <input type="text" id="serverUrl" value="" readonly disabled
+                    placeholder="自动从OTA接口获取" />
                 <button id="connectButton">连接</button>
                 <button id="authTestButton">测试认证</button>
             </div>
@@ -714,7 +714,7 @@
             localStorage.setItem('wsUrl', url);
 
             try {
-                const ws = await webSocketConnect(otaUrl, url, config)
+                const ws = await webSocketConnect(otaUrl, config)
                 if (ws === undefined) {
                     return
                 }
@@ -756,7 +756,7 @@
                     messageInput.disabled = true;
                     sendTextButton.disabled = true;
                     recordButton.disabled = true;
-                    stopButton.disabled = true;
+                    // stopButton.disabled = true;
                 };
 
                 websocket.onerror = (error) => {
@@ -1049,11 +1049,6 @@
                 document.getElementById('otaUrl').value = savedOtaUrl;
             }
 
-            const savedWsUrl = localStorage.getItem('wsUrl');
-            if (savedWsUrl) {
-                document.getElementById('serverUrl').value = savedWsUrl;
-            }
-
             // 切换面板显示
             toggleButton.addEventListener('click', () => {
                 const isExpanded = configPanel.classList.contains('expanded');
@@ -1097,6 +1092,9 @@
 
             const config = getConfig();
 
+            const otaUrl = document.getElementById('otaUrl').value.trim();
+
+
             // 显示服务器配置
             log('-------- 服务器认证配置检查 --------', 'info');
             log('请确认config.yaml中的auth配置：', 'info');
@@ -1104,90 +1102,32 @@
             log('2. 如果启用了认证，请确认使用了正确的token', 'info');
             log(`3. 或者在allowed_devices中添加了测试设备MAC：${config.deviceMac}`, 'info');
 
-            const serverUrl = serverUrlInput.value.trim();
-            if (!serverUrl) {
-                log('请输入服务器地址', 'error');
-                return;
-            }
-
-            // 测试连接
-            log('尝试不同认证参数的连接：', 'info');
-
-            // 测试1: 无参数连接
             try {
-                log('测试1: 尝试无参数连接...', 'info');
-                const ws1 = new WebSocket(serverUrl);
+                log('尝试连接...', 'info');
+                const ws = await webSocketConnect(otaUrl, config)
 
-                ws1.onopen = () => {
-                    log('测试1成功: 无参数可连接，服务器可能没有启用认证', 'success');
-                    ws1.close();
-                };
-
-                ws1.onerror = (error) => {
-                    log('测试1失败: 无参数连接被拒绝，服务器可能启用了认证', 'error');
-                };
-
-                // 5秒后关闭测试连接
-                setTimeout(() => {
-                    if (ws1.readyState === WebSocket.CONNECTING || ws1.readyState === WebSocket.OPEN) {
-                        ws1.close();
-                    }
-                }, 5000);
-            } catch (error) {
-                log(`测试1出错: ${error.message}`, 'error');
-            }
-
-            // 测试2: 带参数连接
-            setTimeout(async () => {
-                try {
-                    log('测试2: 尝试带token参数连接...', 'info');
-
-                    let url = new URL(serverUrl);
-                    url.searchParams.append('token', config.token);
-                    url.searchParams.append('device_id', config.deviceId);
-                    url.searchParams.append('device_mac', config.deviceMac);
-
-                    const ws2 = new WebSocket(url.toString());
-
-                    ws2.onopen = () => {
-                        log('测试2成功: 带token参数可连接', 'success');
-
-                        // 尝试发送hello消息
-                        const helloMsg = {
-                            type: 'hello',
-                            device_id: config.deviceId,
-                            device_mac: config.deviceMac,
-                            token: config.token
-                        };
-
-                        ws2.send(JSON.stringify(helloMsg));
-                        log('已发送hello测试消息', 'info');
-
-                        // 监听响应
-                        ws2.onmessage = (event) => {
-                            try {
-                                const response = JSON.parse(event.data);
-                                if (response.type === 'hello' && response.session_id) {
-                                    log(`测试完全成功! 收到hello响应，会话ID: ${response.session_id}`, 'success');
-                                    ws2.close();
-                                }
-                            } catch (e) {
-                                log(`收到非JSON响应: ${event.data}`, 'info');
-                            }
-                        };
-
-                        // 5秒后关闭
-                        setTimeout(() => ws2.close(), 5000);
+                if (ws) {
+                    ws.onopen = () => {
+                        log('测试成功: 可连接，服务器可能没有启用认证', 'success');
+                        ws.close();
                     };
 
-                    ws2.onerror = (error) => {
-                        log('测试2失败: 带token参数连接被拒绝', 'error');
-                        log('请检查token是否正确，或服务器是否接受URL参数认证', 'error');
+                    ws.onerror = (error) => {
+                        log('测试失败: 连接被拒绝，服务器可能启用了认证', 'error');
                     };
-                } catch (error) {
-                    log(`测试2出错: ${error.message}`, 'error');
+
+                    // 5秒后关闭测试连接
+                    setTimeout(() => {
+                        if (ws.readyState === WebSocket.CONNECTING || ws.readyState === WebSocket.OPEN) {
+                            ws.close();
+                        }
+                    }, 5000);
+                } else {
+                    log(`测试失败: 连接被拒绝，服务器可能启用了认证`, 'error');
                 }
-            }, 6000);
+            } catch (error) {
+                log(`测试出错: ${error.message}`, 'error');
+            }
 
             log('认证测试已启动，请查看测试结果...', 'info');
         }