js文件下载 (url下载,监听进度)视频下载、图片下载、apk下载

2023-11-18

此下载功能针对文件是url,例如http://xxxx/图片.jpg, http://xxx/视频.mp4, http://xxx/应用.apk等等,可以监听进度 ,失败等等。

	function downFile (url, name){
		var xhr = new XMLHttpRequest();
		xhr.open('GET', url, true);
		xhr.responseType = 'blob';    // 返回类型blob
        // 监听进度
	    xhr.onprogress = function (e) {
			if (e.lengthComputable) {
                // 文件总体积
				console.log(e.total);
                // 已下载体积
                console.log(e.loaded);
			}
		}
		xhr.onload = function () {
			 if (xhr.readyState === 4 && xhr.status === 200) {
				  let blob = this.response;
				  // 转换一个blob链接
				  let u = window.URL.createObjectURL(new Blob([blob]));
				  let a = document.createElement('a');
				  a.download = name;
				  a.href = u;
				  a.style.display = 'none'
				  document.body.appendChild(a);
				  a.click();
				  a.remove();
                  // 释放
                  window.URL.revokeObjectURL(u);
			 }
		};
	    xhr.onerror = function(){
            console.log('失败');
		}
		xhr.send();
	}

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

js文件下载 (url下载,监听进度)视频下载、图片下载、apk下载 的相关文章

  • Flask 学着用模板 render_template

    上一章节是做到了在本地浏览器上打印出hello world 如果你要更加复杂 可以像下面一样在return结果里添加内容 但是 简单的几句话你可以这么写 要是整的一个网页 你可没法把代码都拖在return后面吧 所以 后面引入了模板功能 模
  • 抽象函数(Java)

    我们现在深入理解一下抽象数据类型背后的理论 这些理论不仅本身很有趣 它们在ADT的设计与实现中也很有意义 如果你能够很好的理解它们 你将会设计出更好的抽象类型 并且远离那些隐晦的陷阱 在研究抽象类型的时候 先思考一下两个值域之间的关系 表示
  • console错误合集

    handlers i call is not a function 从报错的handlers i call 入手查找原因 这个错误是 调用相关的生命周期钩子函数引起来的错误 查看你的页面相关 生命周期钩子函数 是否有 声明了未定义方法 或是
  • 程序员的小浪漫----烟火

    多代码 慎读 预览 完整项目预览 预览地址 属性设计 烟花状态 烟花应有三个状态 升空 等待炸裂 炸裂后 烟花 发射点 x y 爆炸点 xEnd yEnd 升空后等待炸裂时间 wait 炸裂后微粒个数 count 烟花半径 radius 烟
  • 数据产品经理基础之写好报表需求文档

    今天业务部门向我提了个需求 想要在BI上实现一份日报表 并提供了一份日报表的excel文档样例 我为了 敏捷开发 没写需求文档 直接把excel扔给了开发 结果就导致一系列后遗症 首先是开发在写sql的过程频繁确认需求 xxx字段是什么意思
  • 白盒测试相关的一些知识

    在白盒测试中 可以使用各种测试方法进行测试 下面这篇文章 可能比较枯燥 如果不乐意读 可以先收藏 如果在你的工作中真遇到白盒测试的话 可以回过头再来看看 还是值得读一读 一般来说 白盒测试时要考虑以下5个问题 1 测试中尽量先用自动化工具来
  • 数据结构之链表与线性表

    数据结构之链表与线性表 线性表 顺序线性表 顺序表 顺序线性表 使用数组实现 一组地址连续的存储单元 数组大小有两种方式指定 一是静态分配 二是动态扩展 优点 随机访问特性 查找O 1 时间 存储密度高 逻辑上相邻的元素 物理上也相邻 缺点
  • JVM面试FAQ分析

    JVM面试FAQ分析 1 入门部分 1 1为什么要学习JVM 1 2 你了解哪些JVM产品 1 3 JVM的构成有哪几部分 2 类加载部分 2 1 你知道哪些类加载器 2 2 什么是双亲委派类加载模型 2 3 双亲委派方式加载类有什么优势
  • AdaBoost算法

    参考 https www bilibili com video BV1ix411i7yp p 26 机器学习技法 之 聚合模型 Aggregation Model 士杰的博客 CSDN博客 聚合模型
  • Java当中解析ini文件对应到JavaBean当中

    目录 1 ini文件简介 2 ini文件 3 ini解析工具类 4 示例运行结果 1 ini文件简介 ini 文件是Initialization File的缩写 即初始化文件 是windows的系统配置文件所采用的存储格式 统管window
  • 使用Nginx做反向代理超时的问题

    使用Nginx做反向代理时 当被代理服务器没有在指定时间内创建连接 接受请求或返回响应时 Nginx就会断开连接 并返回给客户端 504 Gateway Time out 错误 关于Nginx做反向代理超时 可以通过proxy connec
  • java判断是否为金额

    金额验证 public static boolean isNumber String str java util regex Pattern pattern java util regex Pattern compile 1 9 1 d 0
  • VsCode 常用好用插件/配置+开发Vue 必装的插件

    一 VsCode 常用好用插件 1 实时刷新网页的插件 LiveServer 2 open in browser 支持快捷键与鼠标右键快速在浏览器中打开html文件 支持自定义打开指定的浏览器 包括 Firefox Chrome Opera
  • vue3+tsx+element-plus封装组件总结

    最近在做vue3 plan tsx element plus的项目 tsx在我这里是用来做组件的 以往的开发方式是sfc 就是vue页面的写法
  • java socket 阻塞模式_关于socket的Accept阻塞模式的退出方法分析

    众所周知 socket的Accept会阻塞当前线程 如果子程序 或者类在被回收时 没有正确的中止socket 则会引发一些异常 我说下常用的一些处理方法 1 强行中断线程 这种方法我觉得是最差的 因为强行中断正在执行的线程 可能会引发一些意
  • 基于51单片机实现8位数码管显示表白数字(Proteus仿真)

    wechat 嵌入式工程师成长日记 具体功能实现 8位数码管从左往右显示 5201314 并且不闪烁 使用器件 若干电阻 4只LED红灯 8位数码管 总线 排阻 NPN三极管 AT89C51芯片 Proteus仿真原理图 WeChat 愿随
  • Unity 将图片做成预制体

    Unity 将图片做成预制体 刚导入Assets的图片是无法直接拖入场景中的 若我们想要将图片变成预制体 需要做一点转化 方法如下 选中想要转成预制体的图片 更改如下图 然后就可以将图片拖入场景中 进而拖进Assets里面制成预制体啦
  • 【如何卸载Alitum Designer10】

    我由于装了AD20 所以想要卸载掉AD10 但是无论是用电脑管家还是电脑的控制面板里面都无法卸载AD10 百度了下 亲测方法可行 故在此分享一下 找到D Program Files x86 Altium AD 10 System Insta
  • interview2-框架篇

    一 Spring篇 1 Spring 1 Bean线程安全问题 不是线程安全的 Spring框架中有一个 Scope注解 默认的值就是singleton 单例的 因为一般在spring的bean的中都是注入无状态的对象 没有线程安全问题 如

随机推荐

  • PCL alpha shapes平面点云边界特征提取(C++详细过程版)

    边界提取 一 概述 二 代码实现 三 结果展示 一 概述 AlphaShape边界提取算法在PCL里有现成的调用函数 具体算法原理和实现代码见 PCL alpha shapes平面点云边界特征提取 为充分了解AlphaShape算法实现的每
  • MySQL性能调优的10个方法

    1 选择合适的存储引擎 InnoDB 除非你的数据表使用来做只读或者全文检索 相信现在提到全文检索 没人会用 MYSQL 了 你应该默认选择 InnoDB 你自己在测试的时候可能会发现 MyISAM 比 InnoDB 速度快 这是因为 My
  • java 实现邮箱发送邮件功能(端口:465、587)

    使用465端口对邮件进行ssl加密传输 package com example alysslEmail import java security Security import java util Date import java util
  • 解决Eclipse里的注释中文错位问题

    2018年6月之后的eclipse版本 会出现中文注释字体不一 且缩进不一致的问题 如下 解决Eclipse里的注释中文错位问题如下 强迫症请收藏 1 Window gt Preference 2 输入formatter 选择如下 然后Ed
  • 计算机网络之物联网的特点及其主要应用领域

    提示 文章写完后 目录可以自动生成 如何生成可参考右边的帮助文档 目录 前言 一 物联网的概念及其特点 1 1 物联网的概念 1 2 物联网的特点 二 物联网的分类及其主要应用领域 总结 前言 物联网是新一代信息技术的重要组成部分 也是信息
  • openGL之API学习(一九九)纹理单元和纹理对象的关系

    glGenTextures产生的是纹理对象 简称纹理 纹理单元数量在GPU上确定的 不需要创建 glBindTexture将纹理对象绑定到当前纹理单元的的目标类型上 一个纹理单元可以有多个类型1D 2D等 一个纹理对象能够绑定到多个目标类型
  • 不需要带手机直接选择刷脸支付

    刷脸成为了现实 各地实行刷脸的试点都取得成功 刷脸也就这样的走进我们的生活 不需要带手机 钱包 直接选择刷脸 当然 方便的还是无须等待排队 原本一个收银台需要配备一名收银员 所以考虑人力成本收银柜台数量是有限的 刷脸支付需要经历的步骤 不到
  • uniapp 调用蓝牙接收数据、发送指令后接收返回结果

    uniapp 调用蓝牙接收数据 向设备发送指令后接收返回结果 一 连接蓝牙设备 1 初始化蓝牙 2 搜索蓝牙 3 获取设备列表 4 连接设备 二 接收数据 1 获取设备服务列表 2 获取蓝牙特征 3 接收设备数据 三 向设备发送数据 并接收
  • 微服务及其框架是什么

    要理解微服务 首先要先理解不是微服务的那些 通常跟微服务相对的是单体应用 即将所有功能都打包成在一个独立单元的应用程序 从单体应用到微服务并不是一蹴而就的 这是一个逐渐演变的过程 本文将以一个网上超市应用为例来说明这一过程 目录 1 单体
  • js中的日期Date操作——获取当前日期 yyyy-mm-dd格式

    getCurrentDate const date new Date const year date getFullYear toString const month 0 date getMonth 1 slice 2 const day
  • AD操作小技巧总结

    1 群操作修改元器件属性 使用寻找相同的元器件来统一修改值 最重要一步是找到后用shift选中你需要的那几个 修改完后按enter键即可 根据下图可以知道筛选的条件有很多 也可以从不同的文件中去寻找元器件 2 将PCB中元器件旋转任意角度
  • 逐渐从土里长出来的小花

    从土里逐渐长出来的小花 这是长出来后的样子 图片压缩了出现了重影 代码在这里
  • Tornado中文教程

    Tornado 是一个Python web框架和异步网络库 起初由 FriendFeed 开发 通过使用非阻塞网络I O Tornado可以支撑上万级的连接 处理 长连接 WebSockets 和其他需要与每个用户保持长久连接的应用 相关链
  • 记录使用flask+socket+mongodb页面P标签的刷新

    1 flask的学习 随便百度个flask入门教程熟悉一下flask的启动 路由等 2 mondodb的学习 同1 3 socket的学习 同1 4 碰到的问题 4 1socket阻塞 使用 from threading import Th
  • 【全文检索_10】Filebeat 基本使用

    1 1 简介 1 1 1 概述 Filebeat 是 Beats 的一员 用于转发和集中日志数据的轻量级传送工具 当面对成百上千 甚至成千上万的服务器 虚拟机和容器生成的日志时 Filebeat 将为您提供一种轻量型方法 监视指定的日志文件
  • 网络数据传输的封装

    数据封装 Data Encapsulation 是指将协议数据单元 PDU 封装在一组协议头和尾中的过程 在OSI七层参考模型中 每层主要负责与其它机器上的对等层进行通信 该过程是在协议数据单元 PDU 中实现的 其中每层的PDU一般由本层
  • QString编码转换

    QString是QT中对于字符串的存储和处理的类 类似于MFC中的CString 如果用过的话就知道比std中的string和wstring要好用的多 功能也更强大 QString内部是将字符串保存为Unicode编码的 所以无论传入的字符
  • 【pytest】 标记冒烟用例 @pytest.mark.smoke

    1 使用 pytest mark smoke 标记用例 import pytest class Test Smoke def test 01 self assert 1 1 2 pytest mark smoke def test 02 s
  • OpenOCD介绍以及上手

    Versaloon支持AVR和AVR32的方式是模仿JTAGICE mkII 所以使用上相对简单很多 只是使用官方的开发环境即可 但Versaloon对ARM的支持是通过OpenOCD来实现 OpenOCD目前在国内还是非常少使用的 可能中
  • js文件下载 (url下载,监听进度)视频下载、图片下载、apk下载

    此下载功能针对文件是url 例如http xxxx 图片 jpg http xxx 视频 mp4 http xxx 应用 apk等等 可以监听进度 失败等等 function downFile url name var xhr new XM