因为公司后端忙得无法给批量下载的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. git链接远程库

    码云版本库使用流程 生成公钥 ssh-keygen -t rsa -c "码云申请邮箱" 添加公钥到本地 ssh-agent bash ssh-add ~/.ssh/id_rsa ...

  2. LeetCode 141 ——环形链表(JAVA)

    给定一个链表,判断链表中是否有环. 为了表示给定链表中的环,我们使用整数 pos 来表示链表尾连接到链表中的位置(索引从 0 开始). 如果 pos 是 -1,则在该链表中没有环. 示例 1: 输入: ...

  3. pycharm问题

    Pycharm 出现Unresolved reference '' 错误的解决方法:http://www.mamicode.com/info-detail-2190842.html

  4. 谁是嫌疑犯问题Python枚举法

    原文:https://blog.csdn.net/yunzifengqing/article/details/81941592 问题描述:有6名犯罪嫌疑人A.B.C.D.E.F,已知如下事实: A.B ...

  5. OSCP-Kioptrix2014-3 后渗透测试

    拿到root权限 之前的努力,最终获得了两个session 尝试看看该操作系统的漏洞 kali: searchsploit freebsd 9.0 cp /usr/share/exploitdb/ex ...

  6. OpenStreetMap全球库

    https://www.loveyu.org/5344.html https://www.jianshu.com/p/957aa4a933d7 https://blog.csdn.net/mrib/a ...

  7. Nginx作为静态资源web服务之跨域访问

    Nginx作为静态资源web服务之跨域访问 首先了解一下什么是跨域 跨域,指的是浏览器不能执行其他网站的脚本.它是由浏览器的同源策略造成的,是浏览器施加的安全限制. 所谓同源是指,域名,协议,端口均相 ...

  8. 跨平台编译ceres for Android

    折腾了几乎一天,记录一下. 最大的坑是官网给出的 1.进入ceres源代码目录下的jni目录 2.EIGEN_PATH="指向eigen库目录,即包含EIGEN文件夹的那个文件夹” ndk- ...

  9. Linux中的sudoer详解

    目录 Linux中的sudo详解 一.引言 二.格式 三./etc/sudoers文件 四.sudoers文件讲解 五.其他 Linux中的sudo详解 一.引言 Liunx用户只有两类: 管理员用户 ...

  10. 第十章· MySQL的主从复制

    一.主从复制简介  2015年5月28日11时,12小时后恢复,损失:平均每小时106.48W$ 1)高可用 2)辅助备份 3)分担负载 复制是 MySQL 的一项功能,允许服务器将更改从一个实例复 ...