隐藏相关视频Youtube Iframe API

Question

我试图隐藏暂停视频时显示的相关视频，但正如我从类似问题中发现的，截至2018年9月25日，无法禁用相关视频的显示。

更改的效果是您将无法禁用相关视频。但是，您将可以选择指定播放器中显示的相关视频应来自与刚刚播放的视频相同的频道。

更具体地说:

在更改之前，如果参数的值设置为0，则播放器不会显示相关视频。更改后，如果rel参数设置为0，则播放器将显示与刚刚播放的视频来自同一频道的相关视频。

这是JSFiddle。

此外，参数＜code＞showinfo=0＜code＞不再起作用，该参数用于隐藏视频标题、稍后观看按钮和共享按钮。截至2018年9月25日，它已被弃用，但不知何故，KhanAcademy仍然能够隐藏这些内容，包括相关视频。他们使用的是不同的API吗？

像Khan Academy那样完全隐藏相关视频，或者在顶部覆盖缩略图以隐藏相关视频对我来说很有用。

Answer 1

从2018年9月25日起，youtube改变了其API。因此，您不能禁用相关视频，但可以指定可以显示的列表。https://developers.google.com/youtube/player_parameters#rel

我已经尝试了下面提供的所有可能的答案您可以尝试此处的代码：https://jsfiddle.net/ibrth/0zx7o6rs/62/和https://jsfiddle.net/ibrth/z9tk1q3r/

function onYouTubeIframeAPIReady() {
    player = new YT.Player('video-placeholder', {
        width: 600,
        height: 400,
        videoId: '0sDg2h3M1RE',
        playerVars: {
            color: 'white',
            playlist: 'taJ60kskkns,FG0fTKAqZ5g',
            rel:0,
            enablejsapi:1,
            modestbranding: 1, showinfo: 0, ecver: 2
        },
        events: {
            onReady: initialize
        }
    });
}

我在这里找到了答案：

Youtube Javascript API - 禁用相关视频并
https://webmasters.stackexchange.com/questions/102974/how-to-remove-the-related-videos-at-end-of-youtube-embedded-video

Answer 2

所以我找到了一个开源播放器，它确实隐藏了所有相关视频，包括标题，分享和稍后观看按钮。

玩家名字是Plyr。

网页：

<div class="plyr__video-embed" id="player">
    <iframe src="https://www.youtube.com/embed/9C1leq--_wM??origin=https://plyr.io&amp;iv_load_policy=3&amp;modestbranding=1&amp;playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1" allowfullscreen allowtransparency allow="autoplay"></iframe>
</div>

您可以使用以下命令对其进行初始化:

const player = new Plyr('#player', {});

// Expose player so it can be used from the console
window.player = player;

CSS隐藏相关视频：

.plyr__video-embed iframe {
    top: -50%;
    height: 200%;
}

这是小提琴。对我来说效果很好。