因为公司后端忙得无法给批量下载的api,就我们前端自己把多张图片打包成zip下载,zip打包我们用的是jszip,下面是js实现下载的三种方法:

  1. 利用HTML download 属性
      var a = document.createElement('a');       //需要下载的数据内容,我这里放的就是BLOB,如果你有下载链接就不需要了       var url = window.URL.createObjectURL(content);       var filename = 'XXX.zip';       a.href = url;       a.download = filename;       a.click();       window.URL.revokeObjectURL(url); 
  1. Window对象
     window.location.href = "data:application/zip;"+content 
  1. 别人的库file-saver
    saveAs(content, new Date().getTime().toString()+".zip");

不过这种下载方式也有局限性,对文件的大小有限制,最后我分享一款很好用的插件大家参考一下,附上链接如下:

http://blog.ncmem.com/wordpress/2019/08/28/java%e6%89%b9%e9%87%8f%e4%b8%8b%e8%bd%bd/

效果截图:

js文件下载的更多相关文章

  1. js文件下载及命名(兼容多浏览器)

    函数功能:实现主流浏览器的文件下载功能: 兼容性: >=IE10,Edge,chrome,firefox; 与后台的请求方式:GET请求,  url携带参数  url?id=123(隐藏文件真实 ...

  2. 安卓请求服务器js文件下载到本地,版本号就下载

    <?phpreturn array('CJ_V' => 'v0.15',) <script src="/js/reserve.js?<?=C('CJ_V')?> ...

  3. FileSaver.js 文件下载

    安装: npm install file-saver --save 或者(需下载FileSaver.js文件) <script src="path/FileSaver.js" ...

  4. js 文件下载 进度条

    js: /** * 下载文件 - 带进度监控 * @param url: 文件请求路径 * @param params: 请求参数 * @param name: 保存的文件名 * @param pro ...

  5. js 文件下载

    工程WebApi: 点击按钮执行的handler exportClick() { var profile = { content: this.state.profile, type: MappingT ...

  6. js文件下载代码 import downloadjs from 'downloadjs'

    function logDownload(contribution_id) { setTimeout(function () { $.ajax({ url: "/ajax/Wallpaper ...

  7. node.js 文件下载

    //下载参数 var http = require("http"); var fs = require("fs"); var path = require(&q ...

  8. js 文件下载 兼容ie

    前置条件:后台接口返回二进制流文件 一.设置前端请求的的 responseType: 'blob' 二.接收请求数据并调用下载 var content = res.data // 接口返回的二进制流v ...

  9. js 文件下载进度监控

    var xhr = new XMLHttpRequest(); xhr.open('GET', '文件地址.mp4'); xhr.setRequestHeader("Content-type ...

随机推荐

  1. 第2章:Python生态工具

    1.Python内置小工具 1).1秒钟启动一个下载服务器: python -m SimpleHTTPServer python3 -m http.server 会在当前目录下启动一个文件下载服务器, ...

  2. pb datawindow 类型

    DataWindow.Processing 判断 DataWindow 对象的类型 可用 DataWindow.Processing 判断 DataWindow 对象的类型,dw的类型如下:     ...

  3. 【Mybatis】Mapper接口的参数处理过程

    下面是一个简单的Mapper接口调用,首先同个session的getMapper方法获取Mapper的代理对象,然后通过代理对象去调用Mapper接口的方法 EmployeeMapper mapper ...

  4. 你不知道的css各类布局(三)之自适应布局

    自适应布局 概念 自适应布局(Adaptive Layout)是对凡是有自适应特性的一类布局的统称 自适应布局使用media query来检测当前浏览器的宽度进而通过CSS样式调整页面大小.自适应布局 ...

  5. JS基础_if练习二

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. JS基础_运算符的优先级

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. git commit报错解决,绕过代码检查

    上一个项目用的svn,新项目用了git,很开心,终于学习了git了,本以为把git都学会了,但是还是遇到了一个不在自己学习的知识点范围内的问题,最后是同事帮忙解决的. 问题:第一次代码commit的时 ...

  8. var正在声明变量

    var正在声明变量也可以直接分配一个变量,而不在JS中声明它,但是这种变量在默认情况下是全局的.<!-/->是HTML中的注释,在JS中不起作用.它只是用来忽略无法识别脚本的浏览器的脚本内 ...

  9. c语言测试芯片好坏

    问题描述有n个(2<n<20)芯片,好的或坏的,并且有比坏的芯片更多的已知的好的芯片.每个芯片都可以用来测试其他芯片.当用一个好的芯片测试其他芯片时,它可以正确地给出被测芯片是好是坏.当用 ...

  10. kubernetes资源清单之DaemonSet

    什么是 DaemonSet? DaemonSet 确保全部(或者某些)节点上运行一个 Pod 的副本.当有节点加入集群时,也会为他们新增一个 Pod . 当有节点从集群移除时,这些 Pod 也会被回收 ...