使用js下载文件的各项方式
js下载的本质其实无非是让浏览器接收一个流文件,而一般情况下前端下载功能实现直接就可以使用html里面有专门下载标签,各项属性配一下就好了,但是有时候需要基于反爬虫、安全方面的考虑或者需求上的下载触发,是一个未知的结果等等,这个时候就需要js来处理了。最近也遇到了类似的问题,写个参考集合记录一下
- 直接打开的方式
var url = "https://xxxxx.txt" // 下载地址
window.open(url);
- 本地
window.location.href = "https://xxxxx.txt"
- 创建一个form下载,提交表单的方式
var url = "https://xxxxx.txt" // 下载地址
var params = '123' // 参数
// 创建form表单
var formHtml = "<form method='post' style='display:none' id='formDownId' action='"+ url +">" + "<input type='hidden' value='" + params + "'></form>"
var initHtml = document.createElement("div")
initHtml.innerHTML = formHtml
// 将form表单放入指定位置
document.body.appendChild(initHtml)
//操作dom,下载文件
document.getElementById("formDownId").submit()
// 下载完成,删除该form
document.body.removeChild(initHtml)
- 创建a标签的方式下载
var url = "https://xxxxx.txt"
1、通过点击
const a = document.createElement('a') // 创建a标签
a.setAttribute('download', '')
a.setAttribute('href', url)
a.click() // 执行点击事件
2、通过initMouseEvent属性
const htmlA = document.createElement('a')
htmlA.setAttribute("href", url)
htmlA.setAttribute('download', '')
const itsArr = document.createEvent('mouseEvents')
itsArr.initMouseEvent(
"click",
true,
true,
window,
0,
0,
0,
0,
0,
false,
false,
false,
false,
false,
0,
null
)
const returnStatus = htmlA.dispatchEvent(itsArr) // 下载结果返回
发表评论 (审核通过后显示评论):