uni-app 报 uni.getVideoInfo is not a function

uni-app 报 uni.getVideoInfo is not a function

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

示例代码:

choosevideo() {
var self = this;
uni.chooseVideo({
count: 1,
sourceType: ['camera', 'album'],
success: function(res) {
// self.src = res.tempFilePath;
console.log(res.tempFilePath)
// console.log(res)
uni.getVideoInfo({
src: res.tempFilePath,
success(res) {
console.log(res)
}
})
}
});
},

操作步骤:

choosevideo() {
var self = this;
uni.chooseVideo({
count: 1,
sourceType: ['camera', 'album'],
success: function(res) {
// self.src = res.tempFilePath;
console.log(res.tempFilePath)
// console.log(res)
uni.getVideoInfo({
src: res.tempFilePath,
success(res) {
console.log(res)
}
})
}
});
},

预期结果:

输出视频的信息

实际结果:

uni.getVideoInfo 未定义

bug描述:

在uiapp制作h5的时候,报错


更多关于uni-app 报 uni.getVideoInfo is not a function的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 报 uni.getVideoInfo is not a function的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个兼容性问题。uni.getVideoInfo API 在H5平台不可用,该API仅支持微信小程序平台。

从你的代码和报错信息来看,你正在开发H5应用,但uni.getVideoInfo在H5环境下确实不存在,因此会出现"is not a function"的错误。

解决方案:

  1. 平台判断:在使用前检查当前平台
success: function(res) {
    console.log(res.tempFilePath)
    // 平台判断
    #ifdef MP-WEIXIN
    uni.getVideoInfo({
        src: res.tempFilePath,
        success(res) {
            console.log(res)
        }
    })
    #endif
    
    #ifdef H5
    // H5平台的处理方式
    console.log('H5平台不支持getVideoInfo')
    #endif
}
  1. 替代方案:在H5平台,你可以使用HTML5的Video元素来获取视频信息:
// H5平台
const video = document.createElement('video')
video.src = res.tempFilePath
video.onloadedmetadata = function() {
    console.log({
        duration: video.duration,
        width: video.videoWidth,
        height: video.videoHeight
    })
}
回到顶部