js blob类型url的视频下载问题的解决


Posted in Javascript onNovember 29, 2019

blob下载问题的详细描述

我想用src url blob:https://www.youtube.com/23aea5c8-9ae2-40dc-9417-e675ea99b386下载视频,但是不知道应该怎么做。

有没有下载这类视频的通用方法?

推荐的解决方法

我在Vimeo中找到了一个使用blob url下载视频的方法(读了这篇文章,我才知道做法)。我正在使用Google Chrome,具体步骤如下:

1、打开More Tools(更多工具)→Developer Tools(开发工具)

2、检查视频标签中是否有这样的东西:

<video preload="" src="blob:https://player.vimeo.com/XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"></video>

3、复制iframe标签的src(如果有的话)值,如http://player.vimeo.com/video/XYZ,如果你发现它可以复制,直接跳到第7点,否则按照步骤4,5,6继续操作。

4、现在在页面中找到这个字符串https://skyfire.vimeocdn.com/.../master.json?base64_init=1(使用开发视图(Developer View)),应该可以在javascript函数中找到它,像这样:

(function(e,a){var t={"cdn_url":"https://f.vimeocdn.com","view":1,"request":{"files":{"dash":{"origin":"gcs","url":"https://48skyfiregce-a.akamaihd.net/.../master.json?base64_init=1","cdn":"

5、复制上面的url字段中的链接到一个新的Chrome选项卡,例如https://48skyfiregce-a.akamaihd.net/.../master.json?base64_init=1,然后使用浏览器打开它,它会打开一个像这样的json文件:

{
  "clip_id": XYZ,
  "base_url": "../",
  "video": [
         { ... ... ...

6、现在用id XYZ组合构造一个URL,如下所示:https://player.vimeo.com/video/XYZ

7、用最终的URL替换视频标签内的blob:https://player.vimeo.com/XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX(在上一步#6中创建的)。

8、现在可以发现,魔术般地,视频标签内的src字段已更改(如果没有,请尝试第7步多次)...

<video preload="none" src="https://fpdl.vimeocdn.com/vimeo-prod-skyfire-std-us/XX/XXX/X/XXXXXXXX/XXXXXXXXX.mp4?token=abcdefg"></video>

最后,使用新的链接直接下载它,就像这样:https://fpdl.vimeocdn.com/vimeo-prod-skyfire-std-us/XX/XXX/X/XXXXXXXX/XXXXXXXXX.mp4?token=abcdefg

其他的解决思路

这个答案是针对Twitter网址的 -

右键点击视频,然后点击检查元素 -

你会发现这样的代码

<div id="playerContainer" class="player-container full-screen-enabled" data-config="{"is_360":false,"duration":28617,"scribe_widget_origin":true,"heartbeatEnabled":true,"video_url":"https:\/\/video.twimg.com\/ext_tw_video\/844504104512749568\/pu\/pl\/e91Du5N2TZ09ZaW_.m3u8","disable_embed":"0","videoInfo":{"title":null,"description":null,"publisher":{"screen_name":"MountainButorac","name":"Mountain Butorac","profile_image_url":"https:\/\/pbs.twimg.com\/profile_images\/808318456701521920\/vBvlAASx_normal.jpg"}},"cardUrl":"https:\/\/t.co\/SdSorop3uN","content_type":"application\/x-mpegURL","owner_id":"14120461","looping_enabled":true,"show_cookie_override_en":true,"visit_cta_url":null,"scribe_playlist_url":"https:\/\/twitter.com\/MountainButorac\/status\/844505243538931714\/video\/1","source_type":"consumer","image_src":"https:\/\/pbs.twimg.com\/ext_tw_video_thumb\/844504104512749568\/pu\/img\/FFt3qkbeOh0RlGfZ.jpg","heartbeatIntervalInMs":5000.0,"use_tfw_live_heartbeat_event_category":true,"video_loading_timeout":45000.0,"status":{"created_at":"Wed Mar 22 11:05:14 +0000 2017","id":844505243538931714,"id_str":"844505243538931714","text":"Took my Goddaughter to meet the pope. She stole his hat! https:\/\/t.co\/SdSorop3uN","truncated":false,"entities":{"hashtags":[],"symbols":[],"user_mentions":[],"urls":[],"media":[{"id":844504104512749568,"id_str":"844504104512749568","indices":[57,80],"media_url":"http:\/\/pbs.twimg.com\/ext_tw_video_thumb\/844504104512749568\/pu\/img\/FFt3qkbeOh0RlGfZ.jpg","media_url_https":"https:\/\/pbs.twimg.com\/ext_tw_video_thumb\/844504104512749568\/pu\/img\/FFt3qkbeOh0RlGfZ.jpg","url":"https:\/\/t.co\/SdSorop3uN","display_url":"pic.twitter.com\/SdSorop3uN","expanded_url":"https:\/\/twitter.com\/MountainButorac\/status\/844505243538931714\/video\/1","type":"photo","sizes":{"small":{"w":340,"h":604,"resize":"fit"},"thumb":{"w":150,"h":150,"resize":"crop"},"large":{"w":576,"h":1024,"resize":"fit"},"medium":{"w":576,"h":1024,"resize":"fit"}}}]},"source":"\u003ca href=\"http:\/\/twitter.com\/download\/iphone\" rel=\"nofollow\"\u003eTwitter for iPhone\u003c\/a\u003e","in_reply_to_status_id":null,"in_reply_to_status_id_str":null,"in_reply_to_user_id":null,"in_reply_to_user_id_str":null,"in_reply_to_screen_name":null,"geo":null,"coordinates":null,"place":null,"contributors":null,"retweet_count":0,"favorite_count":0,"favorited":false,"retweeted":false,"possibly_sensitive":false,"lang":"en"},"show_cookie_override_all":true,"video_session_enabled":false,"media_id":"844504104512749568","view_counts":null,"statusTimestamp":{"local":"4:05 AM - 22 Mar 2017"},"media_type":1,"user":{"screen_name":"MountainButorac","name":"Mountain Butorac","profile_image_url":"https:\/\/pbs.twimg.com\/profile_images\/808318456701521920\/vBvlAASx_bigger.jpg"},"watch_now_cta_url":null,"tweet_id":"844505243538931714"}" data-source-type="consumer">

复制上面的代码,并粘贴到记事本++(Notepad++)中,然后用"替换所有的",用/替换所有和\/。 (使用CTRL + H)

你会得到如下的内容

{
  "is_360": false,
  "duration": 28617,
  "scribe_widget_origin": true,
  "heartbeatEnabled": true,
  "video_url": "https://video.twimg.com/ext_tw_video/844504104512749568/pu/pl/e91Du5N2TZ09ZaW_.m3u8",
 
  "disable_embed": "0",
  "videoInfo": {
    "title": null,
    "description": null,
    "publisher": {
      "screen_name": "MountainButorac",
      "name": "Mountain Butorac",
      "profile_image_url": "https://pbs.twimg.com/profile_images/808318456701521920/vBvlAASx_normal.jpg"
    }
  },
  "cardUrl": "https://t.co/SdSorop3uN",
  "content_type": "application/x-mpegURL",
  "owner_id": "14120461",
  "looping_enabled": true,
  "show_cookie_override_en": true,
  "visit_cta_url": null,
  "scribe_playlist_url": "https://twitter.com/MountainButorac/status/844505243538931714/video/1",
  "source_type": "consumer",
  "image_src": "https://pbs.twimg.com/ext_tw_video_thumb/844504104512749568/pu/img/FFt3qkbeOh0RlGfZ.jpg",
  "heartbeatIntervalInMs": 5000.0,
  "use_tfw_live_heartbeat_event_category": true,
  "video_loading_timeout": 45000.0,
  "status": {
    "created_at": "Wed Mar 22 11:05:14 +0000 2017",
    "id": 844505243538931714,
    "id_str": "844505243538931714",
    "text": "Took my Goddaughter to meet the pope. She stole his hat! https://t.co/SdSorop3uN",
    "truncated": false,
    "entities": {
      "hashtags": [],
      "symbols": [],
      "user_mentions": [],
      "urls": [],
      "media": [{
        "id": 844504104512749568,
        "id_str": "844504104512749568",
        "indices": [57, 80],
        "media_url": "http://pbs.twimg.com/ext_tw_video_thumb/844504104512749568/pu/img/FFt3qkbeOh0RlGfZ.jpg",
        "media_url_https": "https://pbs.twimg.com/ext_tw_video_thumb/844504104512749568/pu/img/FFt3qkbeOh0RlGfZ.jpg",
        "url": "https://t.co/SdSorop3uN",
        "display_url": "pic.twitter.com/SdSorop3uN",
        "expanded_url": "https://twitter.com/MountainButorac/status/844505243538931714/video/1",
        "type": "photo",
        "sizes": {
          "small": {
            "w": 340,
            "h": 604,
            "resize": "fit"
          },
          "thumb": {
            "w": 150,
            "h": 150,
            "resize": "crop"
          },
          "large": {
            "w": 576,
            "h": 1024,
            "resize": "fit"
          },
          "medium": {
            "w": 576,
            "h": 1024,
            "resize": "fit"
          }
        }
      }]
    },
    "source": "\u003ca href=\"http://twitter.com/download/iphone\" rel=\"nofollow\"\u003eTwitter for iPhone\u003c/a\u003e",
    "in_reply_to_status_id": null,
    "in_reply_to_status_id_str": null,
    "in_reply_to_user_id": null,
    "in_reply_to_user_id_str": null,
    "in_reply_to_screen_name": null,
    "geo": null,
    "coordinates": null,
    "place": null,
    "contributors": null,
    "retweet_count": 0,
    "favorite_count": 0,
    "favorited": false,
    "retweeted": false,
    "possibly_sensitive": false,
    "lang": "en"
  },
  "show_cookie_override_all": true,
  "video_session_enabled": false,
  "media_id": "844504104512749568",
  "view_counts": null,
  "statusTimestamp": {
    "local": "4:05 AM - 22 Mar 2017"
  },
  "media_type": 1,
  "user": {
    "screen_name": "MountainButorac",
    "name": "Mountain Butorac",
    "profile_image_url": "https://pbs.twimg.com/profile_images/808318456701521920/vBvlAASx_bigger.jpg"
  },
  "watch_now_cta_url": null,
  "tweet_id": "844505243538931714"
}

从上面的JSON格式,可以看到video_url的值

https://video.twimg.com/ext_tw_video/844504104512749568/pu/pl/e91Du5N2TZ09ZaW_.m3u8

这里的问题是,在2016年8月1日之后,Twitter不再使用.mp4视频,而是转换为新的HLS,自适应流格式,带有.m3u8文件扩展名。

.m3u8文件基本上只是一个文本文的封装,它们非常小(300-500字节)。当您使用文本编辑器打开它们时,它们包含指向不同视频大小的链接

在记事本++(Notepad++)中打开文件m3u8,它会包含这样的代码

EXTM3U EXT-X-INDEPENDENT-SEGMENTS EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=256000,RESOLUTION=180x320,CODECS="mp4a.40.2,avc1.42001f"/ext_tw_video/844504104512749568/pu/pl/180x320/_Z42SY5zwMlLdFYx.m3u8 EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=832000,RESOLUTION=360x640,CODECS="mp4a.40.2,avc1.42001f"/ext_tw_video/844504104512749568/pu/pl/360x640/-Phfjbbx2yinirLi.m3u8

根据您需要的分辨率从上面复制对应的链接。重复相同的步骤,直到有.ts文件。下载.ts文件(视频文件)。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Three.js源码阅读笔记(Object3D类)
Dec 27 Javascript
JavaScript导出Excel实例详解
Nov 25 Javascript
node.js中的console.info方法使用说明
Dec 09 Javascript
jQuery on()方法使用技巧详解
Apr 16 Javascript
javascript设计模式--策略模式之输入验证
Nov 27 Javascript
jquery实现轮播图效果
Feb 13 Javascript
js canvas实现适用于移动端的百分比仪表盘dashboard
Jul 18 Javascript
详解React native全局变量的使用(跨组件的通信)
Sep 07 Javascript
基于JavaScript+HTML5 实现打地鼠小游戏逻辑流程图文详解(附完整代码)
Nov 02 Javascript
JSON字符串操作移除空串更改key/value的介绍
Jan 05 Javascript
微信小程序国际化探索实现(附源码地址)
May 20 Javascript
JavaScript 如何计算文本的行数的实现
Sep 14 Javascript
JavaScript之Blob对象类型的具体使用方法
Nov 29 #Javascript
VuePress 中如何增加用户登录功能
Nov 29 #Javascript
Vue.directive 实现元素scroll逻辑复用
Nov 29 #Javascript
Vue.js实现大屏数字滚动翻转效果
Nov 29 #Javascript
Vue基础配置讲解
Nov 29 #Javascript
jQuery实现弹幕特效
Nov 29 #jQuery
Vue实现多标签选择器
Nov 28 #Javascript
You might like
php做下载文件的实现代码及文件名中乱码解决方法
2011/02/03 PHP
php设计模式之单例模式使用示例
2014/01/20 PHP
php实现水仙花数示例分享
2014/04/03 PHP
浅谈php7的重大新特性
2015/10/23 PHP
Symfony2学习笔记之控制器用法详解
2016/03/17 PHP
Yii2第三方类库插件Imagine的安装和使用
2017/07/06 PHP
网页图片延时加载的js代码
2010/04/22 Javascript
解决iframe的frameborder在chrome/ff/ie下的差异
2010/08/12 Javascript
jQuery:节点(插入,复制,替换,删除)操作
2013/03/04 Javascript
JQuery下拉框应用示例介绍
2014/04/23 Javascript
node.js中的buffer.length方法使用说明
2014/12/14 Javascript
Jquery的基本对象转换和文档加载用法实例
2015/02/25 Javascript
JavaScript获取当前网页最后修改时间的方法
2015/04/03 Javascript
用自定义图片代替原生checkbox实现全选,删除以及提交的方法
2016/10/18 Javascript
浅谈javascript中的数据类型转换
2016/12/27 Javascript
JavaScript使用链式方法封装jQuery中CSS()方法示例
2017/04/07 jQuery
vue-resource调用promise取数据方式详解
2017/07/21 Javascript
angularjs结合html5实现拖拽功能
2018/06/25 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
2019/02/21 Javascript
js使用文件流下载csv文件的实现方法
2019/07/15 Javascript
简要讲解Python编程中线程的创建与锁的使用
2016/02/28 Python
python3处理含有中文的url方法
2018/05/10 Python
python实现监控某个服务 服务崩溃即发送邮件报告
2018/06/21 Python
Django框架实现逆向解析url的方法
2018/07/04 Python
python安装virtualenv虚拟环境步骤图文详解
2019/09/18 Python
python打开使用的方法
2019/09/30 Python
Python socket实现的文件下载器功能示例
2019/11/15 Python
使用python+poco+夜神模拟器进行自动化测试实例
2020/04/23 Python
瑞典灯具和照明网上商店:Lamp24.se
2018/03/17 全球购物
Sarenza德国:法国最大的时尚鞋和包包网上商店
2019/06/08 全球购物
采购部岗位职责
2013/11/24 职场文书
个人投资计划书
2014/05/01 职场文书
法院先进个人事迹材料
2014/05/04 职场文书
2015年先进个人自荐书
2015/03/24 职场文书
2015年妇委会工作总结
2015/05/22 职场文书
关于感恩的素材句子(38句)
2019/11/11 职场文书