wood/aimodels-prices
1
0
Fork 0
mirror of https://github.com/woodchen-ink/aimodels-prices.git synced 2025-07-19 06:01:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

Improve frontend debugging and data processing with enhanced input validation

Browse Source
This commit is contained in:
wood chen 2025-02-07 21:46:16 +08:00
parent 3f5799abb7
commit fa22ecc613
1 changed files with 49 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
main.ts
View File

@ -16,6 +16,7 @@ const html = `<!DOCTYPE html>
.message { margin-top: 10px; padding: 10px; border-radius: 4px; } .message { margin-top: 10px; padding: 10px; border-radius: 4px; }
.error { background: #ffebee; color: #c62828; } .error { background: #ffebee; color: #c62828; }
.success { background: #e8f5e9; color: #2e7d32; } .success { background: #e8f5e9; color: #2e7d32; }
pre { background: #f5f5f5; padding: 10px; border-radius: 4px; overflow-x: auto; }
</style> </style>
</head> </head>
<body> <body>
@ -32,18 +33,19 @@ const html = `<!DOCTYPE html>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="channel_type">Channel Type:</label> <label for="channel_type">Channel Type:</label>
<input type="number" id="channel_type" name="channel_type" required> <input type="number" id="channel_type" name="channel_type" min="0" step="1" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="input">Input Price:</label> <label for="input">Input Price:</label>
<input type="number" id="input" name="input" step="0.0001" required> <input type="number" id="input" name="input" min="0" step="0.0001" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="output">Output Price:</label> <label for="output">Output Price:</label>
<input type="number" id="output" name="output" step="0.0001" required> <input type="number" id="output" name="output" min="0" step="0.0001" required>
</div> </div>
<button type="submit">Update Price</button> <button type="submit">Update Price</button>
<div id="message"></div> <div id="message"></div>
<div id="debug" style="margin-top: 20px;"></div>
</form> </form>
</div> </div>
@ -51,40 +53,20 @@ const html = `<!DOCTYPE html>
document.getElementById('priceForm').onsubmit = async (e) => { document.getElementById('priceForm').onsubmit = async (e) => {
e.preventDefault(); e.preventDefault();
const messageDiv = document.getElementById('message'); const messageDiv = document.getElementById('message');
const debugDiv = document.getElementById('debug');
try { try {
// 获取表单数据 // 获取表单数据
const model = document.getElementById('model').value.trim();
const type = document.getElementById('type').value.trim();
const channel_type = document.getElementById('channel_type').value;
const input = document.getElementById('input').value;
const output = document.getElementById('output').value;
// 验证必填字段
if (!model || !type || channel_type === '' || input === '' || output === '') {
throw new Error('请填写所有字段');
}
// 验证数字格式
const data = { const data = {
model, model: document.getElementById('model').value.trim(),
type, type: document.getElementById('type').value.trim(),
channel_type: Number(channel_type), channel_type: Number(document.getElementById('channel_type').value),
input: Number(input), input: Number(document.getElementById('input').value),
output: Number(output) output: Number(document.getElementById('output').value)
}; };
// 验证数字有效性 // 显示发送的数据（调试用）
if (isNaN(data.channel_type) || isNaN(data.input) || isNaN(data.output)) { debugDiv.innerHTML = '<strong>发送的数据:</strong><pre>' + JSON.stringify(data, null, 2) + '</pre>';
throw new Error('请输入有效的数字');
}
// 验证数字范围（允许等于0）
if (data.channel_type < 0 || data.input < 0 || data.output < 0) {
throw new Error('数字不能小于0');
}
console.log('Sending data:', data); // 调试日志
const response = await fetch('/api/prices', { const response = await fetch('/api/prices', {
method: 'POST', method: 'POST',
@ -93,12 +75,15 @@ const html = `<!DOCTYPE html>
}); });
const result = await response.json(); const result = await response.json();
console.log('Server response:', result); // 调试日志
// 显示服务器响应（调试用）
debugDiv.innerHTML += '<strong>服务器响应:</strong><pre>' + JSON.stringify(result, null, 2) + '</pre>';
if (response.ok) { if (response.ok) {
messageDiv.className = 'message success'; messageDiv.className = 'message success';
messageDiv.textContent = '价格更新成功！'; messageDiv.textContent = '价格更新成功！';
e.target.reset(); e.target.reset();
debugDiv.innerHTML = ''; // 清除调试信息
} else { } else {
messageDiv.className = 'message error'; messageDiv.className = 'message error';
messageDiv.textContent = result.error || '更新失败'; messageDiv.textContent = result.error || '更新失败';
@ -106,7 +91,7 @@ const html = `<!DOCTYPE html>
} catch (error) { } catch (error) {
console.error('Error:', error); console.error('Error:', error);
messageDiv.className = 'message error'; messageDiv.className = 'message error';
messageDiv.textContent = error.message || '更新失败'; messageDiv.textContent = '更新失败: ' + error.message;
} }
}; };
</script> </script>
@ -166,16 +151,6 @@ async function handler(req: Request): Promise<Response> {
return new Response(null, { headers }); return new Response(null, { headers });
} }
// 提供静态页面
if (url.pathname === "/" || url.pathname === "/index.html") {
return new Response(html, {
headers: {
"Content-Type": "text/html; charset=utf-8",
...headers
}
});
}
// API 端点 // API 端点
if (url.pathname === "/api/prices") { if (url.pathname === "/api/prices") {
if (req.method === "POST") { if (req.method === "POST") {
@ -189,16 +164,29 @@ async function handler(req: Request): Promise<Response> {
const formData = await req.formData(); const formData = await req.formData();
data = {}; data = {};
for (const [key, value] of formData.entries()) { for (const [key, value] of formData.entries()) {
data[key] = value; // 如果值包含逗号，只取第一个值
const actualValue = String(value).split(',')[0];
data[key] = actualValue;
} }
} else { } else {
throw new Error("不支持的内容类型"); throw new Error("不支持的内容类型");
} }
console.log("Received data:", data); // 调试日志 console.log("Received raw data:", data); // 调试日志
// 清理和转换数据
const cleanData = {
model: String(data.model).trim(),
type: String(data.type).trim(),
channel_type: Number(String(data.channel_type).split(',')[0]),
input: Number(String(data.input).split(',')[0]),
output: Number(String(data.output).split(',')[0])
};
console.log("Cleaned data:", cleanData); // 调试日志
// 验证数据 // 验证数据
const error = validateData(data); const error = validateData(cleanData);
if (error) { if (error) {
return new Response(JSON.stringify({ error }), { return new Response(JSON.stringify({ error }), {
status: 400, status: 400,
@ -209,27 +197,19 @@ async function handler(req: Request): Promise<Response> {
}); });
} }
// 转换数据类型
const newPrice = {
model: String(data.model),
type: String(data.type),
channel_type: Number(data.channel_type),
input: Number(data.input),
output: Number(data.output)
};
console.log("Processed data:", newPrice); // 调试日志
// 读取现有数据 // 读取现有数据
const prices = await readPrices(); const prices = await readPrices();
// 添加新数据 // 添加新数据
prices.push(newPrice); prices.push(cleanData);
// 保存数据 // 保存数据
await writePrices(prices); await writePrices(prices);
return new Response(JSON.stringify({ success: true }), { return new Response(JSON.stringify({
success: true,
data: cleanData
}), {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
...headers ...headers
@ -259,6 +239,16 @@ async function handler(req: Request): Promise<Response> {
} }
} }
// 提供静态页面
if (url.pathname === "/" || url.pathname === "/index.html") {
return new Response(html, {
headers: {
"Content-Type": "text/html; charset=utf-8",
...headers
}
});
}
return new Response("Not Found", { return new Response("Not Found", {
status: 404, status: 404,
headers headers