|
|
@@ -1,6 +1,7 @@
|
|
|
import React, { useState, useEffect } from 'react';
|
|
|
import { Form, Input, Button, Tabs, Divider, Alert, Typography } from 'antd';
|
|
|
import { SendOutlined, LoadingOutlined, FileExcelOutlined, FileOutlined } from '@ant-design/icons';
|
|
|
+import { convertClient } from '@/client/api';
|
|
|
import TemplateSelector from './TemplateSelector';
|
|
|
import ApiTesterFileUpload from './ApiTesterFileUpload';
|
|
|
|
|
|
@@ -37,10 +38,11 @@ export function ApiTester() {
|
|
|
|
|
|
// 处理模板选择
|
|
|
const handleTemplateSelected = (templateId: string) => {
|
|
|
- setSelectedTemplateId(templateId);
|
|
|
+ const id = parseInt(templateId, 10);
|
|
|
+ setSelectedTemplateId(isNaN(id) ? undefined : id);
|
|
|
try {
|
|
|
const currentBody = JSON.parse(requestBody);
|
|
|
- currentBody.templateId = templateId;
|
|
|
+ currentBody.templateId = isNaN(id) ? undefined : id;
|
|
|
setRequestBody(JSON.stringify(currentBody, null, 2));
|
|
|
} catch (error) {
|
|
|
console.error('解析请求体失败', error);
|
|
|
@@ -60,74 +62,32 @@ export function ApiTester() {
|
|
|
};
|
|
|
|
|
|
const testApi = async () => {
|
|
|
- // 验证必填参数
|
|
|
- try {
|
|
|
- const body = JSON.parse(requestBody);
|
|
|
- if (!body.templateId || !body.input) {
|
|
|
- setResponse({
|
|
|
- status: 400,
|
|
|
- statusText: '请求参数错误',
|
|
|
- headers: {},
|
|
|
- data: {
|
|
|
- success: false,
|
|
|
- message: '请求失败:templateId 和 input 均为必填参数',
|
|
|
- errors: {
|
|
|
- templateId: !body.templateId ? '模板ID不能为空' : undefined,
|
|
|
- input: !body.input ? 'Excel文件数据不能为空' : undefined
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- setResponse({
|
|
|
- status: 400,
|
|
|
- statusText: '请求体格式错误',
|
|
|
- headers: {},
|
|
|
- data: {
|
|
|
- success: false,
|
|
|
- message: 'JSON格式错误,请检查请求体格式'
|
|
|
- }
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
setLoading(true);
|
|
|
try {
|
|
|
- const requestOptions: RequestInit = {
|
|
|
- method: 'POST',
|
|
|
+ const body = JSON.parse(requestBody);
|
|
|
+ const start = performance.now();
|
|
|
+ const res = await convertClient.$post({
|
|
|
+ json: body,
|
|
|
+ },{
|
|
|
headers: {
|
|
|
- 'Content-Type': 'application/json',
|
|
|
'X-API-Key': apiKey
|
|
|
- },
|
|
|
- body: requestBody
|
|
|
- };
|
|
|
-
|
|
|
- const start = performance.now();
|
|
|
- const response = await fetch(endpointUrl, requestOptions);
|
|
|
+ }
|
|
|
+ });
|
|
|
const end = performance.now();
|
|
|
|
|
|
- const contentType = response.headers.get('Content-Type') || '';
|
|
|
- let data;
|
|
|
-
|
|
|
- if (contentType.includes('application/json')) {
|
|
|
- data = await response.json();
|
|
|
- } else {
|
|
|
- data = await response.text();
|
|
|
- }
|
|
|
-
|
|
|
- // 提取响应头
|
|
|
const headers: Record<string, string> = {};
|
|
|
- response.headers.forEach((value, key) => {
|
|
|
- headers[key] = value;
|
|
|
- });
|
|
|
-
|
|
|
- // 添加响应时间
|
|
|
+ if (res.headers) {
|
|
|
+ res.headers.forEach((value, key) => {
|
|
|
+ headers[key] = value;
|
|
|
+ });
|
|
|
+ }
|
|
|
headers['X-Response-Time'] = `${(end - start).toFixed(2)}ms`;
|
|
|
|
|
|
+ const data = await res.json();
|
|
|
+
|
|
|
setResponse({
|
|
|
- status: response.status,
|
|
|
- statusText: response.statusText,
|
|
|
+ status: res.status,
|
|
|
+ statusText: res.statusText,
|
|
|
headers,
|
|
|
data
|
|
|
});
|