问题标签 [react-player]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - ReactPlayer 不能在 IOS 平台自动播放
视频只能在 pc 或 android 上自动播放，但在 IOS 上，它不会 为我的代码播放图像
css - 嵌入 Vimeo 播放器（或任何 iframe 视频播放器）全宽和全高
我基本上想让嵌入的 Vimeo 视频占据给定页面（或者它的父 div）的全部宽度和高度。嵌入式 Vimeo 是一个 iframe，我正在使用 react-player 插件嵌入视频。
我看过这些响应式宽度 vimeo 视频的例子：https ://jsfiddle.net/e6w3rtj1/ 。将填充底部或顶部设置为纵横比百分比。但是，这只解决了宽度的问题。我基本上想要object-fit: fill这个 iframe 的图像和视频选项。可能吗？有没有人遇到过解决方案？
javascript - ReactPlayer 中的 seekTo() 不适用于 YouTube 链接
我正在创建一个将使用 youtube API 的音乐播放器。现在我创建了一个名为MainPlayer.JS的播放器。进度条在适当的时间工作正常，但我无法添加寻找进度条来转发音乐的功能。进度条位于另一个名为SeekBar.JS的组件中。
谁能帮我弄清楚如何在我的音乐应用程序中添加搜索功能。我正在使用 React.JS 来构建项目。我正在将此包用于名为react-player的音乐播放器
MainPlayer.JS的代码是
SeekBar.JS的代码是
javascript - 在 React 中的功能组件内创建对外部类组件的引用
我想在我的应用程序中使用反应播放器库
console.log(player.current);有效，但在下一行我得到了错误
未捕获的类型错误：无法读取未定义的属性“seekTo”
怎么了？我这里不能用useRef？我应该制作Player类组件吗？如何修复它并使其工作？
css - 如何从默认值更改反应播放器的宽度
我正在使用 react-player 在应用程序中播放视频。它带有不响应的默认宽度。我使用了一些css，但它不起作用。
请告诉我一种可以改变它的宽度和高度的方法
reactjs - 来自 IOS 移动设备的 youtube 无法正常工作
当我使用带有控件选项和 youtube 视频的 react-player 时，我无法按下音量和全屏按钮，因为标题隐藏了它们并且单击视频会发生双击。
使用 youtube iframe 按预期工作（按钮移动到底部栏），但我需要支持多个视频平台。
重现步骤
- 去https://cookpete.com/react-player/
- 打开控件
- 单击其中一项 youtube 测试
reactjs - 如何在使用 React Player 更改 url 时停止播放加载的视频并加载新视频？
我将其添加React Player到我的应用程序中，它看起来像：
它工作正常，但是当我更改 url 时没有任何反应，我想知道如何停止当前视频并在 url 更改时加载新视频？
reactjs - 在 react/redux 中获取最新信息
快速总结
我希望能够观看视频，并在视频中的给定时间戳创建一些注释。我目前正在使用react-player库来流式传输视频，以及使用 CRA 创建的 react/redux 项目。我发现在创建笔记时很难获得视频的最新时间戳。
细节
感兴趣的主要组件是两个兄弟组件。为简化起见，假设我们有一个App.js文件，其中包含VideoPlayer组件和AddNoteButton组件。
这是每个组件中正在发生的事情，非常简化
视频播放器
playing并且progress都保存为 redux 状态。
添加注释按钮
问题
当用户单击 AddNoteButton 中的按钮时，会发生以下情况：
- 它分派
setPlaying(false)，将playingredux 中的状态更改为 false - 使用播放器的当前时间戳显示模式
- 看到 的更新值后
playing，ReactPlayer停止运行
请注意，在 2、3 之间有一小段时间玩家没有停下来。因此，我们看到的是在创建函数时从 redux 状态检索到的注释中的时间戳showModal，这不一定是实际ReactPlayer停止的位置（它总是更早）理想情况下，我们希望在它player.current.getCurrentTime() 之后创建一个注释已经停止。有没有办法继续实现这一目标？任何帮助表示赞赏！
reactjs - HTML 视频在移动设备上失败
我在ReactPlayer中播放一个视频，它在标签中生成一个 HTML5 视频<video>。它不适用于移动设备（在 iPhone 8 iOS 13.5.1 上的 Safari、Chrome 和 Firefox 上测试）
我看到这个问题让我知道禁用autoplay和添加playsinline移动设备，但它仍然不适合我。我要提取的文件（如果相关）托管在 Google Cloud Storage 上
有谁知道如何让它在手机上播放？谢谢
编辑
如果有帮助，我的链接看起来像
"https://firebasestorage.googleapis.com/v0/b/my-mvp.appspot.com/o/videos%sub-folder?alt=media&token=my_token"
它拉入的视频是一个.webm文件