在 iPad iOS 9.3.5 上(可能在其他版本上可重现),当我们的 React 应用程序作为渐进式 Web 应用程序 (PWA) 添加到设备主屏幕时,单击视频剪辑链接会在 iframe 中打开一个带有嵌入式 youtube 链接的 div , 在 PWA 中渲染视频剪辑。
这是iframe
代码:
<iframe width="300"
height="200"
src="https://www.youtube.com/embed/IprmiOa2zH8?autoplay=1&playsinline=1"
frameBorder="0"
allowFullScreen></iframe>
如果 iPad 上未安装 youtube 应用程序:
- 一切都按预期工作,单击查看视频链接时,可以看到一个 div,其中嵌入的 youtube 剪辑已准备好在 PWA 中播放和播放。
如果设备上安装了 youtube 应用程序(出现问题):
- 单击视频链接时,它会打开 youtube 应用程序,并在那里播放视频。我们如何才能始终保持 PWA 中的体验,而无需重定向到已安装的 youtube 应用程序?
注意:如果通过 url 而不是主屏幕 PWA 访问 web 应用程序,iframe 在 safari mobile 中的 web 应用程序 url 中打开并在那里播放,正如预期的那样。只有在设备安装了 youtube 应用程序的情况下从 PWA 打开视频时才会出现此问题。
知道如何解决这个问题吗?