隐藏相关视频 Youtube Iframe API答案

【问题标题】：Hide related videos Youtube Iframe API隐藏相关视频 Youtube Iframe API
【发布时间】：2019-06-19 04:09:05
【问题描述】：

我正在尝试隐藏在您暂停视频时显示的相关视频，但我从类似的问题中发现，截至 2018 年 9 月 25 日，没有办法禁止显示相关视频。

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

更具体一点：

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

这里是JSFiddle。

另外，用于隐藏视频标题、稍后观看按钮和分享按钮的参数showinfo=0 也不再起作用。它已于 2018 年 9 月 25 日弃用，但不知何故 KhanAcademy 仍然能够隐藏包括相关视频在内的内容。他们是否使用不同的 API？

像可汗学院那样完全隐藏相关视频或在顶部覆盖缩略图以隐藏相关视频对我有用。

【问题讨论】：

我不确定我是否理解。如果我从您的 jsfiddle 中删除所有 js 代码，它对我来说效果很好。 streamable.com/h8261
投反对票的人，你能告诉我为什么吗？有什么需要改进的地方？
@MoshFeu Streamable 在我的国家被屏蔽
您使用的是哪种服务？
视频分享服务？喜欢 Streamable？

标签： javascript youtube-iframe-api

【解决方案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 - disable related videos 和
https://webmasters.stackexchange.com/questions/102974/how-to-remove-the-related-videos-at-end-of-youtube-embedded-video

【讨论】：

我尝试了link 进行演示。使用进度条时仍会进入暂停状态。
@DragonBorn 你可以在这里看到代码并且它可以工作：onlinegdb.com/rJLICm3XE
有道理 :) 我在 jsfiddle 中阻止了广告块。
我可以理解谷歌已经改变了这一点，但我仍然得到那些相关的视频，但 KhanAcademy 能够隐藏它。
在 KhanAcademy 自己的网站上，完全没有 google 品牌和相关视频覆盖。但是，如果您拍摄 KhanAcademy 视频并将其嵌入到另一个站点，它们会按预期显示。 youtube 开发文档似乎没有提及任何关于此的内容 - 他们说相关视频（和适度的品牌）现在将始终出现。

【解决方案2】：

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

玩家名字是Plyr。

HTML：

<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%;
}

这是JSFiddle。它对我来说非常有效。

【讨论】：

这对我不起作用。完成该 clicp 后，它正在显示相关视频。