【问题标题】:Using Youtube API for stop video by playing another one使用 Youtube API 通过播放另一个视频来停止视频
【发布时间】:2017-12-05 10:10:08
【问题描述】:

当在同一页面上播放另一个视频时,我试图停止嵌入 youtube 视频,我发现了这个: stackoverflow fiddle-example 但是当我尝试在我的网页上使用它时它不起作用: my_test

脚本

<script>
var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

function onYouTubeIframeAPIReady() {
    var $ = jQuery;
    var players = [];
    $('iframe').filter(function(){return this.src.indexOf('http://www.youtube.com/') == 0}).each( function (k, v) {
        if (!this.id) { this.id='embeddedvideoiframe' + k }
        players.push(new YT.Player(this.id, {
            events: {
                'onStateChange': function(event) {
                    if (event.data == YT.PlayerState.PLAYING) {
                        $.each(players, function(k, v) {
                            if (this.getIframe().id != event.target.getIframe().id) {
                                this.pauseVideo();
                            }
                        });
                    }
                }
            }
        }))
    });
}
</script>

HTML

One: 
<iframe frameborder="0" allowfullscreen="1" title="YouTube video     player" width="160" height="100" src="http://www.youtube.com/embed    /zXV8GMSc5Vg?enablejsapi=1&amp;origin=http%3A%2F%2Ffiddle.jshell.net">    </iframe>
<br/>
Two:
<iframe frameborder="0" allowfullscreen="1" title="YouTube video player" width="160" height="100" src="http://www.youtube.com/embed/LTy0TzA_4DQ?enablejsapi=1&amp;origin=http%3A%2F%2Ffiddle.jshell.net">    </iframe>

怎么了?我已经在谷歌开发者上创建了项目,我已经创建了 API 密钥,但我不知道我必须把它放在哪里。

【问题讨论】:

    标签: youtube-api


    【解决方案1】:

    您忘记添加 jquery 库 (https://code.jquery.com/)

    【讨论】:

    • 这是一个错误,但现在我已经插入了 jquery 库,但它仍然不起作用
    • 我已经插入了最后一个库
    • 我也试过插入这个但还是不行:var GoogleAuth; // Google Auth object. function initClient() { gapi.client.init({ 'apiKey': 'YOUR_API_KEY', 'clientId': 'YOUR_CLIENT_ID', 'scope': 'https://www.googleapis.com/auth/youtube.force-ssl', 'discoveryDocs': ['https://www.googleapis.com/discovery/v1/apis/youtube/v3/rest'] }).then(function () { GoogleAuth = gapi.auth2.getAuthInstance(); // Listen for sign-in state changes. GoogleAuth.isSignedIn.listen(updateSigninStatus); }); }
    • 将 this.src.indexOf('youtube.com/') 更改为 this.src.indexOf('youtube.com/') 并将玩家的链接也设置为 https src="youtube.com 并更改此.pauseVideo(); 到 this.stopVideo();
    • 还将整个脚本设置在
    【解决方案2】:

    已解决 问题是他们在示例中使用了“origin”参数,如果设置此参数,可以避免将恶意的第三方JavaScript代码引入页面,从而控制YouTube播放器。

    src="http://www.youtube.com/embed/LTy0TzA_4DQ?enablejsapi=1&origin=http%3A%2F%2Ffiddle.jshell.net"

    这就是代码在小提琴页面上工作但在我的页面上工作的原因。 所以我用我的主机页面的完整 URL 更改了这个原始路径,现在它可以工作了!

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-08-24
      • 1970-01-01
      • 2016-08-29
      • 2019-11-18
      • 2018-08-23
      • 2013-01-25
      • 1970-01-01
      • 2021-09-13
      相关资源
      最近更新 更多