From f8a7da19597e74128e7d482617338004b45aec06 Mon Sep 17 00:00:00 2001 From: Zhuym Date: Thu, 30 Jan 2025 22:28:40 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0index.html=EF=BC=8C=E9=87=8D?= =?UTF-8?q?=E6=9E=84API=E8=B0=83=E7=94=A8=E5=87=BD=E6=95=B0=EF=BC=8C?= =?UTF-8?q?=E5=A2=9E=E5=BC=BA=E9=94=99=E8=AF=AF=E5=A4=84=E7=90=86=E9=80=BB?= =?UTF-8?q?=E8=BE=91=E4=BB=A5=E5=85=BC=E5=AE=B9=E9=9D=9EJSON=E5=93=8D?= =?UTF-8?q?=E5=BA=94=EF=BC=8C=E5=B9=B6=E4=BC=98=E5=8C=96=E6=97=A5=E5=BF=97?= =?UTF-8?q?=E8=AE=B0=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 160 +++++++++++++++++++++++++++++++---------------------- 1 file changed, 93 insertions(+), 67 deletions(-) diff --git a/index.html b/index.html index 0633745..9a53747 100644 --- a/index.html +++ b/index.html @@ -223,7 +223,7 @@ } .MuiTypography-h6 { - font-size: 1.1rem !重要; + font-size: 1.1rem !important; } /* 表单样式 */ @@ -462,6 +462,98 @@ const [isLogExpanded, setIsLogExpanded] = React.useState(false); const formRefs = React.useRef({}); + const handleApiCall = async (endpoint, method = "GET", formData = null, config) => { + try { + const options = { + method, + headers: { "Content-Type": "application/json" }, + credentials: "include" + }; + + let url = `${apiBase}${endpoint}`; + + if (method === "GET" && config?.queryParams) { + const params = new URLSearchParams(); + config.queryParams.forEach(param => { + if (formData?.[param]) params.append(param, formData[param]); + }); + url += `?${params.toString()}`; + } + + if (method === "POST" && config?.requestFormat === "json") { + options.body = JSON.stringify(formData); + } + + const res = await fetch(url, options); + const rawText = await res.text(); + + let responseData; + try { + responseData = JSON.parse(rawText); + } catch { + responseData = { + status: res.status, + statusText: res.statusText, + rawResponse: rawText + }; + } + + // 将状态码添加到显示结果中 + const displayResponse = { + status: res.status, + statusText: res.statusText, + ...responseData + }; + + setResponse(JSON.stringify(displayResponse, null, 2)); + + // 保存日志 + saveLog(endpoint, { + method, + url, + ...formData, + status: res.status + }, displayResponse); + + // 特殊处理登录成功的情况 + if (config?.endpoint === "/qr" && responseData.userId) { + setUserId(responseData.userId.toString()); + setCookie("userId", responseData.userId.toString(), 7); + + Object.entries(formConfigs).forEach(([key, formConfig]) => { + const userIdField = formConfig.fields.find( + field => field.id.toLowerCase().includes("userid") + ); + if (userIdField && formRefs.current[key]) { + formRefs.current[key].updateField(userIdField.id, responseData.userId.toString()); + } + }); + } + + // 显示消息提示 + setSnackbarMessage(responseData.info || `请求完成 (${res.status} ${res.statusText})`); + setSnackbarOpen(true); + + } catch (error) { + const errorResponse = { + error: true, + message: error.message, + type: error.name + }; + + setResponse(JSON.stringify(errorResponse, null, 2)); + setSnackbarMessage(`请求发生错误: ${error.message}`); + setSnackbarOpen(true); + + // 保存错误日志 + saveLog(endpoint, { + method, + url: `${apiBase}${endpoint}`, + ...formData + }, errorResponse); + } + }; + // Cookie操作函数 function setCookie(name, value, days) { const d = new Date(); @@ -493,72 +585,6 @@ localStorage.setItem('apiLogs', JSON.stringify(updatedLogs)); }; - const handleApiCall = async (endpoint, method = "GET", formData = null, config) => { - try { - const options = { - method, - headers: { "Content-Type": "application/json" }, - credentials: "include" // 跨域凭证 - }; - - let url = `${apiBase}${endpoint}`; - - // GET请求参数处理 - if (method === "GET" && config?.queryParams) { - const params = new URLSearchParams(); - config.queryParams.forEach(param => { - if (formData?.[param]) params.append(param, formData[param]); - }); - url += `?${params.toString()}`; - } - - // POST请求体处理 - if (method === "POST" && config?.requestFormat === "json") { - options.body = JSON.stringify(formData); - } - - const res = await fetch(url, options); - const rawText = await res.text(); // 先获取原始文本 - - // 尝试解析JSON（兼容非JSON响应） - let data; - try { - data = JSON.parse(rawText); - } catch { - data = { _raw: rawText }; // 解析失败时保留原始响应 - } - - setResponse(JSON.stringify(data, null, 2)); // 显示原始内容 - - // 保存日志（包含状态码） - saveLog(endpoint, { ...formData, _status: res.status }, data); - - // 登录处理逻辑 - if (config?.endpoint === "/qr" && data.userId) { - setUserId(data.userId.toString()); - setCookie("userId", data.userId.toString(), 7); - - Object.entries(formConfigs).forEach(([key, formConfig]) => { - const userIdField = formConfig.fields.find( - field => field.id.toLowerCase().includes("userid") - ); - if (userIdField && formRefs.current[key]) { - formRefs.current[key].updateField(userIdField.id, data.userId.toString()); - } - }); - } - - // 显示服务器返回的原始提示（兼容非JSON响应） - setSnackbarMessage(data.info || data._raw || "请求完成"); - setSnackbarOpen(true); - - } catch (error) { - setResponse(`Error: ${error.message}`); - setSnackbarMessage(`网络错误: ${error.message}`); - setSnackbarOpen(true); - } - }; - const handleMusicChange = (e) => { const { name, value } = e.target; setMusicData(prev => ({