专栏首页西安-晁州纯js实现文件下载并重命名功能

纯js实现文件下载并重命名功能

直接记录代码:

/**
 * 获取 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);
    });
};

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • servlet实现文件下载功能

    第一步:首先在你的项目新建一个文件夹存放一些可以下载的文件(本教程一一张图片为例子) ? ---- 第二步:写servlet(DownloadServlet....

    Java学习
  • CEF 文件下载功能实现

    CEF 下载功能非常容易拓展,它提供了丰富的接口和控制功能,比如对正在下载的文件实现暂停、继续、取消等操作。并且 CEF 还帮我们默认实现了一个另存为的对话框,...

    我与梦想有个约会
  • DownloadManager实现文件下载功能

    关于文件下载,或许不是一个多么陌生的内容,在网络操作中下载只是其中一个方面,但是关于文件下载还是有不少东西要说,今天我就拿下载的方式来说吧。

    砸漏
  • android实现文件下载功能

    – 创建一个HttpURLConnection对象 : HttpURLConnection urlConn = (HttpURLConnection) url....

    砸漏
  • django 实现文件下载功能

    在实际的项目中很多时候需要用到下载功能,如导excel、pdf或者文件下载,当然你可以使用web服务自己搭建可以用于下载的资源服务器,如nginx,这里我们主要...

    py3study
  • Java Web文件下载功能实现

    但是这里会出现一个问题,就是单击下载压缩包的时候会弹出下载页面,但是下载图片的时候浏览器就直接打开了图片,没有下载。

    Java团长
  • Android WebView实现文件下载功能

    WebView控制调用相应的WEB页面进行展示。当碰到页面有下载链接的时候,点击上去是一点反应都没有的。原来是因为WebView默认没有开启文件下载的功能,如果...

    砸漏
  • php+js实现的无刷新下载文件功能示例

    本文实例讲述了php+js实现的无刷新下载文件功能。分享给大家供大家参考,具体如下:

    砸漏
  • Python HTTP下载文件并显示下载进度条功能的实现

    下面的Python脚本中利用request下载文件并写入到文件系统,利用progressbar模块显示下载进度条。

    砸漏
  • python实现遍历文件夹图片并重命名

    在做深度学习相关项目时,需要标注图片,筛选过后图片名字带有括号,显得比较乱,因此利用python进行统一规范重命名操作

    砸漏
  • Android使用WebView实现文件下载功能

    本文实例为大家分享了WebView实现文件下载功能的具体代码,供大家参考,具体内容如下

    砸漏
  • Android使用Handler实现下载文件功能

    本文实例为大家分享了Android实现下载文件的具体代码,供大家参考,具体内容如下

    砸漏
  • linux下重命名文件或文件夹使用mv既可实现。

    linux下重命名文件或文件夹使用mv既可实现。 例子: ①将一个名为abc.txt的文件重命名为1234.txt [root@station90 root]#...

    学到老
  • PHP使用CURL实现下载文件功能示例

    本文实例讲述了PHP使用CURL实现下载文件功能。分享给大家供大家参考,具体如下:

    砸漏
  • 前端实现文件下载功能的三种方式

    已知文件的地址,可以通过上面的方式将地址放入href属性内,download属性存放下载文件的名称,此属性为必须。

    acoolgiser
  • 在django项目中导出数据到excel文件并实现下载的功能

    补充知识:Python Django实现MySQL百万、千万级的数据量下载:解决memoryerror、nginx time out

    砸漏
  • 几行 Python 代码实现 Windows 下的文件批量重命名

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

    耕耘实录
  • PHP实现批量重命名某个文件夹下所有文件的方法

    本文实例讲述了PHP实现批量重命名某个文件夹下所有文件的方法。分享给大家供大家参考,具体如下: 自己手动这样一个个的重命名,累啊。所以还是偷懒一下。 我重命名的...

    用户2323866
  • Android使用ftp方式实现文件上传和下载功能

    近期在工作上一直再维护平台OTA在线升级项目,其中关于这个升级文件主要是存放于ftp服务器上的,然后客户端通过走ftp协议方式下载至本地Android机进行一个...

    砸漏

扫码关注云+社区

领取腾讯云代金券