标签: youtube-iframe-api

检测 youtube iframe 自动播放失败

iOS和 Android 仅允许在用户交互的回调中播放视频。Chrome 66引入了自动播放政策

我们如何检测嵌入式 YouTube iframe 无法自动播放视频,以便我们可以静音播放并显示“点击取消静音”按钮?

API 有 onError 回调,但不清楚是否会引发错误以及会引发什么错误。由于 Chrome 的媒体参与指数,这也很难测试。

可以检测到 HMTL 5 视频自动播放故障。YouTube iframe API 中有等效的吗?

var promise = document.querySelector('video').play();

if (promise !== undefined) {
  promise.then(_ => {
    // Autoplay started!
  }).catch(error => {
    // Autoplay was prevented.
    // Show a "Play" button so that user can start playback.
  });
}
Run Code Online (Sandbox Code Playgroud)

谢谢

youtube-iframe-api

5
推荐指数
0
解决办法
891
查看次数

如何防止在 Windows 10 中更改音量时显示 YouTube 视频名称。 [YouTube IFrame Api]

问题:如何防止在 Windows 10 中更改音量时显示 YouTube 视频名称。 [YouTube IFrame Api]

我不想要什么:

我不想要的图片

我不希望在更改音量时显示 YT 视频的名称。这真的很烦人,我找不到任何方法来禁用它。

有某种playervar可以阻止这个吗?

谢谢!

javascript youtube-iframe-api

5
推荐指数
1
解决办法
1150
查看次数

如何使用 YouTube IFrame Player API 监听时间更改事件?

我在 YouTube IFrame Player API 文档上找不到任何方法来监听时间变化(因此我可以在 UI 中显示视频的当前时间/持续时间)。有没有办法在不轮询的情况下做到这一点getCurrentTime()

javascript youtube iframe youtube-iframe-api

5
推荐指数
1
解决办法
2101
查看次数

Flutter Web (3.7.5) - 平台视图类型的高度/宽度 - youtube_player_iframe

我一直在我的网络项目中使用youtube_player_iframe包,并一直在尝试理解和修复以下问题:

Height of Platform View type: [youtube-0] may not be set. Defaulting to `height: 100%`.
Set `style.height` to any appropriate value to stop this message.
Width of Platform View type: [youtube-0] may not be set. Defaulting to `width: 100%`.
Set `style.width` to any appropriate value to stop this message.
Run Code Online (Sandbox Code Playgroud)

一切似乎都按原样工作正常,但看到这条消息出现却很麻烦。这么说,我确实想确定并解决根本原因。在 Flutter 2.5 版本中,平台处理调整大小和定位视图的方式发生了变化。可以在此处找到更改的文档和迁移指南。不过,即使有指南,我似乎也缺乏利用它的能力。

以下是 Flutter 页面的迁移代码:

ui.platformViewRegistry.registerViewFactory(viewType, (int viewId) {
  final html.Element htmlElement = html.DivElement()
    // ..other props
    ..style.width = '100%'
    ..style.height = '100%';
  // ... …
Run Code Online (Sandbox Code Playgroud)

youtube-iframe-api flutter youtube-player-flutter

5
推荐指数
0
解决办法
1098
查看次数

Ionic:iframe 中的外部链接在 Web 视图中打开(嵌入 YouTube 播放器)

在我的 ionic(v1.2.4)应用程序中,有一个嵌入式 YouTube 播放器,带有“在 YouTube 上观看”链接。如果用户单击此链接,YouTube 网站将在科尔多瓦的网络视图中打开。它破坏了我的应用程序的当前状态。我想在系统的网络浏览器中打开该链接(应用程序浏览器插件中的cordova)。

与任何 iframe 中的任何链接相同(vimeo、soundcloud...)

由于跨域安全问题,无法从 iframe 外部使用 JS 修改此链接。所以我无法将目标属性从 更新_blank_system

显示对话框onbeforeunload实际上并不是一个选项,因为它看起来很丑:)

是否有可能避免页面加载到同一个 webview 或系统的 web 浏览器中?使用 iframe 的sandbox属性来破坏链接不是一个选项,因为它会完全破坏 YouTube 播放器。

谢谢和欢呼

PS:我在这里问了这个问题,但无法获得任何有用的信息

iframe youtube-iframe-api ionic-framework

4
推荐指数
1
解决办法
8515
查看次数

Android视频(使用最新的API)无法在Android上的Chrome上播放?

我正在为客户开发一个网站,此时我很困难,因为我们都能够在Android上的Chrome中重新创建此问题.

无论出于何种原因,当我们在Chrome上的Android上加载此页面时:

http://miso.gostppro.com

视频加载器只是保持旋转和旋转,视频从不播放.

点击它也不会做任何事情(不开始播放,不在YouTube应用中打开它,什么都没有).

它在其他浏览器中运行得很好(适用于Android的Firefox加载并播放它很好),所以我很困惑为什么会发生这种情况.

我错过了什么?

它是API中的一些调用还是什么?

我迷路了.

youtube-api youtube-javascript-api mobile-chrome youtube-iframe-api

4
推荐指数
1
解决办法
1672
查看次数

默认情况下,嵌入带字幕的Youtube无法正常工作

我正在尝试嵌入YouTube电影,并且希望默认情况下启用字幕。

我知道从https://developers.google.com/youtube/player_parameters#cc_load_policy应该使用cc_load_policy=1

我使用下面的html代码,但似乎无法正常工作。也就是说,它会关闭字幕(您可以手动打开字幕,因此视频中确实有字幕)。我究竟做错了什么?

我尝试了以下两种选择:

<iframe src="https://www.youtube-nocookie.com/embed/xxxxxx?rel=0&amp;&showinfo=0&cc_load_policy=1" frameborder="0" allowfullscreen></iframe>
<iframe src="https://www.youtube-nocookie.com/embed/xxxxxx?rel=0&amp;&showinfo=0" cc_load_policy="1" frameborder="0" allowfullscreen></iframe>
Run Code Online (Sandbox Code Playgroud)

javascript embed youtube iframe youtube-iframe-api

4
推荐指数
1
解决办法
4877
查看次数

Youtube:强制自动生成字幕的参数

如果我的视频有英文字幕,我可以使用如下代码强制显示它们:

hl=en&cc_lang_pref=en&cc_load_policy=1
Run Code Online (Sandbox Code Playgroud)

所以完整的代码是:

<iframe 
    width="560" height="315"
    src="https://www.youtube.com/embed/3I3Rjw_4Ucw?hl=en&cc_lang_pref=en&cc_load_policy=1"
    frameborder="0" gesture="media"
    allow="encrypted-media" allowfullscreen>
</iframe>
Run Code Online (Sandbox Code Playgroud)

但是,如果视频没有字幕,它似乎不起作用。在这种情况下,我想强制显示 Youtube 自动生成的字幕。是否可以?

youtube iframe youtube-api youtube-iframe-api

4
推荐指数
1
解决办法
3521
查看次数

隐藏相关视频Youtube Iframe API

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

更改的效果是您无法禁用相关视频.但是,您可以选择指定播放器中显示的相关视频应与刚刚播放的视频位于同一频道.

更具体:

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

这是JSFiddle.

此外,该参数showinfo=0不再起作用,用于隐藏视频标题,观看稍后按钮和分享按钮.它已于2018年9月25日弃用,但不知何故KhanAcademy仍能隐藏包括相关视频在内的内容.他们使用的是不同的API吗?

像汗学院一样隐藏相关视频或在顶部覆盖缩略图以隐藏相关视频将对我有用.

javascript youtube-iframe-api

4
推荐指数
1
解决办法
3757
查看次数

Youtube Player Api 获取截图

这个页面iframe上有一个我想从标签中获取屏幕截图,所以我必须到达标签中的视频标签。videoiframe

当我打开控制台并运行此代码时:

 const videoElement = document.getElementsByTagName('iframe')[0]
                 .contentWindow.document.getElementsByTagName('video')[0];

//Extracting picture from video tag
    const canvas = document.createElement('canvas');
        canvas.width = videoElement.videoWidth;
        canvas.height = videoElement.videoHeight;
        canvas.getContext('2d').drawImage(videoElement, 0, 0, canvas.width, canvas.height);
Run Code Online (Sandbox Code Playgroud)

已抛出此错误:

Uncaught DOMException: Blocked a frame with origin "https://developers.google.com" from accessing a cross-origin frame.
    at <anonymous>:1:57
Run Code Online (Sandbox Code Playgroud)

另外,我检查了这个问题

我的问题是如何从 YouTube Player API 获取屏幕截图?

javascript iframe youtube-api youtube-javascript-api youtube-iframe-api

4
推荐指数
1
解决办法
1770
查看次数