本文共 1183 字，大约阅读时间需要 3 分钟。

后台接口返回数据处理

在实际项目中，我们经常需要通过后台接口获取数据并进行处理。以下是一种常见的技术实现方案，重点介绍了文件下载功能的实现方式。

axios fetch 实现

我们可以使用 axios 进行异步请求，以下是代码示例：

this.axios({    method: "get",    headers: {        "content-type": "application/json",        Authorization: "Bearer " + sessionStorage.getItem("access_token")    },    url: 'your_URL',    params: {'name':'Jack'},    responseType: "blob"}).then(function (res) {    // 处理 blob 数据    let blob = new Blob([res.data]);    let url = window.URL.createObjectURL(blob);        // 创建下载链接    let a = document.createElement("a");    a.href = url;    a.download = "表格.xlsx";    a.click();        // 释放 url    window.URL.revokeObjectURL(url);}).catch(function (res) {    console.log("error", res);});

注意事项

实现效果

通过上述方法，用户可以在浏览器中直接下载所需的文件，操作流程简洁易懂。该方法适用于需要将后台接口返回的二维数据（如 Excel 文件）直接展示给用户的场景。

可扩展性

该方案基于现代浏览器的 Blob API 实现，兼容性较高。需要注意的是，某些老旧浏览器可能不支持此方法，具体可根据项目需求进行适配。

总结

通过上述方法，我们可以轻松实现后台接口返回数据的文件下载功能。关键在于正确设置 responseType 和正确处理 blob 数据。

转载地址：http://nuwnz.baihongyu.com/