如何通过F12开发者工具保存网页中想要的视频资源

简介: 如何通过F12开发者工具保存网页中想要的视频资源

我们在浏览视频网站,遇到有趣的搞笑视频或是硬核的学习视频第一时间想保存下来却因为找不到下载的地方,拿不到源视频,一筹莫展。为了针对这一情况,此篇文章博主将通过程序员的角度教大家如何通过浏览器自带的F12开发者工具去保存下载想要的视频!


注意:此文章只做教学,请大家自觉遵守版权问题


浏览器开发者工具下载,听起来这个功能有些复杂。简单来说就是利用网站代码,把正在播放的视频下载下来。首先需要确认你的浏览器支持 开发者工具,我以 火狐浏览器 为例。去下载下图博主分享的视频。


f979e9c5e73d44718e86276327333d37.png


1.复制视频地址播放视频并打开F12开发者工具

ff3dff5000bd47f4a468d747f113dc72.png

2.找到网络(Network)选项,在点击下方的媒体(Media),剪头位置就会出现一些请求,这些请求就是你正在播放的视频。如果没有出现可以刷新一下页面。

9e38eb49e62842498b694b2ea7b2ae04.png

3.选中任意一个请求右击,选择新标签页中打开(Open in new tab)

266e3d8870424938879cc26165731de4.png

4.视频会在新的网页中打开,确认是需要的视频内容后,右键另存为即可

eea8e3bbf087431c8233e91f321996e4.png

需要注意的是,这种方法获取的视频一定要是你正在播放的视频。另外音频、图片(每一张图片,每一个图标,甚至微小的 Logo ,你都能找得到),你都可以通过此方法获取。不过有些网站的视频因为版权原因,经过了处理无法获取。

相关文章
|
3天前
|
缓存 小程序 开发者
小程序,运行测试时卡在等待界面,持续加载不到资源
小程序,运行测试时卡在等待界面,持续加载不到资源
|
7月前
|
小程序 前端开发
【易售小程序项目】项目介绍、小程序页面展示与系列文章集合
【易售小程序项目】项目介绍、小程序页面展示与系列文章集合
93 2
|
7月前
|
Web App开发 搜索推荐 NoSQL
如何搭建一个集成导航与在线工具的个性化浏览器私有书签(附详细搭建教程)
在这个信息爆炸的时代,我们都希望拥有一个能够轻松解决多端、多浏览器的收藏和笔记同步问题的神奇工具。Mtab书签正是为此而设计的顶级应用。它将基础导航、记事本、在线小工具和多端同步集于一身,为用户提供了更便利的网络浏览体验,并解决了多端同步的烦恼。
177 0
如何搭建一个集成导航与在线工具的个性化浏览器私有书签(附详细搭建教程)
|
10月前
|
Web App开发 JSON 监控
Chrome浏览器扩展开发之自动化操作页面
Chrome浏览器扩展开发之自动化操作页面
244 0
|
XML 安全 数据格式
网页 视频作为背景(解决google浏览器无法访问本地资源的问题)
网页 视频作为背景(解决google浏览器无法访问本地资源的问题)
132 0
网页 视频作为背景(解决google浏览器无法访问本地资源的问题)
|
Web App开发 JavaScript 前端开发
前端浏览器高级调试技巧整理
前端浏览器高级调试技巧整理
前端浏览器高级调试技巧整理
|
Web App开发 搜索推荐 开发者
Chromium 禁止用户删除内置搜索引擎给开发者带来新”困扰“,后续:“该功能将在 Chrome 98 / 99 中恢复”
Chromium 禁止用户删除内置搜索引擎给开发者带来新”困扰“,后续:“该功能将在 Chrome 98 / 99 中恢复”
112 0
Chromium 禁止用户删除内置搜索引擎给开发者带来新”困扰“,后续:“该功能将在 Chrome 98 / 99 中恢复”
|
前端开发 小程序
前端工作小结86-小程序学习4开始布局页面4
前端工作小结86-小程序学习4开始布局页面4
73 0
前端工作小结86-小程序学习4开始布局页面4
|
前端开发 小程序
前端工作小结85-小程序学习3开始布局页面3
前端工作小结85-小程序学习3开始布局页面3
66 0
前端工作小结85-小程序学习3开始布局页面3
|
Web App开发 tengine JavaScript
推荐一个有趣的Chrome扩展程序-查看任意网站的开发技术栈
推荐一个有趣的Chrome扩展程序-查看任意网站的开发技术栈
128 0
推荐一个有趣的Chrome扩展程序-查看任意网站的开发技术栈