HTML 以流为源的移动浏览器音频播放器
HTML audio player for mobile browsers with stream as source
我使用 VLC 媒体播放器播放一些内容（音频）。现在我将它流式传输到我的 PC 的端口 80 (http)。在不同的设备上，我打开 VLC 并可以使用 http://192.168.0.78/（源计算机的 IP）收听流。当我使用 VLC 应用程序收听内容时，它在 phone 上也能很好地播放。
现在，我尝试在网站上实现一个播放器，将流的 url 作为 src，客户端只需打开网站并播放流（这有很多逻辑优势).可以查看一个最小示例 here。流 运行 在桌面浏览器上正常，但在 运行 移动浏览器上不正常。不幸的是，没有错误消息或类似的东西可以指示问题的根源。
我尝试做的事情：
- 在 VLC 中使用不同的流编码（MP3、OGG 等）
- 使用像 Media element, jPlayer, audio.js, Muses Radio Player 这样的第三方 HTML 播放器等等。它们在桌面浏览器上都可以正常工作，但如果在移动浏览器上有问题的话，还是有问题的
- 它在桌面浏览器上运行时模拟移动浏览器思想 F12 -> 响应式设计模式（例如在 Firefox 中）
我在 https 上托管播放器 运行 的网站，而流的来源是 http。在这一点上，我不知道这可能导致的问题，但仍然在这里提到它。
有没有人体验过 HTML 移动设备上以流为源的播放器？
The site, in which I host the player runs on https, whereas the source of the stream is http. At this point I am not aware of a problem this could cause, but still mentioning it here.
这实际上就是问题所在。如果您打开浏览器的开发人员工具，您将看到与此相关的错误消息。安全上下文中的页面无法再从不安全的上下文中加载数据。
理想情况下，您需要通过 HTTPS 提供流。否则，您将不得不通过 HTTP 提供您的页面。
另请注意，您在桌面浏览器上确实遇到了同样的问题。
我使用 VLC 媒体播放器播放一些内容（音频）。现在我将它流式传输到我的 PC 的端口 80 (http)。在不同的设备上，我打开 VLC 并可以使用 http://192.168.0.78/（源计算机的 IP）收听流。当我使用 VLC 应用程序收听内容时，它在 phone 上也能很好地播放。
现在，我尝试在网站上实现一个播放器，将流的 url 作为 src，客户端只需打开网站并播放流（这有很多逻辑优势).可以查看一个最小示例 here。流 运行 在桌面浏览器上正常，但在 运行 移动浏览器上不正常。不幸的是，没有错误消息或类似的东西可以指示问题的根源。
我尝试做的事情：
- 在 VLC 中使用不同的流编码（MP3、OGG 等）
- 使用像 Media element, jPlayer, audio.js, Muses Radio Player 这样的第三方 HTML 播放器等等。它们在桌面浏览器上都可以正常工作，但如果在移动浏览器上有问题的话，还是有问题的
- 它在桌面浏览器上运行时模拟移动浏览器思想 F12 -> 响应式设计模式（例如在 Firefox 中）
我在 https 上托管播放器 运行 的网站，而流的来源是 http。在这一点上，我不知道这可能导致的问题，但仍然在这里提到它。
有没有人体验过 HTML 移动设备上以流为源的播放器？
The site, in which I host the player runs on https, whereas the source of the stream is http. At this point I am not aware of a problem this could cause, but still mentioning it here.
这实际上就是问题所在。如果您打开浏览器的开发人员工具，您将看到与此相关的错误消息。安全上下文中的页面无法再从不安全的上下文中加载数据。
理想情况下，您需要通过 HTTPS 提供流。否则，您将不得不通过 HTTP 提供您的页面。
另请注意，您在桌面浏览器上确实遇到了同样的问题。