Axios 使用 blob - 二进制文件流下载

    

Axios 使用 blob - 二进制文件流下载

/**
 * 返回值文件类型为 blob 二进制流文件
 * responseType: 'blob' 
 * params 接口所需参数
 * 命名文件名:依据时间戳命名文件名
 *      (导出时需要延迟,否则导出文件失败,默认文件名时直接导出)
 * */

$axios.get(`api`, {
    responseType: 'blob',
    params
}).then((res) => {
    // response 的返回值为二进制文件流

    // 创建时间戳
    let date = new Date(),
        yyyy = date.getFullYear(),
        MM = date.getMonth() + 1,
        dd = date.getDate(),
        hh = date.getHours(),
        mm = date.getMinutes(),
        ss = date.getSeconds();
    var timeStr = `${yyyy}${MM}${dd}${hh}${mm}${ss}`;

    // 导出二进制文件
    setTimeout(() => {
        // 创建URL对象 URL.createObjectURL(object)
        let url = window.URL.createObjectURL(res.data);
        let link = document.createElement('a');
        link.style.display = 'none';
        link.href = url;
        // 指定文件名&文件类型(后缀名)
        let fileName = `Users${timeStr}CN.xls`;
        /**
         * 添加属性,并赋指定的值 el.setAttribute('download','zzz')
         * demo: <a href="abc.gif" download="zzz"> 
         * download属性的值即使当前要导出的文件的文件名
         * */
        link.setAttribute('download', fileName);
        link.click();
        // 释放创建的对象(创建的新的URL必须通过该方法释放)
        window.URL.revokeObjectURL(url);
    }, 500);
}).catch((err) => {
    console.log('文件导出失败: ', err);
});

所有原创文章采用 知识共享署名-非商业性使用 4.0 国际许可协议 进行许可。
您可以自由的转载和修改,但请务必注明文章来源并且不可用于商业目的。
本站部分内容收集于互联网,如果有侵权内容、不妥之处,请联系我们删除。敬请谅解!

仅有一条评论

添加新评论

  关于博主

QQ:1960727927
E-Mail:ceet@vip.qq.com
个人主页:https://aiylqy.com
个性签名:毁掉一个人最好的方式就是放纵他的缺点。

  近期评论

有种脾气叫,不放弃。

梦想是注定孤独的旅行,路上少不了质疑和嘲笑,但那又怎样,哪怕遍体鳞伤也要活的漂亮。

不管现在有多么艰辛,我们也要做个生活的舞者。

命运从来不会同情弱者。

不怕万人阻挡在前方,只怕自己先行投降。