前端实现下载(导出文件)

后台管理系统里可能会有导出表格,下载表格,下载压缩包等这样的需求
(1)最简单的是通过a标签结合blob实现下载,(下载文件)
<--!但是其中的download对应音频文件和视频文件无效-->

image.png

 if (window.navigator.msSaveBlob) {
        try {
            window.navigator.msSaveBlob(url, downloadFileName);
        }
        catch (e) {
            console.log(e);
        }
    }
    //
————————————————处理ie兼容问题


        let blob = new Blob([res.data]);
        let temp = URL.createObjectURL(blob); // 创建下载的链接
        this.$refs.downloadPlugin.href = temp;
        this.$refs.downloadPlugin.download = this.fileName; // 下载后文件名
        this.$refs.downloadPlugin.click(); // 点击下载
        URL.revokeObjectURL(temp); // 释放掉blob对象

有文件地址的话,点击下载
(2)window.open()方法,后端提供下载接口(下载图片,压缩好的rar)
window.open("url")

 /** "查看图片" -- 点击下载 */
    checkImg__download() {
       PackageImgs =  Object.values(this.arr).map(item => item.imgPath)
       let params = "?PackageImgs[]=" + PackageImgs.join("&PackageImgs[]=");
       window.open(   `${serverURL.API_URL}/api/trailer/orders/containers/${params
     }&sso_token=${window.$getToken()}`
      );
    },

你可能感兴趣的:(前端实现下载(导出文件))