结论:
- 请求头 header 中无需单独设置 responseType: “blob”,下文的只是用来作为响应后不同处理方式的参数判断的
- 后端响应的是以下任何一种都可
- content-type: application/octet-stream;charset=UTF-8
- content-type: application/vnd.ms-excel;charset=UTF-8
- new Blob 需要设置类型为 application/octet-stream;charset=UTF-8
- 注:以上 charset=UTF-8 是默认值,都可不写,效果是一样的
调用
public exportExcel = async () => {
const [err, res] = await (httpService as IExportExcel.IExample)(
"POST",
"/export/order-sales/excel",
this.state.searchParam,
{},
{
responseType: "blob",
}
);
if (err || !res) {
return;
}
}
请求方法
export const httpService = (
method: IMethod,
url: string,
data: any = {},
appendHeaders: any = {},
otherParams?: any
) => {
const platform = "H5";
const masterInfoStore = (stores as IStore).MasterInfoTable!.localStore;
const userInfoStore = (stores as IStore).UserInfoTable!.localStore;
const Http = service.HttpService;
const countryCode = userInfoStore.countryCode || "GB";
const hostMap: IHostMap = host;
let requestAddress: any = hostMap[countryCode]
? `${hostMap[countryCode].SERVER_BASE_API}${url}`
: "";
if (otherParams && otherParams.erp) {
const baseUrl = hostMap[countryCode].SERVER_BASE_API.replace(
"/api/merchant",
""
);
requestAddress = baseUrl + url;
}
if (otherParams && otherParams.thirdPartyWebsite) {
requestAddress = url;
}
const token =
getUserProperty() === "master"
? masterInfoStore.token || null
: userInfoStore.token || null;
const headerMaps = {
"content-type": "application/json",
token: token,
platform,
lang: languageType[userInfoStore.language || "zh_CN"],
countryCode: languageType[userInfoStore.countryCode || "CN"],
...appendHeaders,
};
return new Promise((resolve, reject) => {
Http(method, requestAddress, data, headerMaps, otherParams)
.then((response: any) => {
if (
otherParams &&
otherParams.responseType &&
otherParams.responseType === "blob"
) {
if (response.data.size === 0) {
toastMessage.error({ content: "该报表无数据" });
resolve([{ error: true }, null]);
return;
}
let name = "报表";
if (response.headers["content-disposition"]) {
const nameURI = response.headers["content-disposition"]
.split(";")[1]
.split("=")[1];
name = decodeURIComponent(nameURI);
}
exportExcel(response.data, name);
}
if (response) {
if (otherParams && otherParams.thirdPartyWebsite) {
resolve([null, response]);
}
}
let { code, data, message } = response as any;
// 401 权限缺失,跳转至登录页
if (code === 401) {
const pathname = new URL(location.href).pathname;
if (getUserProperty() === "master") {
// 大客户
if (pathname !== "/master/login") {
masterLogoutService();
}
} else {
if (pathname !== "/login") {
userLogoutService();
}
}
}
if (code < 999 && code !== 1) {
echoHttpServiceMessage(message || LanguageService.entry_isTEXT1047());
console.log("http 请求的返回值 code 不等于 1:", { code, message });
reject({ code, message });
return false;
}
console.log("http 请求的返回值 response:::", response);
resolve([code > 999 ? { code, message } : null, data]);
})
.catch((err) => {
console.log("http 请求的返回值的 catch:", err);
echoHttpServiceMessage(err.toString());
reject(err);
});
});
};