javascript Webm视频格式不适用于safari(ios)

368yc8dk 于 2023-09-29 发布在 Java

关注(0)|答案(1)|浏览(510)

以下问题仅存在于iOS设备和webm格式。当你在沙盒上打开例子时，不要说它有效。要测试它，请在真实的iOS设备上打开它（沙盒示例，请参阅下面的按钮）。

<video
      id="video-which-do-not-want-to-work"
      autoplay
      loop
      muted
      playsinline
      width="400"
      height="300"
      src="https://dl8.webmfiles.org/elephants-dream.webm"
    ></video>

以下是我尝试过的：
1.不带autoplay播放
1.我在堆栈上找到的所有示例都说应该添加playsinline和muted
1.尝试在video标记中使用source，类型为webm
1.尝试模仿按钮点击

const button = document.createElement('button')

 button.addEventListener('click', () => {
    document.getElementById('video-which-do-not-want-to-work').play()
 })

 button.click()

1.还尝试在html中添加真实的按钮并附加onclick事件函数，执行element.play()
1.已检查手机上的“低功耗模式”是否已关闭
设备的iOS版本：15.5
我能尝试什么来解决这个问题？
代码示例：

JavaScript

来源：https://stackoverflow.com/questions/72725245/webm-video-format-doesnt-work-on-safari-ios

1条答案

按热度按时间

pw9qyyiw1#

iOS不支持Webm格式（可能是在新版本“iPhone 14”之后支持，但之前不支持）。所以，我们可以做的是将Webm文件转换为Android和iOS支持的MP4等文件格式。尝试使用服务器端将webm视频转换为mp4，然后在客户端播放转换后的mp4视频。
使用fluent-ffmpeg或类似的库将webm转换为mp4。下面是node.js中的示例代码。

const ffmpegPath = require("@ffmpeg-installer/ffmpeg").path;
const ffmpeg = require("fluent-ffmpeg");
const fs = require("fs");

ffmpeg.setFfmpegPath(ffmpegPath);

// Input and output file paths
const inputFilePath =
  "input/file/path/or/url.mp4";
const outputFilePath = "output/file/path";

// Create a FFmpeg command
const command = ffmpeg();

// Set input file
command.input(inputFilePath);

// Set video codec to libx264 (MP4)
command.videoCodec("libx264");

// Set fps (30 makes the conversion fast)
command.outputFPS(30);

// Set output file
command.output(outputFilePath);

// Run the conversion
command
  .on("end", () => {
    console.log("Conversion finished.");
  })
  .on("error", (err, stdout, stderr) => {
    console.error("Error:", err);
    console.error("ffmpeg stdout:", stdout);
    console.error("ffmpeg stderr:", stderr);
  })
  .run();

赞(0）回复(0）举报 2023-09-29

我来回答

javascript Webm视频格式不适用于safari(ios)

1条答案

相关问题

热门标签

最新问答