uni-app APP端在项目的任何其他.vue页面执行过uploadFile .nvue页面的video组件就会加载失败

uni-app APP端在项目的任何其他.vue页面执行过uploadFile .nvue页面的video组件就会加载失败

开发环境 版本号 项目创建方式
Windows 20H2 HBuilderX

产品分类：
uniapp/App

PC开发环境操作系统：
Windows

HBuilderX类型：
正式

HBuilderX版本号：
4.45

手机系统：
Android

手机系统版本号：
Android 13

手机厂商：
华为

手机机型：
红米not14Pro+

页面类型：
nvue

vue版本：
vue2

打包方式：
云端

App下载地址或H5网址：
https://saojiuzhe.chuxingshi.top/saojiuzhe.apk

操作步骤：

nvue页面video组件播放视频，然后去其他页面执行下uploadFile这个api，再回到nvue页面。

预期结果：

nvue页面的video可以正常加载并播放

实际结果：

nvue页面的video会直接执行[@error](/user/error)回调，并且回调信息里没有任何可读的信息

bug描述：

uniapp的项目，我在nvue里面写了一个仿抖音的短视频，然后用的video组件写的。正常是可以正常加载视频的。然后我在app内的其他普通vue页面只要执行以下uni.uploadFile这个api。然后再回nvue页面重新加载视频，video组件就会无法正常加载视频，会直接执行[@error](/user/error)，并且[@error](/user/error)的返回信息中没有返回任何可用信息，以下是返回信息。并且我只要触发了这个bug，不管是重新进页面还是重启app都不能恢复，只能重新卸载安装才能恢复正常使用。

{
"type": "waiting",
"timeStamp": 1740038575867,
"target": {
"id": "id22",
"dataset": {},
"offsetLeft": 0,
"offsetTop": 0
},
"currentTarget": {
"id": "id22",
"dataset": {},
"offsetLeft": 0,
"offsetTop": 0
},
"detail": {},
"stopPropagation": "function() { [native code] }"
}

更多关于uni-app APP端在项目的任何其他.vue页面执行过uploadFile .nvue页面的video组件就会加载失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app APP端在项目的任何其他.vue页面执行过uploadFile .nvue页面的video组件就会加载失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个问题的核心在于uni.uploadFile API调用后影响了nvue页面video组件的正常加载。以下是分析及解决方案：

  1. 问题本质：
  • 这是uni-app在Android平台上的一个已知兼容性问题
  • uploadFile操作可能会干扰原生video组件的网络请求
  1. 临时解决方案：
  • 在调用uploadFile后，手动销毁并重新初始化video组件
  • 使用setTimeout延迟video的加载
  1. 代码示例（nvue页面）：
// 监听页面显示事件
onShow() {
  this.reloadVideo()
},

methods: {
  reloadVideo() {
    this.videoUrl = ''
    setTimeout(() => {
      this.videoUrl = '你的视频地址'
    }, 300)
  }
}
回到顶部