js 文件下载进度监控
var xhr = new XMLHttpRequest();
xhr.open('GET', '文件地址.mp4');
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.responseType = "blob";
xhr.onprogress = function (event) {
if (event.lengthComputable) {
console.log(event.loaded);
console.log(event.total); }
};
xhr.onload = function (oEvent) {
console.log(oEvent);
console.log(xhr.status);
console.log(xhr.response);
if (xhr.readyState === 4 && xhr.status === 200) {
// var name = xhr.getResponseHeader("Content-disposition");
// var filename = name.substring(20,name.length);
var blob = new Blob([xhr.response], {type: 'video/mp4'});
var csvUrl = URL.createObjectURL(blob);
var link = document.createElement('a');
link.href = csvUrl;
link.download = 'abababababba.mp4';
link.click();
}
}
xhr.send();
js 文件下载进度监控的更多相关文章
- js 文件下载 进度条
js: /** * 下载文件 - 带进度监控 * @param url: 文件请求路径 * @param params: 请求参数 * @param name: 保存的文件名 * @param pro ...
- 使用Typescript重构axios(二十五)——文件上传下载进度监控
0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...
- vue项目实现文件下载进度条
平时业务中下载文件方式常见的有俩种: 第一种,直接访问服务器的文件地址,自动下载文件: 第二种 ,服务器返回blob文件流,再对文件流进行处理和下载. 一般小文件适用于第一种下载方案,不占用过多服务器 ...
- 【原】聊聊js代码异常监控
在平时的工作,js报错是比较常见的一个情景,尤其是有一些错误可能我们在本地测试的时候测试不出来,当发布到线上之后才可以发现,如果抢救及时,那还好,假如很晚才发 现,那就可能造成很大的损失了.如果我们前 ...
- Node.js 数据库实时监控库 node-dbmon
node-dbmon 是一个 Node.js 数据库实时监控库,如果你希望在数据库表数据更改后,或者是文件修改后能更新 GUI,那么这个库正好适合你. https://github.com/strap ...
- js文件下载及命名(兼容多浏览器)
函数功能:实现主流浏览器的文件下载功能: 兼容性: >=IE10,Edge,chrome,firefox; 与后台的请求方式:GET请求, url携带参数 url?id=123(隐藏文件真实 ...
- nprogress.js 头部进度条使用方法
nprogress.js 头部进度条 引入CSS\JS <link rel="stylesheet" type="text/css" href=" ...
- Python展示文件下载进度条
前言 大家在用Python写一些小程序的时候,经常都会用到文件下载,对于一些较小的文件,大家可能不太在乎文件的下载进度,因为一会就下载完毕了. 但是当文件较大,比如下载chromedriver的时候, ...
- H5+Ajax+WebApi实现文件下载(进度条,多文件)
前言 踩过的坑 1.WebAPI跨域 2.Jquery ajax低版本不支持XHR 2功能 3.Jquery ajax不支持Deferred的process事件 4.IE下文件名乱码问题 功能实现 & ...
随机推荐
- 使用userAgent区分浏览器版本
使用userAgent区分浏览器版本:https://blog.csdn.net/n447194252/article/details/76255489 JS根据userAgent值来判断浏览器的类型 ...
- expdp和impdp的应用-高版本通过dblink导入到低版本
今天接到要进行数据库用户的部分数据迁移需求,需求如下 IMP.WO.INSA开头的表只要结构,不要数据 B.TEMP.TMP开头的表不用导 其他表需要导出数据和表结构,同时要求导出此用户下的所有其他对 ...
- C# Lodop与C-Lopdop选择打印机
原文:https://www.cnblogs.com/huaxie/p/9766886.html https://www.cnblogs.com/huaxie/p/10857490.html http ...
- python基础面试题:(1)
1.以下用C语言开发的Python解释器是( ) A:python是Java语言开发的Python解析器,B:PyPy是使用Python语言开发的Python解析,C:IronPython是.net平 ...
- 封装和private,this,super关键字的简单应用
1.将成员变量用private修饰 2.提供对应的getxx()和setxx()方法 public class Student { private String name; private int a ...
- Sql中使用Case when
SELECT CASE WHEN Column IS NOT NULL THEN '情况1' ELSE '情况2' END AS '列名' , FROM dbo.Table
- CA认证机制的简明解释
公钥机制面临的问题: 假冒身份发布公钥! 可以用CA来认证公钥的身份.CA有点像公安局,公钥就像身份证.公安局可以向任何合法用户颁发身份证以证明其合法身份.第三方只要识别身份证的真伪就能判断身份证持有 ...
- 2018-10-25-weekly
Algorithm 94. 二叉树的中序遍历 What 给定一个二叉树,返回它的中序遍历. How 二叉树的中序遍历顺序为左-根-右,可以用递归来解,对左子结点调用递归函数,根节点访问值,右子节点再调 ...
- [apache] apache配置文件中的deny和allow
allow 和Deny可以用于apache的conf文件或者.htaccess文件中(配合Directory, Location, Files等),用来控制目录和文件的访问授权. 例如: <Di ...
- flask之Twitter Bootstrap
一:Twitter Bootstrap是什么? 1.开源框架:提供用户页面组件. 2.可以创建整洁且具有吸引力的网站,并且网站能兼容所有现代的Web浏览器. 特点: Bootstrap 是客户端框架, ...