From bce65c4947018c41c563c507e24d147b2069cda7 Mon Sep 17 00:00:00 2001 From: Takagi <1103069291@qq.com> Date: Tue, 15 Aug 2023 18:02:12 +0800 Subject: [PATCH] fix: handle external exceptions when uploading files (#4431) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit #### What type of PR is this? /kind bug /area console /milestone 2.9.x #### What this PR does / why we need it: 原先使用 uppy 上传文件时抛出异常时，处理了 Halo 系统内部异常，但并未处理外部抛出的异常，例如反向代理等，因而会导致上传文件时卡在 0% 或者 100%。 更改之后当上传抛出异常时，首先会尝试将异常信息转换为 JSON，如果转换失败，则代表为外部异常，此时会抛出异常信息，异常信息格式为 `status: statusText`。 image #### How to test it? 在 Halo 上传接口前增加一层反向代理，并设置最大允许文件值，之后上传超过其值的文件进行尝试，若能够成功抛出异常即可。 #### Which issue(s) this PR fixes: Fixes #4359 #### Does this PR introduce a user-facing change? ```release-note 修复上传文件时由于外部异常而导致进度条不变的问题 ``` --- console/src/components/upload/UppyUpload.vue | 24 ++++++++++++++------ 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/console/src/components/upload/UppyUpload.vue b/console/src/components/upload/UppyUpload.vue index eb95f8a43..af6e46ba3 100644 --- a/console/src/components/upload/UppyUpload.vue +++ b/console/src/components/upload/UppyUpload.vue @@ -71,15 +71,25 @@ const uppy = computed(() => { method: props.method, limit: 5, timeout: 0, - getResponseError: (responseText) => { - const response = JSON.parse(responseText); - const { title, detail } = (response || {}) as ProblemDetail; - const message = [title, detail].filter(Boolean).join(": "); + getResponseError: (responseText: string, response: unknown) => { + try { + const response = JSON.parse(responseText); + if (typeof response === "object" && response && response) { + const { title, detail } = (response || {}) as ProblemDetail; + const message = [title, detail].filter(Boolean).join(": "); - if (message) { - Toast.error(message, { duration: 5000 }); + if (message) { + Toast.error(message, { duration: 5000 }); - return new Error(message); + return new Error(message); + } + } + } catch (e) { + const responseBody = response as XMLHttpRequest; + const { status, statusText } = responseBody; + const defaultMessage = [status, statusText].join(": "); + Toast.error(defaultMessage, { duration: 5000 }); + return new Error(defaultMessage); } return new Error("Internal Server Error"); },