JavaScript 获取网页播放器流地址的两种方法

获取网页播放器流地址的两种方法

本文将介绍两种方法从网页中获取所有播放器内的流地址，方便开发者快速获取和处理播放器信息。

方法一：使用JavaScript遍历DOM树

在HTML文件中添加一个按钮用于触发获取流地址的功能。

<button onclick='printStreams()'>获取流地址</button>

编写JavaScript代码，使用DOM遍历查找播放器元素，再获取其中的流地址并打印输出。

function printStreams() {
  // 遍历DOM树查找播放器元素
  const players = document.querySelectorAll('video, audio');
  players.forEach((player) => {
    // 获取流地址并打印输出
    const streamSrc = player.currentSrc;
    console.log(streamSrc);
  });
}

方法二：使用第三方库（如Videogular）

在HTML文件中引入Videogular库。

<script src='https://cdn.jsdelivr.net/npm/videogular@2.4.0/videogular.min.js'></script>

编写JavaScript代码，使用Videogular库获取播放器内的流地址并打印输出。

function printStreams() {
  // 获取所有Videogular播放器
  const players = document.querySelectorAll('vg-player');
  players.forEach((player) => {
    // 获取流地址并打印输出
    const streamSrc = player.vgPlayer.getCurrentTime();
    console.log(streamSrc);
  });
}

注意: 上述代码示例仅供参考，具体的实现细节可能需要根据实际情况进行调整。