文件下载---txt文件下载

最新推荐文章于 2025-02-27 16:47:58 发布

你吃香蕉吗？

最新推荐文章于 2025-02-27 16:47:58 发布

阅读量8k

点赞数 1

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/m0_47135993/article/details/121399040

版权

js 专栏收录该内容

18 篇文章

订阅专栏

文件下载系列

适用场景：

1、需求：点击直接下载txt文件，而不是在浏览器中打开新窗口（浏览器可识别txt文件，会直接在新的窗口打开预览文件）。

2、项目中一般文件是存放在文件服务器上的，而文件服务器和项目地址又不同，如果使用读取文件内容的方式下载文件，则存在跨域问题，而又不准备配置文件服务器的跨域。

此下载方法必须提供文件后缀名，即“.txt ”

后端返回格式：字符串String

接收参数：

fileName：文件名，必须，可带文件后缀也可忽略

fileContent：要下载的txt文件的内容

// TXT文件下载方法
supplierTXTUpload(fileName, fileContent) {
    let txtFileName = fileName;
    if (txtFileName.substring(txtFileName.length - 4) !== '.txt') {
        txtFileName += '.txt';
    }
    if ('download' in document.createElement('a')) {
        const elink = document.createElement('a')
        elink.download = txtFileName
        elink.style.display = 'none'
        elink.href = 'data:text/paint;utf-8,' + fileContent
        document.body.appendChild(elink)
        elink.click()
        URL.revokeObjectURL(elink.href)
        document.body.removeChild(elink)
    } else {
        this.$message.error('您的浏览器暂不支持txt文件下载！')
    }
}

此前在网上有看到以下方式（仅部分代码）来实现txt文件下载，经实测，虽然可以实现txt文件下载，但是initMouseEvent已被废弃了，虽可用但并不推荐

var ev = document.createEvent("MouseEvents");
ev.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
obj.dispatchEvent(ev);