浏览器弹窗式下载excel

原创

已于 2025-03-21 20:35:51 修改 · 184 阅读

0 ·

CC 4.0 BY-SA版权

QiAn

文章标签：

#excel

于 2024-11-21 12:45:07 首次发布

////前端JS////
downloadFile(response, fileName, contentType){
	const blob = new Blob([response.body],{type:contentType});
	const url = window.URL.createObjectURL(blob);
	// 以打开新窗口方式进行下载
	window.open(url);    // 每次创建的文件的文件名都是随机的字符串
	// 以动态创建a标签方式进行下载
	const a = document.createElement('a');
	a.href = url;
	a.download = fileName;
	a.click();
	window.URL.revokeObjectURL(url);
}

customDownload(){
	// 业务逻辑的处理
	…………………………
	this.loadingService.show();   
	
	const uri = new Uri(this.uriService.extendUri('api路径'),{});
	const url = uri.toString();
	const headers = new HttpHeaders({'Content-Type': 'application/json'});
	const option = {
		responseType: 'blob' as any,
		headers:headers,
		observe: 'response' as any,
	}
	const body = {
		filters: filters    // 筛选框的参数
	}
	this.httpClient.put(url, body, option).subscribe(response: any) => {
		this.loadingService.hide();
		const contentType = "application/vnd.ms-excel;charset=utf-8";
		let fileName = response.headers.get("Content-Disposition").split(";")[1].split("filename=")[1];
		fileName = decodeURI(fileName);
		if('msSaveOrOpenBlob' in navigator){
			const blob = new Blob([response.body],{type: contentType});
			window.navigator.msSaveBlob(blob,fileName);
		} else {
			this.downloadFile(response, fileName, contentType);
		}
	},
		error => {
			this