Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add response header in debug view #1691

Merged
merged 9 commits into from
Apr 9, 2021
3 changes: 3 additions & 0 deletions api/internal/handler/route_online_debug/route_online_debug.go
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,7 @@ type DebugOnlineInput struct {

type Result struct {
Code int `json:"code,omitempty"`
Header interface{} `json:"header,omitempty"`
Message string `json:"message,omitempty"`
Data interface{} `json:"data,omitempty"`
}
Expand Down Expand Up @@ -138,10 +139,12 @@ func (h *HTTPProtocolSupport) RequestForwarding(c droplet.Context) (interface{},
err = json.Unmarshal(_body, &returnData)
if err != nil {
result.Code = resp.StatusCode
result.Header = resp.Header
result.Message = resp.Status
result.Data = string(_body)
} else {
result.Code = resp.StatusCode
result.Header = resp.Header
result.Message = resp.Status
result.Data = returnData
}
Expand Down
19 changes: 19 additions & 0 deletions web/src/pages/Route/components/DebugViews/DebugDrawView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ const DebugDrawView: React.FC<RouteModule.DebugDrawProps> = (props) => {
const [authForm] = Form.useForm();
const [headerForm] = Form.useForm();
const [responseCode, setResponseCode] = useState<string>();
liuxiran marked this conversation as resolved.
Show resolved Hide resolved
const [responseHeader, setResponseHeader] = useState<string>();
const [loading, setLoading] = useState(false);
const [codeMirrorHeight, setCodeMirrorHeight] = useState<number | string>(50);
const bodyCodeMirrorRef = useRef<any>(null);
Expand Down Expand Up @@ -192,6 +193,7 @@ const DebugDrawView: React.FC<RouteModule.DebugDrawProps> = (props) => {
.then((req) => {
setLoading(false);
setResponseCode(JSON.stringify(req.data.data, null, 2));
setResponseHeader(JSON.stringify(req.data.header, null, 2));
setCodeMirrorHeight('auto');
})
.catch(() => {
Expand Down Expand Up @@ -345,6 +347,23 @@ const DebugDrawView: React.FC<RouteModule.DebugDrawProps> = (props) => {
</PanelSection>
<PanelSection title={formatMessage({ id: 'page.route.PanelSection.title.responseResult' })}>
<Tabs>
<TabPane tab={formatMessage({ id: 'page.route.TabPane.header' })} key="header">
<Spin tip="Loading..." spinning={loading}>
<CodeMirror
value={responseHeader}
height={codeMirrorHeight}
options={{
mode: 'json-ld',
readOnly: 'nocursor',
lineWrapping: true,
lineNumbers: true,
showCursorWhenSelecting: true,
autofocus: true,
scrollbarStyle: null,
}}
/>
</Spin>
</TabPane>
<TabPane tab={formatMessage({ id: 'page.route.TabPane.response' })} key="response">
<Spin tip="Loading..." spinning={loading}>
<CodeMirror
Expand Down
1 change: 1 addition & 0 deletions web/src/pages/Route/locales/en-US.ts
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,7 @@ export default {
'page.route.TabPane.headerParams': 'Header Params',
'page.route.TabPane.authentication': 'Authentication',
'page.route.TabPane.response': 'Response',
'page.route.TabPane.header': 'Response Header',
'page.route.debugWithoutAuth': 'This request does not use any authorization.',
'page.route.button.exportOpenApi': 'Export OpenAPI',
'page.route.exportRoutesTips': 'Please choose the type of file you want to export',
Expand Down
1 change: 1 addition & 0 deletions web/src/pages/Route/locales/zh-CN.ts
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,7 @@ export default {
'page.route.TabPane.headerParams': '请求头参数',
'page.route.TabPane.authentication': '认证',
'page.route.TabPane.response': '响应结果',
'page.route.TabPane.header': '响应请求头参数',
'page.route.debugWithoutAuth': '当前请求不启用任何认证方式。',
'page.route.button.exportOpenApi': '导出 OpenAPI',
'page.route.exportRoutesTips': '请选择导出文件的类型',
Expand Down