实现mp4文件的下载,而不是在线播放

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<button onclick="GetFile()">下载</button>
<script>
// 会先下载流,完成后才弹出选择目录,所以最好加上进度条
function GetFile(){
axios({
url: `http://image.wangrui8.top/dms-2019-07-22-00-00~1.mp4`,
method: 'get',
responseType: 'blob',
onDownloadProgress (progress){
// 这里是下载的进度
console.log(Math.round(progress.loaded / progress.total * 100) + '%');
},
})
.then(res=>{
let blobUrl = window.URL.createObjectURL(res.data);
let link = document.createElement('a');
document.body.appendChild(link);
link.href = blobUrl;
link.download = '下载文件.mp4';
link.click();
window.URL.revokeObjectURL(blobUrl);
})
}
</script>
</body>
</html>

下载mp4文件的更多相关文章

  1. 记录一种下载https网址中的mp4文件的方法

    需要下载一个网页中的视频, 页面中的视频播放器为 JW player, 通过搜索发现可以下载对应的视频. 1. 使用chrome浏览器分析 网页中的视频地址: F12或者右键-->检查, 在打开 ...

  2. 嵌入式 使用mp4v2将H264+AAC合成mp4文件

    录制程序要添加新功能:录制CMMB电视节目,我们的板卡发送出来的是RTP流(H264视频和AAC音频),录制程序要做的工作是: (1)接收并解析RTP包,分离出H264和AAC数据流: (2)将H26 ...

  3. 嵌入式 H264—MP4格式及在MP4文件中提取H264的SPS、PPS及码流

    一.MP4格式基本概念 MP4格式对应标准MPEG-4标准(ISO/IEC14496) 二.MP4封装格式核心概念 1  MP4封装格式对应标准为 ISO/IEC 14496-12(信息技术 视听对象 ...

  4. 使用mp4v2将H264+AAC合成mp4文件

    录制程序要添加新功能:录制CMMB电视节目,我们的板卡发送出来的是RTP流(H264视频和AAC音频),录制程序要做的工作是: (1)接收并解析RTP包,分离出H264和AAC数据流: (2)将H26 ...

  5. 【转】使用ffmpeg转码的MP4文件需要加载完了才能播放的解决办法

    1.前一段时间做了一个ffmpeg转码MP4的项目,但是转出来的MP4部署在网站上需要把整个视频加载完成才能播放,到处找资料,最后找到解决方案记录于此备忘. FFMpeg转码由此得到的mp4文件中, ...

  6. Python3 根据m3u8下载视频,批量下载ts文件并且合并

    Python3 根据m3u8下载视频,批量下载ts文件并且合并 m3u8是苹果公司推出一种视频播放标准,是一种文件检索格式,将视频切割成一小段一小段的ts格式的视频文件,然后存在服务器中(现在为了减少 ...

  7. [转]【流媒體】H264—MP4格式及在MP4文件中提取H264的SPS、PPS及码流

    [流媒體]H264—MP4格式及在MP4文件中提取H264的SPS.PPS及码流 SkySeraph Apr 1st 2012  Email:skyseraph00@163.com 一.MP4格式基本 ...

  8. 多媒体开发之---H264—MP4格式及在MP4文件中提取H264的SPS、PPS及码流

    一.MP4格式基本概念 MP4格式对应标准MPEG-4标准(ISO/IEC14496) 二.MP4封装格式核心概念 1  MP4封装格式对应标准为 ISO/IEC 14496-12(信息技术 视听对象 ...

  9. EasyRTMP实现Demux解析MP4文件进行rtmp推送实现RTMP直播功能

    本文转自EasyDarwin团队Kim的博客:http://blog.csdn.net/jinlong0603/article/details/52965101 前面已经介绍过EasyRTMP,这里不 ...

随机推荐

  1. eclipse-JEE配置Tomcat并发布第一个项目

    一.配置过程 Window--preferences--Server--Runtime Environment, 然后点击add 我下载的是Tomcat7.0,选择你的版本就行了 选择Tomcat的安 ...

  2. OpenCV-Python 轨迹栏作为调色板 | 九

    目标 了解将轨迹栏固定到OpenCV窗口 您将学习以下功能:cv.getTrackbarPos,cv.createTrackbar等. 代码演示 在这里,我们将创建一个简单的应用程序,以显示您指定的颜 ...

  3. NLPer,你知道最近很火的自然语言处理库么?

    介绍 "NLP's ImageNet moment has arrived." 想象一下我们有能力构建支持谷歌翻译的自然语言处理(NLP)模型,并且在Python中仅需几行代码来完 ...

  4. 多线程学习笔记(四)---- Thread类的其他方法介绍

    一.wait和 sleep的区别 wait可以指定时间也可以不指定时间,而sleep必须指定时间: 在同步中时,对cpu的执行权和锁的处理不同: wait:释放执行权,释放锁:释放锁是为了别人noti ...

  5. RocketMQ的高可用集群部署

    RocketMQ的高可用集群部署 标签(空格分隔): 消息队列 部署 1. RocketMQ 集群物理部署结构 Rocket 物理部署结构 Name Server: 单点,供Producer和Cons ...

  6. UnboundLocalError,探讨Python中的绑定

    绑定 将python闭包之前,先梳理一下闭包中的绑定操作. 先看看2个相关的错误 NameError 和UnboundLocalError When a name is not found at al ...

  7. ORM框架对分表分库的实现

    *:first-child { margin-top: 0 !important; } .markdown-body>*:last-child { margin-bottom: 0 !impor ...

  8. CentOS 通过 expect 批量远程执行脚本和命令

    我们有时可能会批量去操作服务器,比如批量在服务器上上传某个文件,安装软件,执行某个命令和脚本,重启服务,重启服务器等,如果人工去一台台操作的话会特别繁琐,并浪费人力. 这时我们可以使用expect,向 ...

  9. Aactivity跳转到Bactivity之后再返回Aactivity的几种操作

    一个主界面(主Activity)通过意图跳转至多个不同子Activity上去,当子模块的代码执行完毕后再次返回主页面,将子activity中得到的数据显示在主界面/完成的数据交给主Activity处理 ...

  10. java中查询某个类已经创建了多少个对象了

    这个代码主要是使用类的静态字段和构造函数,可以跟踪某个类所创建对象的个数.请写一个类,在任何时候都可以向它查询“你已经创建了多少个对象? 主要是在构造函数中用到了静态数据,进行显示已经构造了多少个类对 ...