通过书签来获取视频地址或其它数据

• 前言
  • 最原始的做法
  • 进一步的做法
  • 更进一步的做法
  • 优化做法
• 常用Tips

在某些情况下，需要我们打开视频播放页面、按F12、查看Network网络请求来获取某个特定的地址。
当然，量大的话，我们可以直接上代码来避免不必要的重复工作，但这不是唯一的操作。
这里做个笔记，记录一种还算简便的折中办法。
如何取舍自己衡量。

前言

最原始的做法

1. 打开视频播放页面
2. 按下F12，切换到网络Network
3. 刷新页面
4. 获取视频m3u8、mp4或flv链接

进一步的做法

1. 分析视频播放页内容(准备工作,在逻辑更改之前不必再做)
2. 打开视频播放页面
3. 按下F12，切换到控制台在Console
4. 运行js代码

更进一步的做法

1. 分析视频播放页内容(准备工作,在逻辑更改之前不必再做)
2. 在地址栏输入 javascript:[js代码]

以上需要注意，

• 某些浏览器可能会没有反应，那么就不支持这种做法，直接跳到下面的优化做法
• 最好将js代码压缩成一行，否则可能会没反应

优化做法

1. 分析视频播放页内容(准备工作,在逻辑更改之前不必再做)
2. 添加书签，内容为压缩的javascript:[js代码]，标题起一个易于理解的名称
3. 打开视频播放页面
4. 点击书签，获取链接

常用Tips

• js/html压缩格式化
• 腾讯/爱奇艺m3u8分析
• 常用的文本提示、复制和下载

  // 一种较为通用的获取视频的方法(对iframe和blob无效)
  alert(document.querySelector("video").src);
  alert(document.querySelector("video source").src);
  // 复制文本
  function __copy(text) {
      let copyInput = document.createElement('input');
      document.body.appendChild(copyInput);
      copyInput.setAttribute('value', text);
      copyInput.select();
      document.execCommand("Copy");
      copyInput.remove()
  }
  
  // 下载url的内容
  // 实际上是缓存完毕以后再生成blob，仅适用于媒体资源较小的时候
  function __download(url, filename) {
      let xhr = new XMLHttpRequest();
      xhr.open('GET', url, true);
      xhr.responseType = 'blob';
      xhr.onload = function(e) {
          if (this.status === 200) {
              let blob = this.response;
              let a = document.createElement("a");
              a.href = URL.createObjectURL(blob);
              a.setAttribute("download", filename);
              a.click();
          }
      };
      xhr.send();
  };
  
  console.log("控制台输出");
  alert("弹框提示");
    
    
  //__download("https://www.baidu.com/img/flexible/logo/pc/result.png", "baidu.png");
  __download("https://www.baidu.com", "baidu.html");