js实现文件下载

https://scarletsky.github.io/2016/07/03/download-file-using-javascript/
http://blog.csdn.net/androidmi/article/details/7519243

通过ajax请求服务器实现文件下载是我们在网页开发过程中经常遇到的需求,我的解决方案有两种:

有可用的url

这种情况下可以可以通过创建<a>并模拟点击来实现唤醒下载窗口,代码如下:

let a = document.createElement('a');
a.href = url;
a.download = 'filename.txt';
a.click();

只要为<a> 标签添加 download属性,我们点击这个链接的时候就会自动下载文件了。download 的属性值是可选的,它用来指定下载文件的文件名。

无可用的url

此时就需要通过ajax向后台脚本发起请求,后台的node.js响应代码如下

res.set({
            'Content-Type': 'application/octet-stream',
            'Content-Disposition': 'attachment; filename=filename.txt',
            'Content-Length': 1000
});
//file是服务器上的文件的具体路径
fs.createReadStream(file).pipe(res);

响应头设为application/octet-stream,表示传递的数据是二进制流,这是由node.js中流操作所产生的数据类型
Content-Disposition设为attachment会弹出对话框让用户下载,filename是保存的文件名

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 项目中用到了二维码点击下载,下面是实现方式html js php 用到了endroid/qrcode,请使用com...
    April2阅读 1,730评论 2 1
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,993评论 19 139
  • 本文包括:1、文件上传概述2、利用 Commons-fileupload 组件实现文件上传3、核心API——Dis...
    廖少少阅读 12,618评论 5 91
  • Node.js是目前非常火热的技术,但是它的诞生经历却很奇特。 众所周知,在Netscape设计出JavaScri...
    w_zhuan阅读 3,642评论 2 41
  • 这一讲主要包含以下几个部分: 1.创建商品列表页 2.根据分类获取商品列表 2.展示商品列表 1.创建商品列表页 ...
    IonicBlog阅读 10,725评论 15 11