mp4内容无法在提供给三星互联网浏览器的网页中播放 [英] mp4 content won't play in webpages served to Samsung Internet browser

问题描述

我有一个网站，可以在除三星互联网浏览器之外的每个浏览器中播放mp4媒体（通过< video> 标签和DASH）作为三星Galaxy手机和许多其他三星设备的默认设置。

I have a website which is able to play mp4 media (via the <video> tag and via DASH) in every browser except the Samsung Internet browser, which comes as default on Samsung Galaxy phones and probably a lot of other Samsung devices.

在台式机，iPad或者古老的HP TouchPad平板电脑上，它运行正常。使用同一个三星设备上的其他浏览器（例如Chrome），mp4媒体播放效果很好，因此它不是Android或设备硬件的限制。

On a desktop, iPad, or even an ancient HP TouchPad tablet, it works fine. Using other browsers on the same Samsung device (e.g. Chrome), the mp4 media plays fine, so it's not a limitation of Android or the device hardware.

我可以检测到三星浏览器使用JavaScript并禁用这些设备上的视频内容，但我真的不想这样做。当然有一种解决方法。

I can detect the Samsung browser with JavaScript and disable video content on those devices, but I'd really like to not have to do that. Surely there is a workaround.

如果你想在你的设备上试用它，这是一个快速测试。它试图在一个页面上播放3种略有不同类型的mp4媒体：

Here's a quick test, if you'd like to try it on your device. It tries to play 3 slightly different types of mp4 media on one page:

http://2pic.me/dashtest.html

在我的三星Galaxy S6上，它们都没有在三星互联网浏览器中播放。

On my Samsung Galaxy S6, none of them play in the Samsung Internet browser.

我尝试使用video.js，但这并未改变行为。

I tried using video.js, but that did not change the behavior.

推荐答案

我在Samsung Galaxy 7设备上遇到过三星浏览器（目前最新版本：v6.2.01.12）的相同问题。在我的情况下，我使用video.js，并播放HLS。
我发现的问题是自动播放无效。
我的解决方案是尝试以编程方式播放视频，如果检测到故障（承诺拒绝），则显示播放按钮，然后在用户点击中播放视频。这对我有用。
它类似于：

I experienced the same issue on Samsung Browser (current latest: v6.2.01.12), on a Samsung Galaxy 7 device. In my case I was using video.js, and playing HLS. The problem I found was that autoplay was not working. My solution was to try to play the video programatically and if failure detected (promise rejection), then display a PLAY button, and play the video in the user click. That worked for me. It would be something like:

const video = document.getElementById('my-video');
video.play()
  .catch((err) => {
    if (err.name === 'NotAllowedError') {
      // Display PLAY button with a click event listener and play the video there.
    }
  });

这是一个简化的代码，我会进行具体检查以查看my-video是否为实际< video> 元素，如果 video.play（）返回一个承诺和所有基本的安全检查（因为这是许多其他浏览器支持）。
但是，它显示了处理这种自动播放不工作场景的想法。

This is a simplified code, I do specific checks to see if my-video is an actual <video> element, and if video.play() returns a promise and all the basic safe checks (since this is supported in many other browsers). But, it shows the idea to handle this autoplay not working scenario.

我希望它有所帮助！

这篇关于mp4内容无法在提供给三星互联网浏览器的网页中播放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！