官方网站建设网站,百度视频,公司logo设计图片免费,免费企业网站报价js下载文件方式有使用a标签的#xff0c;也有直接用window.open的#xff0c;还有用form表单的#xff1b;这里采用的是a标签的下载方式#xff0c;一种是url直接下载#xff0c;另一种是文件的blob数据类型进行下载。 文件blob数据类型的获取一般是后端返回文件的二进制流…js下载文件方式有使用a标签的也有直接用window.open的还有用form表单的这里采用的是a标签的下载方式一种是url直接下载另一种是文件的blob数据类型进行下载。 文件blob数据类型的获取一般是后端返回文件的二进制流前端通过请求工具获取为blob数据类型进行下载也可以这直接通过ajax或fetch等将url转化为blob数据类型一些特殊的附件直接通过url下载浏览器可能会将其打开如pdf。
话不多说直接上代码
一、url直接下载文件
/*** 文件url直接下载* param {String} path 下载链接* param {*} fileName 下载文件名称, 无文件名默认取url后面名称*/
const downloadUrl (path, fileName) {if(!path) return;const a document.createElement(a);a.setAttribute(href, path);a.setAttribute(download, fileName);a.setAttribute(target, _blank);const clickEvent document.createEvent(MouseEvents);clickEvent.initEvent(click, true, true);a.dispatchEvent(clickEvent);
};二、文件blob数据类型下载文件
/*** 文件blob数据格式进行下载* description 文件下载* param {String} blob 文件blob数据* param {String} fileName 下载文件名*/
const downloadBlobUrl function (blob, fileName ) {if (!blob) return;if (download in document.createElement(a)) {// 非IE下载let link document.createElement(a);if (window.URL) {link.href window.URL.createObjectURL(blob);} else {link.href window.webkitURL.createObjectURL(blob);}link.download fileName;document.body.appendChild(link);link.click();link.remove();} else {// IE10下载navigator.msSaveBlob(blob, fileName);}
};
需要的上方自取有疑问或者其他问题欢迎评论沟通也可加wx沟通账号与用户名一致