uni-app nvue使用video直接黑屏 浏览器播放就可以

uni-app nvue使用video直接黑屏 浏览器播放就可以

开发环境 版本号 项目创建方式
Windows win10 CLI 
产品分类：uniapp/App

PC开发环境操作系统：Windows

手机系统：Android

手机系统版本号：Android 11

手机厂商：小米

手机机型：小米9P

页面类型：nvue

打包方式：云端

CLI版本号：4.15.13

示例代码：

```html
<video  
    v-if="refId != ''"  
    :ref="`video_${refId}`"  
    :id="`video_${refId}`"  
    :src="src"  
    :title="title"  
    :poster="poster"  
    :object-fit="objectfit"  
    :loop="true"  
    :enable-progress-gesture="false"  
    :page-gesture="false"  
    :initial-time="15"  
    :controls="true"  
    :show-fullscreen-btn="true"  
    :show-center-play-btn="true"  
    class="video"  
    :style="boxStyle"  
    @ended="endedPlay"  
    @timeupdate="timeupdate"  
><\/video>

操作步骤：

nvue 直接 video 加播放地址

预期结果：

播放界面

实际结果：

只有黑屏

bug描述：

video 播放器这几天不行了，都是黑屏

更多关于uni-app nvue使用video直接黑屏 浏览器播放就可以的实战教程也可以访问 https://www.itying.com/category-93-b0.html

9 回复

你给个能复现问题的 代码哟

更多关于uni-app nvue使用video直接黑屏 浏览器播放就可以的实战教程也可以访问 https://www.itying.com/category-93-b0.html


你好，是这样子得的 我使用真机调试， 视频播放 video ，nvue 页面只放一个视频标签，然后手机上只能显示黑屏，不能播放

我以前做界面的时候是可以的


求解决，让我能播放视频 现在视频标签 在真机调试中播放不了
这个在浏览器中的样子

新建的页面只用video 都不播放视频了

我也遇到这个问题了，官方例子的https视频地址可以播放，我的https视频就黑屏没声音

一般放不了可能是视频编码问题 试试 video 的 软/硬解 codec String hardware 解码器选择，hardware：硬解码（硬解码可以增加解码算力，提高视频清晰度。少部分老旧硬件可能存在兼容性问题）；software：ffmpeg 软解码；

这是一个典型的 nvue 视频播放兼容性问题。根据你的描述和代码，问题可能出在以下几个方面：

  1. 视频格式兼容性：nvue 中的 video 组件对视频格式要求比浏览器更严格。Android 平台主要支持 MP4、3GP 等格式，且对编码方式有特定要求。建议检查视频源的编码格式（H.264 通常兼容性最好）。

  2. 视频地址协议：确保视频地址使用 HTTPS 协议（Android 9+ 对 HTTP 限制更严格），且视频服务器支持 range 请求（流式播放必需）。

  3. nvue 页面特性：nvue 使用原生渲染，video 组件实际上是原生播放器。可以尝试以下调整：

    • 移除 initial-time 属性测试
    • 将 object-fit 改为固定值如 cover
    • 添加 autoplay 属性测试基础播放功能

  4. 权限问题：确认 manifest.json 中已配置网络和存储权限：

    "permissions": {
  "UniNView": {
    "description": "所需权限"
  }
}
回到顶部