如何使用 Expo 播放 Youtube 视频答案

【问题标题】：How to play Youtube videos using Expo如何使用 Expo 播放 Youtube 视频
【发布时间】：2017-12-07 01:57:03
【问题描述】：

我正在尝试在我的世博项目中使用react-native-youtube component。但是，我无法让它工作。到目前为止，我只有一个带有红色边框的黑屏。我尝试按照online 上的视频说明进行操作，但是，expo 没有 iOS 或 Android 文件夹，这意味着我无法在 XCode 中打开它并摆弄它。如何使用 expo 播放 youtube 视频？正如您可能已经从我的问题中注意到的那样，我是使用 expo 的 react-native 新手。

【问题讨论】：

Github 问题：github.com/inProgress-team/react-native-youtube/issues/158
对于仍在寻找这个的人，试试这个带有 expo 支持的包 - github.com/LonelyCpp/react-native-youtube-iframe

标签： ios react-native youtube expo

【解决方案1】：

目前，Expo 不支持 YouTube。您可以弹出项目并安装 react-native-youtube 库或从 WebView 加载视频，如下所示：

<WebView
    style={{flex:1}}
    javaScriptEnabled={true}
    source={{uri: 'https://www.youtube.com/embed/ZZ5LpwO-An4?rel=0&autoplay=0&showinfo=0&controls=0'}}
/>

【讨论】：

当用户导航到其他屏幕时，视频不会停止播放。
@yogeshhkumarr 你必须删除/杀死网络视图
我使用了这种方法，但它被 Google Play 商店拒绝了，因为“启用 YouTube 视频的后台播放违反了设备和网络滥用政策。这可以通过按电源按钮打开播放 YouTube 视频时屏幕关闭。” --- 我无法在我自己的设备上重现他们所描述的内容，所以这可能是其他设备的问题（？？？）。无论如何，这里描述了解决方案：stackoverflow.com/questions/36382935/…
@Clay 你可以在应用程序进入后台时暂停视频，检查facebook.github.io/react-native/docs/appstate.html
在我的评论中，我链接到一个 stackoverflow 答案（您已回答），该答案是执行您建议的说明。

【解决方案2】：

对于仍在寻找此功能的任何人，请尝试使用 expo 支持的此软件包

https://github.com/LonelyCpp/react-native-youtube-iframe

为 React Native 构建的 Youtube IFrame 播放器 API 的封装。使用已知比原生 youtube 应用更稳定的 webview 播放器。

由于新的 expo SDK 支持现代社区维护的 webview，它应该可以跨平台无缝运行

【讨论】：

【解决方案3】：

目前在 React Native 应用程序中获取 YouTube 视频的方法是在您的项目中使用 React Native 的 WebView 组件。

下面是一个小食，它以 Instagram 注册流程为例展示了 WebView 如何工作：https://snack.expo.io/HJRKKTmAx。

如果这不是您要找的东西，我很抱歉:(

要使用 react-native-youtube 组件，您必须分离您的 Expo 项目 ExpoKit：

ExpoKit 是一个 Objective-C 和 Java 库，允许您将 Expo 平台和现有 Expo 项目作为更大的标准原生项目的一部分使用 - 您通常会使用 Xcode、Android Studio 或 react-native 创建一个初始化。

我希望这两个选项可以解决您的问题，如果有其他方法可以提供帮助，请告诉我。

【讨论】：

当用户导航到其他屏幕时，视频不会停止播放。
您必须在组件卸载时销毁播放器以使其停止。