HarmonyOS鸿蒙Next 6.0中uniapp无法使用video播放flv视频流

HarmonyOS鸿蒙Next 6.0中uniapp无法使用video播放flv视频流 【问题描述】：在鸿蒙6.0系统下无法使用uniapp的video标签播放flv视频，但在5.0.5测试是可以播放的

【问题现象】：

点击播放按钮，没有反应，HBuilder日志如下：

18:37:46.795 ERR_FAILED

18:37:47.831 ERR_FAILED

18:38:10.202 Uncaught (in promise) NotSupportedError: The element has no supported sources.

【版本信息】：开发工具版本：hbuilderx4.85 手机系统版本：6.0.0.110 SP8 Api语言版本：API15

【复现代码】：

<template>
  <view class="container">
    <text class="title">鸿蒙 WebView 播放测试</text>

    <text class="tips">FLV 实时流</text>
    <video
      class="video"
      src="http://sf1-cdn-tos.huoshanstatic.com/obj/media-fe/xgplayer_doc_video/flv/xgplayer-demo-720p.flv"
      autoplay
      controls
    />
    <text class="tips">mp4实时流</text>
    <video
      class="video"
      src="https://media.w3.org/2010/05/sintel/trailer.mp4"
      autoplay
      controls
    />
  </view>
</template>

<script>
export default {
  data() {
    return {}
  }
}
</script>

<style>
.container {
  padding: 20px;
}
.title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
}
.tips {
  display: block;
  margin: 15px 0 5px;
  color: #555;
}
.video {
  width: 100%;
  height: 200px;
  background-color: #000;
}
</style>

【尝试解决方案】：无


更多关于HarmonyOS鸿蒙Next 6.0中uniapp无法使用video播放flv视频流的实战教程也可以访问 https://www.itying.com/category-93-b0.html

6 回复

根据复现代码在以下条件下MP4和FLV均正常播放，建议升级手机系统版本看看。

开发工具版本：HBuilderX 4.87

手机型号：Mate 60

手机系统版本：6.0.0.125 SP9

API语言版本：API12

更多关于HarmonyOS鸿蒙Next 6.0中uniapp无法使用video播放flv视频流的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


兄弟怎么解决的 我也遇到了一样的问题

hello，你的5.0 video可以横屏播放吗？我试了6.0不可以，demo也不可以，现在手里没有5.0的机器

没有试横屏播放，就简单的试了一下可以播放视频流的格式，

HarmonyOS Next 6.0中，UniApp暂不支持直接使用video组件播放FLV视频流。当前UniApp的video组件主要兼容HLS、MP4等标准格式。FLV格式需要依赖浏览器或原生播放器的特定解码能力，而鸿蒙Next的WebView及原生媒体框架对此支持有限。

根据您提供的信息，这是一个在HarmonyOS Next 6.0（API 15）上出现的、与5.0.5版本行为不一致的兼容性问题。核心原因在于HarmonyOS Next 6.0的Web内核（WebView）对HTML5 <video> 标签的媒体格式支持策略发生了变化。

问题分析：

  1. 错误日志解读：NotSupportedError: The element has no supported sources. 这个错误明确表示浏览器（或WebView）认为您提供的视频源（src）不是其支持的格式或协议。ERR_FAILED 进一步表明网络请求或资源加载失败。

  2. 版本差异：在HarmonyOS 5.0.5上可以播放，在6.0.0上失败，这直接指向了系统Web内核的更新。HarmonyOS Next 6.0 很可能升级了其Web内核（例如，从Chromium某个旧版本升级到了更新的版本），新版本通常会对媒体格式的支持有更严格的要求或默认配置。

  3. FLV格式支持：FLV（Flash Video）本身并非HTML5 <video> 标签原生广泛支持的容器格式。在桌面浏览器或旧版移动WebView中，播放FLV通常依赖于：

    • 浏览器/WebView内置的、非标准的格式支持。
    • 通过JavaScript库（如flv.js）进行实时转封装（将FLV流转换为Fragmented MP4或WebM流，通过Media Source Extensions API播放）。

    关键点在于：HarmonyOS Next 6.0的WebView很可能移除了对FLV格式的直接、内置支持，而更严格地遵循了标准的HTML5视频编解码器支持列表（如MP4/H.264， WebM/VP8等）。

解决方案：

由于这是底层平台WebView能力的变化，在UniApp的<video>组件层面无法直接解决。您需要在应用层采用以下替代方案：

  1. 使用flv.js库（推荐进行技术评估）：

    • 在您的UniApp页面中引入flv.js。
    • 不使用<video>的src属性，而是通过flv.js创建播放器实例，将FLV流解复用并通过MSE喂给一个标准的<video>标签。
    • 注意：此方案依赖于WebView对Media Source Extensions API的支持。您需要验证HarmonyOS Next 6.0的WebView是否完整支持MSE。如果支持，这是最接近原体验的方案。

  2. 转换视频流格式（服务端或网关方案）：

    • 这是最根本的解决方案。在服务器端或通过一个流媒体网关，将FLV流转码或转封装为标准HTML5广泛支持的格式，如HLS（.m3u8） 或MPEG-DASH。
    • 然后，将UniApp <video> 标签的src指向转换后的HLS或DASH流地址。现代WebView对HLS的支持通常很好。
    • 此方案涉及后端服务改动，但一劳永逸，兼容性最佳。

  3. 使用原生插件（如需深度集成）：

    • 如果上述Web方案均不理想，可以考虑开发UniApp的原生插件。
    • 在HarmonyOS侧，使用ArkUI的<Video>组件或更底层的媒体播放能力来播放FLV流，然后通过插件桥接给UniApp的JavaScript层调用。
    • 此方案工作量较大，但能获得最好的性能和格式控制能力。

总结与步骤建议：

首先，在您的HarmonyOS Next 6.0设备上，创建一个简单的、包含flv.js的测试HTML页面，验证MSE和flv.js方案是否可行。如果可行，则在UniApp项目中集成flv.js。

如果MSE支持不完整或性能不佳，则应优先推动服务端提供HLS或MP4等标准格式的流。检查您的MP4示例可以正常播放，也印证了标准格式在6.0上不受影响。

这个问题凸显了在跨平台开发中，对特定容器格式（如FLV）的依赖会带来平台升级时的兼容风险。迁移到更通用的流媒体协议是长期建议。

回到顶部