支持下载请求，返回值展示优化

2021-11-15 23:11:19 +08:00
parent 1ba75d3e29
commit 157d06bf8d
6 changed files with 164 additions and 65 deletions
--- a/zyplayer-doc-swagger-plus/src/main/java/com/zyplayer/doc/swaggerplus/controller/SwaggerPoxyRequestController.java
+++ b/zyplayer-doc-swagger-plus/src/main/java/com/zyplayer/doc/swaggerplus/controller/SwaggerPoxyRequestController.java
@@ -15,6 +15,8 @@ import org.springframework.web.bind.annotation.RestController;

 import javax.annotation.Resource;
 import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+import java.util.Objects;

 /**
 * 请求参数控制器
@@ -44,4 +46,18 @@ public class SwaggerPoxyRequestController {
 		ProxyRequestResultVo requestResult = swaggerHttpRequestService.proxyRequest(request, requestParam);
 		return DocResponseJson.ok(requestResult);
 	}
+	
+	/**
+	 * 代理接口下载请求
+	 *
+	 * @return 请求参数
+	 * @author 暮光：城中城
+	 * @since 2021年10月16日
+	 */
+	@ResponseBody
+	@PostMapping(value = "/download")
+	public ResponseJson<ProxyRequestResultVo> download(HttpServletRequest request, HttpServletResponse response, ProxyRequestParam requestParam) {
+		swaggerHttpRequestService.proxyDownload(request, response, requestParam);
+		return DocResponseJson.ok();
+	}
 }
--- a/zyplayer-doc-swagger-plus/src/main/java/com/zyplayer/doc/swaggerplus/service/SwaggerHttpRequestService.java
+++ b/zyplayer-doc-swagger-plus/src/main/java/com/zyplayer/doc/swaggerplus/service/SwaggerHttpRequestService.java
@@ -1,9 +1,8 @@
 package com.zyplayer.doc.swaggerplus.service;

-import cn.hutool.http.HttpRequest;
-import cn.hutool.http.HttpResponse;
-import cn.hutool.http.HttpUtil;
-import cn.hutool.http.Method;
+import cn.hutool.core.io.FileUtil;
+import cn.hutool.core.io.IoUtil;
+import cn.hutool.http.*;
 import com.zyplayer.doc.core.exception.ConfirmException;
 import com.zyplayer.doc.data.repository.manage.entity.SwaggerGlobalParam;
 import com.zyplayer.doc.data.service.manage.SwaggerGlobalParamService;
@@ -21,7 +20,9 @@ import org.springframework.stereotype.Service;
 import javax.annotation.Resource;
 import javax.servlet.http.Cookie;
 import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
 import java.net.HttpCookie;
+import java.net.URLEncoder;
 import java.util.*;
 import java.util.stream.Collectors;
 import java.util.stream.Stream;
@@ -66,6 +67,27 @@ public class SwaggerHttpRequestService {
 		return resultStr;
 	}
 	
+	/**
+	 * 执行代理请求
+	 *
+	 * @author 暮光：城中城
+	 * @since 2021-11-04
+	 */
+	public void proxyDownload(HttpServletRequest request, HttpServletResponse response, ProxyRequestParam requestParam) {
+		try {
+			HttpResponse httpResponse = this.getHttpResponse(request, requestParam);
+			Map<String, List<String>> responseHeaders = httpResponse.headers();
+			if (MapUtils.isNotEmpty(responseHeaders)) {
+				for (Map.Entry<String, List<String>> httpHeader : responseHeaders.entrySet()) {
+					response.addHeader(httpHeader.getKey(), String.join(";", httpHeader.getValue()));
+				}
+			}
+			httpResponse.writeBody(response.getOutputStream(), true, null);
+		} catch (Exception e) {
+			e.printStackTrace();
+		}
+	}
+	
 	/**
 	 * 执行代理请求
 	 *
@@ -76,6 +98,36 @@ public class SwaggerHttpRequestService {
 		ProxyRequestResultVo resultVo = new ProxyRequestResultVo();
 		long startTime = System.currentTimeMillis();
 		try {
+			HttpResponse httpResponse = getHttpResponse(request, requestParam);
+			resultVo.setData(httpResponse.body());
+			resultVo.setStatus(httpResponse.getStatus());
+			resultVo.setContentLength(httpResponse.bodyBytes().length);
+			// 设置返回的cookies
+			List<HttpCookie> responseCookies = httpResponse.getCookies();
+			if (CollectionUtils.isNotEmpty(responseCookies)) {
+				resultVo.setCookies(responseCookies.stream().map(val -> new HttpCookieVo(val.getName(), val.getValue())).collect(Collectors.toList()));
+			}
+			// 设置返回的headers
+			Map<String, List<String>> responseHeaders = httpResponse.headers();
+			if (MapUtils.isNotEmpty(responseHeaders)) {
+				List<HttpHeaderVo> headerList = new ArrayList<>(responseHeaders.size());
+				for (Map.Entry<String, List<String>> httpHeader : responseHeaders.entrySet()) {
+					HttpHeaderVo vo = new HttpHeaderVo();
+					vo.setName(httpHeader.getKey());
+					vo.setValue(String.join(";", httpHeader.getValue()));
+					headerList.add(vo);
+				}
+				resultVo.setHeaders(headerList);
+			}
+		} catch (Exception e) {
+			e.printStackTrace();
+			resultVo.setErrorMsg(e.getMessage());
+		}
+		resultVo.setUseTime(System.currentTimeMillis() - startTime);
+		return resultVo;
+	}
+	
+	private HttpResponse getHttpResponse(HttpServletRequest request, ProxyRequestParam requestParam){
 		// 执行请求
 		Method method = requestMethodMap.get(requestParam.getMethod());
 		if (method == null) {
@@ -108,33 +160,7 @@ public class SwaggerHttpRequestService {
 //				httpRequest.contentType(requestParam.getContentType());
 //			}
 		// 执行请求
-			HttpResponse httpResponse = httpRequest.timeout(10000).execute();
-			resultVo.setData(httpResponse.body());
-			resultVo.setStatus(httpResponse.getStatus());
-			resultVo.setContentLength(httpResponse.bodyBytes().length);
-			// 设置返回的cookies
-			List<HttpCookie> responseCookies = httpResponse.getCookies();
-			if (CollectionUtils.isNotEmpty(responseCookies)) {
-				resultVo.setCookies(responseCookies.stream().map(val -> new HttpCookieVo(val.getName(), val.getValue())).collect(Collectors.toList()));
-			}
-			// 设置返回的headers
-			Map<String, List<String>> responseHeaders = httpResponse.headers();
-			if (MapUtils.isNotEmpty(responseHeaders)) {
-				List<HttpHeaderVo> headerList = new ArrayList<>(responseHeaders.size());
-				for (Map.Entry<String, List<String>> httpHeader : responseHeaders.entrySet()) {
-					HttpHeaderVo vo = new HttpHeaderVo();
-					vo.setName(httpHeader.getKey());
-					vo.setValue(String.join(";", httpHeader.getValue()));
-					headerList.add(vo);
-				}
-				resultVo.setHeaders(headerList);
-			}
-		} catch (Exception e) {
-			e.printStackTrace();
-			resultVo.setErrorMsg(e.getMessage());
-		}
-		resultVo.setUseTime(System.currentTimeMillis() - startTime);
-		return resultVo;
+		return httpRequest.timeout(10000).execute();
 	}
 	
 	/**
--- a/zyplayer-doc-ui/swagger-ui/src/views/apiRequest/ApiRequest.vue
+++ b/zyplayer-doc-ui/swagger-ui/src/views/apiRequest/ApiRequest.vue
@@ -1,6 +1,6 @@
 <template>
    <div>
-        <a-input-search v-model:value="docUrl" @search="sendRequest">
+        <a-input-search v-model:value="docUrl" @search="sendRequest" placeholder="请输入目标URL地址">
            <template #addonBefore>
                <a-select v-model:value="docInfoShow.method" style="width: 100px;">
                    <a-select-option :value="method" v-for="method in methodList">{{method.toUpperCase()}}</a-select-option>
@@ -83,23 +83,40 @@
            VerticalAlignTopOutlined, VerticalAlignBottomOutlined, CloseOutlined, ParamTable, ParamBody, ApiRequestResult,
        },
        setup(props) {
-            let docUrl = ref('http://baidu.com');
+            let docUrl = ref('');
            let activePage = ref('urlParam');
            const route = useRoute();
            const store = useStore();
            store.commit('addTableName', {key: route.fullPath, val: '接口请求' + route.query.id});
+            let globalParam = store.state.globalParam || [];
+            let nextIndex = 1;
            // URL参数处理
            const urlParamRef = ref();
            let urlParamList = ref([]);
            // Header参数处理
            const headerParamRef = ref();
-            let headerParamList = ref([]);
+            let headerParamListProp = [];
+            let headerParamListGlobal = globalParam.filter(item => item.paramType === 2);
+            headerParamListGlobal.forEach(item => {
+                headerParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
+            });
+            let headerParamList = ref(JSON.parse(JSON.stringify(headerParamListProp)));
            // cookie参数处理
            const cookieParamRef = ref();
-            let cookieParamList = ref([]);
+            let cookieParamListProp = [];
+            let cookieParamListGlobal = globalParam.filter(item => item.paramType === 3);
+            cookieParamListGlobal.forEach(item => {
+                cookieParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
+            });
+            let cookieParamList = ref(JSON.parse(JSON.stringify(cookieParamListProp)));
            // form参数处理
            const formParamRef= ref();
-            let formParamList = ref([]);
+            let formParamListProp = [];
+            let formParamListGlobal = globalParam.filter(item => item.paramType === 1);
+            formParamListGlobal.forEach(item => {
+                formParamListProp.push({name: item.paramKey, value: item.paramValue, type: 'string', key: 'g' + (nextIndex++)});
+            });
+            let formParamList = ref(JSON.parse(JSON.stringify(formParamListProp)));
            // form参数处理
            const formEncodeParamRef = ref();
            let formEncodeParamList = ref([]);
@@ -114,6 +131,10 @@
            let requestResult = ref({});
            let requestLoading = ref(false);
            const sendRequest = () => {
+                if (!docUrl.value) {
+                    message.error('请输入请求的目标URL地址');
+                    return;
+                }
                const formData = new FormData();
                let urlParamSelected = urlParamRef.value.getSelectedRowKeys();
                let urlParamStr = urlParamList.value.filter(item => urlParamSelected.indexOf(item.key) >= 0 && item.name && item.value).map(item => {
--- a/zyplayer-doc-ui/swagger-ui/src/views/apiRequest/ApiRequestResult.vue
+++ b/zyplayer-doc-ui/swagger-ui/src/views/apiRequest/ApiRequestResult.vue
@@ -126,6 +126,8 @@
                }
            }
            const initData = () => {
+                resultDataContentOrigin.value = '';
+                resultDataContentFormat.value = '';
                if (props.result.data) {
                    resultData.value = props.result.data;
                    if (props.result.data.headers) {
--- a/zyplayer-doc-ui/swagger-ui/src/views/doc/docView/DocDebugger.vue
+++ b/zyplayer-doc-ui/swagger-ui/src/views/doc/docView/DocDebugger.vue
@@ -1,8 +1,8 @@
 <template>
    <div>
-        <a-input-search :addon-before="docInfoShow.method.toUpperCase()" v-model:value="docUrl" @search="sendRequest">
+        <a-input-search :addon-before="docInfoShow.method.toUpperCase()" v-model:value="docUrl" @search="sendRequest" placeholder="请输入目标URL地址">
            <template #enterButton>
-                <a-button type="primary" :loading="requestLoading">发送请求</a-button>
+                <a-button type="primary" :loading="requestLoading">{{isDownloadRequest?'下载文件':'发送请求'}}</a-button>
            </template>
        </a-input-search>
        <a-tabs v-model:activeKey="activePage" closable @tab-click="activePageChange" style="padding: 5px 10px 0;">
@@ -19,7 +19,7 @@
                            <a-radio value="form">form-data</a-radio>
                            <a-radio value="formUrlEncode">x-www-form-urlencoded</a-radio>
                            <a-radio value="row">row</a-radio>
-                            <a-radio value="binary">binary</a-radio>
+<!--                            <a-radio value="binary">binary</a-radio>-->
                        </a-radio-group>
                        <a-select v-if="bodyParamType === 'row'" v-model:value="consumesParamType" size="small" style="margin-left: 10px;vertical-align: top;width: 100px;">
                            <a-select-option value="json">JSON</a-select-option>
@@ -55,7 +55,10 @@
                <a-button v-else @click="showQueryParam" type="link">展开参数</a-button>
            </template>
        </a-tabs>
-        <DocDebuggerResult :result="requestResult" :loading="requestLoading"></DocDebuggerResult>
+        <DocDebuggerResult v-if="!isDownloadRequest" :result="requestResult" :loading="requestLoading"></DocDebuggerResult>
+        <form method="post" ref="downloadFormRef" :action="downloadFormParam.url" target="_blank">
+            <input type="hidden" :name="key" :value="val" v-for="(val,key) in downloadFormParam.param">
+        </form>
    </div>
 </template>

@@ -72,6 +75,7 @@
    import 'mavon-editor/dist/markdown/github-markdown.min.css'
    import 'mavon-editor/dist/css/index.css'
    import {zyplayerApi} from "../../../api";
+    import {getZyplayerApiBaseUrl} from "../../../api/request/utils.js";

    export default {
        props: {
@@ -178,7 +182,14 @@
            // 发送请求
            let requestResult = ref({});
            let requestLoading = ref(false);
+            let downloadFormParam = ref({url: getZyplayerApiBaseUrl() + '/doc-swagger/proxy/download', param: {}});
+            let downloadFormRef = ref();
+            let isDownloadRequest = (props.docInfoShow.produces === 'application/octet-stream');
            const sendRequest = () => {
+                if (!docUrl.value) {
+                    message.error('请输入请求的目标URL地址');
+                    return;
+                }
                const formData = new FormData();
                let urlParamSelected = urlParamRef.value.getSelectedRowKeys();
                let urlParamStr = urlParamList.value.filter(item => urlParamSelected.indexOf(item.key) >= 0 && item.name && item.value).map(item => {
@@ -216,6 +227,22 @@
                //     formData.append('files[]', file);
                // });
                let url = urlParamStr ? (docUrl.value + '?' + urlParamStr) : docUrl.value;
+                // 下载请求
+                if (isDownloadRequest) {
+                    downloadFormParam.value.param = {
+                        url: url,
+                        host: urlDomain,
+                        method: props.docInfoShow.method,
+                        contentType: props.docInfoShow.consumes,
+                        headerParam: JSON.stringify(headerParamArr),
+                        cookieParam: JSON.stringify(cookieParamArr),
+                        formParam: JSON.stringify(formParamArr),
+                        formEncodeParam: JSON.stringify(formEncodeParamArr),
+                        bodyParam: bodyParamStr,
+                    };
+                    setTimeout(() => downloadFormRef.value.submit(), 0);
+                } else {
+                    // 正常请求
                    formData.append('url', url);
                    formData.append('host', urlDomain);
                    formData.append('method', props.docInfoShow.method);
@@ -233,6 +260,7 @@
                    }).catch(e => {
                        requestLoading.value = false;
                    });
+                }
            };
            let queryParamVisible = ref(true);
            const hideQueryParam = () => {
@@ -252,6 +280,9 @@
                sendRequest,
                requestResult,
                consumesParamType,
+                downloadFormParam,
+                downloadFormRef,
+                isDownloadRequest,
                // url参数
                urlParamRef,
                urlParamList,
--- a/zyplayer-doc-ui/swagger-ui/src/views/doc/docView/DocDebuggerResult.vue
+++ b/zyplayer-doc-ui/swagger-ui/src/views/doc/docView/DocDebuggerResult.vue
@@ -1,6 +1,6 @@
 <template>
    <div v-if="result.data" style="margin-bottom: 30px;">
-        <div v-if="result.data.data" style="margin-bottom: 30px;">
+        <div v-if="result.data.data || result.data.status === 200" style="margin-bottom: 30px;">
            <a-tabs v-model:activeKey="activePage" @tab-click="" style="padding: 5px 10px 0;">
                <a-tab-pane tab="Body" key="body" forceRender>
                    <div style="margin-bottom: 10px;">
@@ -126,6 +126,8 @@
                }
            }
            const initData = () => {
+                resultDataContentOrigin.value = '';
+                resultDataContentFormat.value = '';
                if (props.result.data) {
                    resultData.value = props.result.data;
                    if (props.result.data.headers) {
@@ -150,7 +152,8 @@
                    if (props.result.data.cookies) {
                        resultCookies.value = props.result.data.cookies;
                    }
-                    if (props.result.data.data) {
+                    if (props.result.data.data || props.result.data.status === 200) {
+                        resultDataContentFormat.value = props.result.data.data;
                        resultDataContentOrigin.value = props.result.data.data;
                        try {
                            if (bodyShowFormatType.value === 'xml') {