Javascript 获取当前 YouTube 视频时间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6970013/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Getting Current YouTube Video Time
提问by James
I am writing a Browser Plugin and need to find a way to get the current time a YouTube Video playing on YouTube using JavaScript. I have been playing around in the Chrome JavaScript Console and haven't had any luck.
我正在编写一个浏览器插件，需要找到一种方法来获取使用 JavaScript 在 YouTube 上播放的 YouTube 视频的当前时间。我一直在 Chrome JavaScript 控制台中玩，但没有任何运气。
It appears that the chrome API only works with embedded video players not a video that is playing on on youtube.com. One option I looked into is in the share section of a video their is an input box for the "start at:" time that contains the current time of the video. I have tried using .value and .text on this input box and they both return undefined? Does anyone have any ideas?
看来 chrome API 只适用于嵌入式视频播放器，而不是在 youtube.com 上播放的视频。我研究过的一个选项是在视频的共享部分，它们是“开始于：”时间的输入框，其中包含视频的当前时间。我试过在这个输入框上使用 .value 和 .text ，它们都返回 undefined？有没有人有任何想法？
回答by Joseph Marikle
回答by Jason Gennaro
Depends on what you want
取决于你想要什么
player.getCurrentTime():Number
Returns the elapsed time in seconds since the video started playing.
返回自视频开始播放以来经过的时间（以秒为单位）。
player.getDuration():Number
Returns the duration in seconds of the currently playing video. Note that getDuration() will return 0 until the video's metadata is loaded, which normally happens just after the video starts playing.
返回当前播放视频的持续时间（以秒为单位）。请注意，getDuration() 将返回 0，直到加载视频的元数据，这通常发生在视频开始播放之后。
回答by zxcat
Finally I found how to make it work on iOS (and Android too).
Actually, the whole youtube js apiwas broken for me if run on mobile browser.
最后我找到了如何让它在 iOS（和 Android）上工作。
实际上，如果在移动浏览器上运行，整个youtube js api对我来说就坏了。
Problem solved by creatingplayer using new YT.Playeras described in YouTube IFrame API.
通过使用YouTube IFrame API 中所述创建播放器解决了问题。new YT.Player
Please note:only creating <iframe>from <div>placeholder works for mobile browsers at the time. If you try to use existing <iframe>in new YT.Playercall, as mentioned in IFrame API, this will not work.
请注意：当时只有<iframe>从<div>占位符创建才适用于移动浏览器。如果您尝试<iframe>在new YT.Player调用中使用现有的，如 IFrame API 中所述，这将不起作用。
After player created, it's possible to use player.getCurrentTime()or player.getDuration()with playerinstance created.
播放器创建后，可以使用player.getCurrentTime()或player.getDuration()与player创建的实例一起使用。
Note: I had no luck calling this methods on player obtained withplayer = document.getElementById(...)(from @JosephMarikle answer).
Only created playerinstance worked in mobile browsers.
注意：我没有运气在获得的玩家上调用此方法player = document.getElementById(...)（来自@JosephMarikle 回答）。
只有创建的player实例在移动浏览器中有效。
Useful links:
有用的链接：
回答by Susanne
Just FYI, There is a new iframe API for the YouTube player: https://developers.google.com/youtube/iframe_api_reference
仅供参考，YouTube 播放器有一个新的 iframe API：https: //developers.google.com/youtube/iframe_api_reference
回答by Muhammed Ozdogan
You can use Html5 Video APIon youtube.com
您可以使用HTML5视频API上youtube.com
var htmlVideoPlayer = document.getElementsByTagName('video')[0];
htmlVideoPlayer.currentTime
Note: It's not gonna work on Youtube Iframe API because Iframes are isolated. You cannot access the context of a Youtube IFrame .
注意：它不适用于 Youtube Iframe API，因为 Iframe 是孤立的。您无法访问 Youtube IFrame 的上下文。
回答by yaya
In 2020, this works:
在 2020 年，这有效：
player.playerInfo.currentTime
full code: see it live on codepen
完整代码： 在 codepen 上实时查看
回答by Mayank Sudden
Stop at specific time youtube video and show notification box in GWD
在特定时间停止 YouTube 视频并在 GWD 中显示通知框
<script>
var yid = document.getElementById("gwd-youtube_1");
var idBox = document.getElementById("box1");
pausing_function = function(event) {
var aa = setInterval(function() {
if (yid.getCurrentTime() > 8.0 && yid.getCurrentTime() < 8.1) {
yid.pause(yid);
idBox.style.opacity = 1;
console.log(yid.getCurrentTime() + "playing")
clearInterval(aa);
yid.removeEventListener("playing", pausing_function);
}
}, 100)
}
yid.addEventListener("playing", pausing_function);
var pausing_function_1 = function() {
if (yid.getCurrentTime() > 8.1) {
console.log(yid.getCurrentTime() + "pause")
// remove the event listener after you paused the playback
yid.removeEventListener("playing", pausing_function);
}
};
</script>
play video and hide notification
播放视频并隐藏通知
<script type="text/javascript" gwd-events="handlers">
window.gwd = window.gwd || {};
gwd.pauseVideo = function(event) {
var idBox = document.getElementById("box1");
idBox.style.opacity = 0;
};
</script>
<script type="text/javascript" gwd-events="registration">
// Support code for event handling in Google Web Designer
// This script block is auto-generated. Please do not edit!
gwd.actions.events.registerEventHandlers = function(event) {
gwd.actions.events.addHandler('gwd-youtube_1', 'playing', gwd.pauseVideo, false);
};
gwd.actions.events.deregisterEventHandlers = function(event) {
gwd.actions.events.removeHandler('gwd-youtube_1', 'playing', gwd.pauseVideo, false);
};
document.addEventListener("DOMContentLoaded", gwd.actions.events.registerEventHandlers);
document.addEventListener("unload", gwd.actions.events.deregisterEventHandlers);
</script>
