直接记录代码:

/**
* 获取 blob
* @param {String} url 目标文件地址
* @return {cb}
*/
function getBlob(url,cb) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'blob';
xhr.onload = function() {
if (xhr.status === 200) {
cb(xhr.response);
}
};
xhr.send();
} /**
* 保存
* @param {Blob} blob
* @param {String} filename 想要保存的文件名称
*/
function saveAs(blob, filename) {
if (window.navigator.msSaveOrOpenBlob) {
navigator.msSaveBlob(blob, filename);
} else {
var link = document.createElement('a');
var body = document.querySelector('body'); link.href = window.URL.createObjectURL(blob);
link.download = filename; // fix Firefox
link.style.display = 'none';
body.appendChild(link); link.click();
body.removeChild(link); window.URL.revokeObjectURL(link.href);
};
} /**
* 下载
* @param {String} url 目标文件地址
* @param {String} filename 想要保存的文件名称
*/
function download(url, filename) {
getBlob(url, function(blob) {
saveAs(blob, filename);
});
};

纯js实现文件下载并重命名功能的更多相关文章

  1. 纯js实现复制到剪贴板功能

    在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了,甚至被屏蔽.本文介绍的一款JS插件,实现了纯J ...

  2. web 页面上纯js实现按钮倒计数功能(实时计时器也可以)

    需求构思:本功能想实现的是,一个按钮在页面载入就显示提醒续费,,,倒数60秒后,完成提醒功能,可以按另外一个页面跳转到主页. 参考网上的大神,实现如下:Button2倒数,Button3跳转,在页面上 ...

  3. web 页面上纯js实现按钮倒计数功能

    需求构思:本功能想实现的是,一个按钮在页面载入就显示提醒续费,,,倒数60秒后,完成提醒功能,可以按另外一个页面跳转到主页. 参考网上的大神,实现如下:Button2倒数,Button3跳转,在页面上 ...

  4. JavaScript 实现文件下载并重命名

    第一种是HTML官网中的方法<a href="/images/liang.jpg" download="文件名称">HTML5 中 a 标签提供了一 ...

  5. jQuery+AJAX实现纯js分页功能

    使用jQuery的AJAX技术,在bootstrap的框架下搭建的纯js分页 bootstrap作为Twitter推的一款前端框架,效果个人还是觉得很不错的.这次只是拿来作为网页元素的css样式表使用 ...

  6. Node.js之文件下载

    Node.js之文件下载,主要最近解决我的一个需求. 需求描述:如何将腾讯云上传的文件存储到本地某个目录下,如果用js来实现,纯JavaScript没有这样的功能(也许有),正好我这个项目用node. ...

  7. JAVA 批量下载服务器文件到本地指定文件夹并重命名

    /** * @功能 下载文件到指定文件夹并重命名 * @param url 请求的路径 * @param filePath 文件将要保存的目录 * @param filename 保存到本地的文件名 ...

  8. F2工作流引擎之-纯JS Web在线可拖拽的流程设计器(八)

          Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回.传阅.转交,都可以非常方便快捷地实现,管理员 ...

  9. [分享黑科技]纯js突破localstorage存储上线,远程抓取图片,并转码base64保存本地,最终实现整个网站所有静态资源离线到用户手机效果却不依赖浏览器的缓存机制,单页应用最新黑科技

    好久没有写博客了,想到2年前答应要放出源代码的也没放出来,最近终于有空先把纯js实现无限空间大小的本地存储的功能开源了,项目地址https://github.com/xueduany/localsto ...

随机推荐

  1. ModelValidator基于元数据的验证

    ModelValidator主要是应用在ModelMetadata元数据的类型上或类型属性上.它是验证的基础类型,所有的ModelValidatorProviders.DataAnnotationVa ...

  2. MVVM双向绑定实现之Object.defineProperty

    随着web应用的发展,直接操作dom的应用已渐行渐远,取而代之的是时下越来越流行的MVVM框架,dom操作几乎绝迹,这里面自然是框架底层封装的结果.MVVM框架的双向数据绑定使开发效率大大提高:然后在 ...

  3. BZOJ 2200--[Usaco2011 Jan]道路和航线(最短路&拓扑排序)

    2200: [Usaco2011 Jan]道路和航线 Time Limit: 10 Sec  Memory Limit: 259 MBSubmit: 1128  Solved: 414[Submit] ...

  4. Mysql root账号general_log_file方法获取webshell

    在前面的phpmyadmin漏洞利用专题中介绍了如何通过root账号来获取webshell,但在现实情况中,由于Mysql版本较高以及配置文件的缘故,往往无法直接通过root账号写入网站真实路劲下获取 ...

  5. flask~数据库

    flask与数据库的连接基于flaks_sqlaichemy 扩展 首先要连接数据库的时候必须得先下载 pip install flask-sqlalchemy 这个扩展 flask框架与数据库的连接 ...

  6. 【xsy3355】图 思维

    题目大意:给你一个n个点m条无向边的图,问这个图是否能够: 1,被四染色(用四种颜色给图染色,且相邻点颜色不同). 2,找出一个奇环,满足在原图中去掉这个奇环后每个点依然相邻. 请输出1或者2中的任意 ...

  7. 03-01 Java运算符

    (1)算术运算符 A:+,-,*,/,%,++,-- B:+的用法 a:加法 b:正号 c:字符串连接符 C:/和%的区别 数据做除法操作的时候,/取得是商,%取得是余数 D:++和--的用法 a:他 ...

  8. [Umbraco] xslt语言介绍及与umbraco的关系

    XSLT是扩展样式表转换语言(Extensible Stylesheet Language Transformations)的简称,这是一种对XML文档进行转化的语言,XSLT中的T代表英语中的“转换 ...

  9. Python Web框架 tornado 异步原理

    Python Web框架 tornado 异步原理 参考:http://www.jb51.net/article/64747.htm 待整理

  10. element UI form 验证

    1 form 添加rules,具体属性添加prop, 注意 prop 属性与v-model 子属性一致 2 data 对象添加 rules 3 验证方法调用 验证规则见: https://github ...