使用 JavaScript 下载文件

使用 JavaScript 下载文件使用JavaScript下载文件

大家好,又见面了,我是你们的朋友全栈君。

1 最简单的方法

<a href="http://somehost/somefile.zip" download="filename.zip"> Download file </a>

只要为<a>标签添加 download 属性,我们点击这个链接的时候就会自动下载文件了
其中, download 属性可选(IE 不支持此属性),意思是指定下载后的文件名称
这是最简单、最方便的前端下载文件手段,如果条件允许应该作为第一个选择。

2 使用JavaScript

// 将获取的sonmefile.zip转换成 blob对象
fetch('http://somehost/somefile.zip').then(res =>             res.blob().then(blob => {
    var a = document.createElement('a');
    // 用 blob 对象来创建一个 object URL
    var url = window.URL.createObjectURL(blob);
    var filename = 'what-you-want.txt';
    a.href = url;
    a.download = filename;
    a.click();
    // 使用完object URL 之后手动撤销以释放掉内存优化性能
    window.URL.revokeObjectURL(url);
}))

对于blob 对象,支持的浏览器版本为IE10+, 并且当转换的文件较大时,可能会发生延迟。

但如果需要在下载之前做一些预处理的动作,例如检查该用户是否有下载的权限,是否有高速下载的权限、或者动态文件链接等等,这是一个很好的方法。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/139741.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 画廊效果的ViewPager实现(附带无限自动轮播)[通俗易懂]

    画廊效果的ViewPager实现(附带无限自动轮播)[通俗易懂]废话不多说,先上效果图根据效果所示,第一步实现适配器,完成无限循环首先做数据上的处理publicstaticclassLoopViewPagerAdapterextendsPagerAdapter{ …..LoopViewPagerAdapter(Contextcontext,ArrayList<Integer>imgIds){…

    2022年6月12日
    31
  • 查看linux执行的命令记录_linuxhistory命令

    查看linux执行的命令记录_linuxhistory命令前言我们每次敲打linux命令的时候,有时候想用之前用过的命令,一般情况下,我们都会按↑↓箭头来寻找历史的命令记录,那如果我想用1天前执行的某条命令,难道还要按↑100次?显示这样是不现实的,我们可

    2022年7月28日
    17
  • windows lua_windows创建指定大小的文件

    windows lua_windows创建指定大小的文件首先我在D:\downloadSoftware\lua-5.3.5_Win64_bin目录下创建了一个hello.lua的文件,文件内容如图,是一个简单的lua程序。运行这个文件有两种方式。第一种:进入cmd命令行,然后进入源文件的目录下执行命令luachello.lua(后面的是文件名),可以看到当前目录下生成了一个文件hello.out,这是源文件编译好了,然后执行命令lua…

    2025年5月26日
    0
  • vmware虚拟机联网设置(win10自带虚拟机安装win7)

    1.右键“我的电脑”,选择“管理”,双击进入2.找到“”服务“”这个选项,双击进入服务3.找到如下两个服务,将这两个服务启动4.打开VMware软件,打开虚拟机的编辑=>虚拟网络配置器5.点击更改配置6.配置如下图所示,配置完后,点击确定7.随便点击一台已有虚拟机,在右侧的弹框中,选择编辑虚拟机配置8.配置如下图所示,网络适配器=>选择自定义特定虚拟网=…

    2022年4月12日
    97
  • TTL232和RS232的区别

    逻辑电平定义不同:TTL232的0是用0v表示。1是用5V表示。RS232的0是用+3V–+15V表示,1是用-3V—15V表示。接口一般都用三根线,1:地线。2:写入。3:导出。他们不可直连,中间需接电平转接板,…

    2022年4月9日
    60
  • vue删除对象的某个属性(js怎么删除对象中的某个元素)

    微信小程序开发交流qq群173683895承接微信小程序开发。扫码加微信。实现代码:vardata={a:1,b:2,c:3}for(varitemindata){if(item==’b’){deletedata[item];}}console.log(‘data:…

    2022年4月11日
    46

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号