如何在视频 ID 未知的情况下使用 JS API 访问 Dailymotion 视频？答案

【问题标题】：How to access a Dailymotion video using the JS API when the video ID is unknown?如何在视频 ID 未知的情况下使用 JS API 访问 Dailymotion 视频？
【发布时间】：2017-09-07 16:49:23
【问题描述】：

我有一些嵌入代码，例如：

<iframe id="video1" class="video" src=""//www.dailymotion.com/embed/video/VIDEO_ID?autoPlay=1&wmode=transparent&loop=1&controls=0&showinfo=0&api=1&endscreen-enable=0&mute=1" allowfullscreen="true" frameborder="0" width="560" height="349"></iframe>

我正在尝试使用 Javascript 访问此视频，但事先不知道视频 ID（它必须能够在我们的 CMS 中设置并由任何编辑器更改）。页面上也可以有多个视频。无法在我的 .js 文件中硬编码视频 ID。

使用 Javascript API，我需要编写一个自定义播放/暂停函数（传递他们单击的按钮对象），还需要检测视频何时结束并重新启动它（模拟循环，Dailymotion 显然是这样做的由于某种原因不支持）。但这似乎是一个呼吁：

DM.Player(document.getElementById(iframeID), { video: VIDEO_ID})

需要知道视频的 ID（我确实知道视频所在的 iFrame ID，但显然这不足以像访问其他视频平台那样访问播放器）。

然后，我需要能够创建一个函数来根据用户是否单击特定视频上的播放/暂停切换来调用播放或暂停。我的 Javascript 知识不是很好，但是通过知道 iframe ID，我已经能够在其他平台上做到这一点。如果我硬编码视频 ID，播放/暂停确实有效，但前提是页面上有一个视频，并且只有当我不尝试“循环”视频时。

这是一个私人视频，如果重要的话 - 我们希望它只能在我们的网站上观看，而不是在 Dailymotion 上观看。

非常感谢伪代码，因为我发现他们的 API 文档对于新手来说有点不完整（例如没有指定参数是必需的还是可选的，也没有列出可用的选项，例如 DM.Player 初始化期间的参数和事件）

编辑：这是我使用其他视频托管服务（YouTube、Vimeo、Brightcove 等）访问视频 API 的方式

我构建了一个包含特定类名的所有 HTML 元素的数组（回想一下，视频可能不止一个）。假设类名是“.video”，所以我在页面上构建了一个包含所有“.video”及其相应 HTML id 的数组。然后我使用 document.getElementById 来填充玩家的数组。

然后在播放/暂停点击功能中，我可以像这样访问视频：

var player = players[index];
var state = player.getPlayerState();
if (state == 1) {
     player.pauseVideo();
}
else {
     player.playVideo();
}

这不适用于 Dailymotion，因为必须事先知道实际的 DM 视频 ID（而不是 HTML 元素的 ID）。我想知道是否有办法在不知道视频 ID 的情况下通过 Javascript API 访问视频？

【问题讨论】：

我想我没有关注。如果没有视频 ID，您将如何访问视频？你还有哪些其他数据？这就像问“我如何在不使用电话号码的情况下给某人打电话？”
@johnh10 我更新了我的问题以解释我如何在不知道视频 ID 的情况下访问视频。如我的问题所述，通常我只需要 iFrame ID 或 HTML 元素 ID（我分配）。我希望这会有所帮助。

标签： javascript video dailymotion-api

【解决方案1】：

我没有使用 DailyMotion API，但我完成了这个可能对你有用的实验。

看看下面我的示例代码中的cmets是否能帮助你理解如何使用自己的带有JS函数的按钮以及如何处理视频“end”事件等。

<!DOCTYPE html>
<html>
<body>

<!-- 1. Load DailyMotion API (Javascript) -->
<script src='https://api.dmcdn.net/all.js'> </script>

<!-- 2. Create container for DM Player instance  -->
<div id='player'></div>

<!-- 3. Javascript stuff goes here -->
<script>

    //Set VIDEO_ID (retrieve or update from your CMS)
    //**example** var VIDEO_ID = get_video_id.php **where PHP returns/echo the text of ID**

    var VIDEO_ID = "xwr14q"; //update this via your CMS technique

    //Create DM Player instance//
    var player = DM.player(document.getElementById('player'), {
    video: VIDEO_ID,
    width: "100%", height: "100%",
    params: { autoplay: false, mute: true }


    });

    //Handle video ending (seek back to zero time)//
    player.addEventListener('end', function (evt) { evt.target.currentTime = 0; evt.target.play() } );

    //Control functions for DM Player instance//
    function func_Play()
    { player.play(); }

    function func_Pause()
    { player.pause(); }

</script>



<p>

<!-- Buttons for play pause -->
<button onclick="func_Play()"> PLAY </button>

<button onclick="func_Pause()"> PAUSE </button>

</p>

</body>
</html>

还有关于

“...页面上可能有多个视频”

做一些“体验质量”测试。只需确保您的用户不介意同时运行多个循环视频（例如： 可能会减慢您的页面/他们的浏览器，或者在移动设备上耗尽他们的数据限额等）。

要处理多个视频，我只需将每个视频播放器放在它自己的 HTML 页面中（如上面显示的代码），然后在主页中加载多个指向每个播放器 HTML 的 iframe。

【讨论】：

感谢您的回复。它正在设置我无法弄清楚该怎么做的视频 ID。 HTML 已经生成，并且在调用脚本时填充了视频。 Javascript 是客户端的，因此除非像您的示例那样硬编码，否则我无法获取视频 ID。我使用过的所有其他 API（例如 YouTube 或 Vimeo）都允许您使用 iFrame ID。我将更新我的问题以包括我正在使用其他 API 做什么。