视频不适用于 Safari 和 iOS

Posted 2023-05-07

【中文标题】视频不适用于 Safari 和 iOS

【英文标题】：Video does not work on Safari and iOS

【发布时间】：2018-06-09 01:37:33

【问题描述】：

我面临的问题是，我的 html5 示例视频无法在 OSX 上的 Safari 11 中加载，但在 Chrome 和 Firefox 中运行良好。此外，该视频通常无法在 ios 上运行（Safari 和 Chrome 都不是）。

这是 HTML：

<video id="VideoElement"   muted controls src="/static/media/fitness/theraband1.mp4"  type="video/mp4"></video>

然而，我认为 html 不是问题，因为我什至不能 通过文件的直接链接访问 Safari 上的视频。万一你 想自己尝试，这里是链接：Placeholder video

该应用程序使用 Python 3 和 Django 2 进行编程。视频既不能通过 pythonanywhere 页面加载，也不能通过我本地的 Django 开发服务器加载。

我已经搜索过 Stack Overflow，但找不到解决方案（例如，问题 HTML5 Video tag not working in Safari , iPhone and iPad 主要关注 HTML 和视频格式，我认为这很好）。

【问题讨论】：

HTML5 Video tag not working in Safari , iPhone and iPad的可能重复

其他网站的其他嵌入视频是否可以在 Safari 上运行？如果您不确定，您可以从 Safari 浏览器访问此 demo HTML5 video page 并查看视频是否播放？

是的，其他嵌入式视频在 Safari 上运行良好，包括上面发布的演示视频。你能在 Safari 中打开我上面发布的占位符视频吗？

【参考方案1】：

我终于可以解决这个问题了（不过以一种非常不雅的方式）。我没有链接到 pythonanywhere 上的文件，而是使用 github 作为主机并且它可以工作：

不起作用：

<video id="VideoElement"   controls muted src="http://USER.pythonanywhere.com/static/video.mp4"  type="video/mp4"></video>

作品：

<video id="VideoElement"   controls muted src="https://github.com/USER/mysite/blob/master/static/video.mp4?raw=true"  type="video/mp4"></video>

我使用完全相同的文件，甚至是我拉到 pythonanywhere 的同一个 github 存储库。一个可能的答案可能是 pythonanywhere 不支持 HTTP 字节范围请求（？）......无论如何，它现在可以工作......

【讨论】：

只是为了再次确认这个可怕的错误。 Django 2 Python 3.6。我确实尝试了所有方法，但问题确实是 Django 不支持字节范围请求，因此它可以在 Chrome、Firefox 上运行，但不能在 Safari 或 iOS 上运行。使用 uWsgi 进行部署也没有完全发挥作用，对于核心开发人员在这方面的粗心程度，我感到无语。是否可以使用 nginx 或 Apache 提供静态服务并不重要。这必须工作！在 go lang 中迁移了整个项目，所有的工作都是开箱即用的。尝试修复 Django 需要 10 分钟与几小时。

我面临同样的问题。有什么解决方法吗？ @devnull

@codingdaddy 你成功修复了吗？我正在面对它:(

【参考方案2】：

Django 完全可以提供视频和其他媒体类型。 问题是 django 开发服务器并不意味着是一个成熟的 Web 服务器。您或许应该考虑使用网络服务器（例如 nginx 或 apache）为站点提供服务。您无需在其他地方托管静态内容。

示例设置：

Gunicorn 运行应用程序并侦听套接字，例如 /var/sockets/mysite.sock 配置 Web 服务器以服务于该站点。 参考：https://uwsgi-docs.readthedocs.io/en/latest/tutorials/Django_and_nginx.html

您还应该运行collectstatic 并配置网络服务器以从该位置加载静态内容。这不是强制性的，但建议您这样做，因为可以将 Web 服务器配置为为您缓存此静态内容以获得更好的性能。

希望这会有所帮助。

【讨论】：

OP提到这个问题存在于Pythonanywhere的生产和本地开发中。没有地方说开发服务器用于生产。这并不能解决最初的问题，因为您需要能够让 Django 开发服务器向 Safari 提供视频，以便能够测试在本地提供视频的应用程序（或者您必须经历在发展...）。