使用@capgo/capacitor-youtube-player
Capacitor YouTube Player插件接口,提供控制YouTube视频播放的方法
安装
bun add @capgo/capacitor-youtube-player
bunx cap sync
本插件暴露的内容
initialize- 初始化一个新的 YouTube 播放器实例。destroy- 销毁一个播放器实例并释放资源。stopVideo- 停止视频播放并取消加载。请谨慎使用 - pauseVideo() 通常更合适。playVideo- 播放当前缓冲或加载的视频。最终播放器状态将为 PLAYING (1)。
主 WebView Referer 补丁
启用 patchRefererHeader 当 YouTube 内容在插件中正常工作,但从 Capacitor 的主 WebView 中失败时,YouTube 期望一个浏览器样式的 Referer 补丁仅适用于
{
"plugins": {
"YoutubePlayer": {
"patchRefererHeader": true,
"refererHeader": "https://www.youtube.com"
}
}
}
, 和 youtube.com, youtube-nocookie.com请求。现有的请求级别 youtu.be when YouTube content works in the plugin but fails from __CAPGO_KEEP_0__'s main WebView because YouTube expects a browser-like Referer 标题保持不变,且 refererHeader 默认为 https://www.youtube.com 当省略时。
示例用途
initialize
初始化一个新的YouTube播放器实例。
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
await YoutubePlayer.initialize({
playerId: 'my-player',
videoId: 'dQw4w9WgXcQ',
playerSize: { width: 640, height: 360 },
privacyEnhanced: true
});
destroy
销毁一个播放器实例并释放资源。
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
const result = await YoutubePlayer.destroy({ playerId: 'player-id-123' });
console.log(result);
stopVideo
停止视频播放并取消加载。请谨慎使用 - pauseVideo()通常更合适。
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
const result = await YoutubePlayer.stopVideo({ playerId: 'player-id-123' });
console.log(result);
playVideo
播放当前缓冲或已加载的视频。最终播放器状态将为PLAYING (1)。
import { YoutubePlayer } from '@capgo/capacitor-youtube-player';
const result = await YoutubePlayer.playVideo({ playerId: 'player-id-123' });
console.log(result);
完整参考
- GitHub: https://github.com/Cap-go/capacitor-youtube-player/
- 文档:/docs/plugins/youtube-player/
继续使用 @capgo/capacitor-youtube-player
如果您正在使用 使用 @capgo/capacitor-youtube-player 将其与 @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-youtube-player 连接起来 查看 @capgo/capacitor-youtube-player 的实现细节 为 @capgo/capacitor-youtube-player 的实现细节 查看 Getting Started 的实现细节 使用 @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-live-activities 查看 Using @capgo/capacitor-live-activities 的原生能力 @capgo/capacitor-live-activities 查看 @capgo/capacitor-live-activities 的实现细节 使用 @capgo/capacitor-live-activities 使用@capgo/capacitor-video-player 为使用@capgo/capacitor-video-player的原生能力