iframe标签解析腾讯视频链接的获取不到总时长的解决方案（Txp.play.js）

前端

2023-11-12 11:35:22

攻破解析腾讯视频链接难题：用 TxP.play.js 轻松获取视频总时长

在构建项目时，解析腾讯视频链接是一个常见需求。然而，我们遇到了一个令人头疼的问题：无法获取视频的总时长，这给播放器功能带来了极大不便。

传统方法的困境

以往，我们使用 HTML5 的 video 标签来解析视频。但当解析腾讯视频链接时，由于版权保护，我们无法直接获取视频文件，也就无法获取总时长。

基于 TxP.play.js 的解决方案

为了解决这一难题，我们深入研究了腾讯视频提供的播放器 API——TxP.play.js。它提供了一个强大的 API，其中就包含获取视频总时长的功能。

实现步骤

1. 加载 TxP.play.js

将 TxP.play.js 添加到你的网页中：

<script src="https://v.qq.com/txp.play.js"></script>

2. 创建视频播放器

使用 TxP.play.js 创建视频播放器：

var player = new TxP.Player({
  vid: '视频ID',
  width: '播放器宽度',
  height: '播放器高度',
  container: '播放器容器ID'
});

3. 获取视频总时长

通过 player 对象的 getDuration() 方法获取视频总时长：

var duration = player.getDuration();

代码示例

<script src="https://v.qq.com/txp.play.js"></script>

<div id="player-container"></div>

<script>
  var player = new TxP.Player({
    vid: '视频ID',
    width: '640px',
    height: '360px',
    container: 'player-container'
  });

  var duration = player.getDuration();

  console.log('视频总时长：' + duration);
</script>