开发过程中使用file-saver插件保存图片到本地问题。
页面上有两个需要保存文件到本地的地方,一个是保存pdf到本地,一个是保存图片到本地,使用的是相同的方法,都是file-saver的saveAs方法。
savaAs的保存方法分两种形式,一种是同源的形式,会直接使用a标签加download的形式下载到本地,另一种就是跨域的形式,会使用类似于请求先请求文件到本地,然后转换成blob形式保存到本地。此次问题使用的就是后一种形式。但是在使用过程中保存pdf的可以正常使用,保存图片的却一直报错跨域,经过一番询问排查发现当浏览器禁用缓存时,图片可以正常下载,
但是取消之后再刷新页面点击保存图片就会失败。知道了跟缓存有关,但是却不知道这里到底发生了什么,等研究明白了再更。最后解决的方法解释再请求后面加上随机数。
const downloadImgClick = () => {
savaAs(`${url}&randomNum=${new Date().getTime()}`, fileName);
};