Element|Element 组件导入Excel数据，如导入失败，如何直接下载带错误信息的 Excel（） Element组件导入Excel数据，如导

项目使用的 Element 的 upload组件。
需求：
需求很简单，导入 Excel 数据，如果导入成功，提示‘导入成功’，如果导入失败，直接下载后端返回的 excel文件流。
遇到的问题
刚开始采取的是 upload组件默认上传行为的方式，
但是由于upload组件默认是 post请求，请求时无法指定 responseType="blob"，下载下来的excel表会提示文件损坏，无法打开。
贴下当时的代码：
上传错误时后端返回的文件流：

文章图片

【Element|Element 组件导入Excel数据，如导入失败，如何直接下载带错误信息的 Excel（）】如果直接用后端返回的文件流 data创建Blob对象(blob = new Blob([data]))，再用 URL.createObjectURL(blob) 得到一个url赋值给a标签，下载下来的文件是无法打开的。

文章图片

解决方案
采用 upload组件的 http-request，覆盖默认的上传行为，实现自定义上传。

文章图片

注意(重要)：

请求时 responseType: "blob" 该参数必填，不然下载下来的excel表会提示文件损坏，无法打开

延伸
请求时，response = 'blob'，

得到文件流，直接下载
得到 JSON 返回数据，需要展现提示信息或错误信息，那么需要转换一下。因为请求失败时，后端返回的json对象，如：{"messsage":"备件异常","code":301,"success": false}，也被转成了 blob。
思路：根据得到的 response.type 返回内容的 MIME TYPE 来判断：

下载文件或去做一些 JSON 数据提示的操作。如果是 JSON类型那就把 Blob 通过 readAsText 转为JSON格式。这种方式应该是支持IE10和IE10以上版本，具体的自己查查。

文章图片