uni-app uni.compressVideo视频压缩api在ios上压缩后的文件不可用不可播放

发布于 1周前 作者 caililin 来自 Uni-App

uni-app uni.compressVideo视频压缩api在ios上压缩后的文件不可用不可播放

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

产品分类：uniapp/App

PC开发环境操作系统：Windows

HBuilderX类型：正式

HBuilderX版本号：4.36

手机系统：iOS

手机系统版本号：iOS 16

手机厂商：苹果

手机机型：苹果13proMAX

页面类型：vue

vue版本：vue2

打包方式：云端

项目创建方式：HBuilderX

示例代码：

    that.$toast.show('正在压缩', 'loading')  
    uni.compressVideo({  
        src: res.tempFilePath,  
        quality: 'medium',  
        success(re) {  
            console.log(re)  
            uni.hideLoading()  
            uni.saveVideoToPhotosAlbum({  
                filePath: re.tempFilePath,  
                success(r) {  
                    console.log(r)  
                }  
            })  
            uni.saveFile({  
                tempFilePath: re.tempFilePath,  
                success: function(res2) {  
                    console.log(res2)  
                },  
                fail:function(err){  
                    console.log(err)  
                }  
            });  
        },  
        fail:function(err){  
            console.log(err)  
        }  
    })

操作步骤：

    that.$toast.show('正在压缩', 'loading')  
    uni.compressVideo({  
        src: res.tempFilePath,  
        quality: 'medium',  
        success(re) {  
            console.log(re)  
            uni.hideLoading()  
            uni.saveVideoToPhotosAlbum({  
                filePath: re.tempFilePath,  
                success(r) {  
                    console.log(r)  
                }  
            })  
            uni.saveFile({  
                tempFilePath: re.tempFilePath,  
                success: function(res2) {  
                    console.log(res2)  
                    var savedFilePath = res2.savedFilePath;  
                    let obj = {  
                        filePath: savedFilePath,  
                        fileSize: res.size  
                    }  
                    that.uploadAndSaveInfo(obj, function(res) {  
                        console.log(res)  
                        if (res && res.code == 1) {  
                            setTimeout(that.getFileListSql(), 100)  
                        }  
                    })  
                },  
                fail:function(err){  
                    console.log(err)  
                }  
            });  
        },  
        fail:function(err){  
            console.log(err)  
        }  
    })

预期结果：

压缩后的视频可读可播放

实际结果：

压缩后的视频不可用

bug描述：

使用uni.compressVideo进行视频压缩，success返回的tempFilePath不可用，不可播放
使用uni.saveFile将tempFilePath保存本地显示文件不可读

Harmonyos Next教程
2 回复

这边没有复现问题 提供一下示例项目以及复现问题的视频吧


在处理 uni-app 中的 uni.compressVideo API 在 iOS 上压缩视频后文件不可用或不可播放的问题时，我们可以考虑一些常见的错误原因和解决方案。由于 uni-app 框架本身是基于 Vue.js 和小程序的多端开发框架，其 API 行为在不同平台上可能有所不同。以下是一个示例代码，展示了如何正确使用 uni.compressVideo API，并包含一些可能帮助调试和解决问题的策略。

// 示例代码：使用 uni.compressVideo 压缩视频
export default {
  data() {
    return {
      src: '', // 视频源文件路径
      compressedSrc: '' // 压缩后视频文件路径
    };
  },
  methods: {
    compressVideo() {
      uni.compressVideo({
        src: this.src, // 输入的视频文件路径
        quality: 80, // 压缩质量，范围0~100
        outputSize: 1024 * 768, // 输出视频的目标分辨率宽度，高度会自动计算，保持宽高比
        success: (res) => {
          console.log('压缩成功', res);
          this.compressedSrc = res.tempFilePath; // 获取压缩后的视频文件路径
          // 尝试播放压缩后的视频以验证其可用性
          this.playCompressedVideo(this.compressedSrc);
        },
        fail: (err) => {
          console.error('压缩失败', err);
          // 处理压缩失败的情况，如提示用户或重试
        }
      });
    },
    playCompressedVideo(filePath) {
      uni.createInnerAudioContext().src = filePath; // 注意：此方法用于音频播放，视频播放需使用 video 组件
      // 对于视频播放，应使用 <video> 标签，并设置其 src 属性为 filePath
      // 例如：<video :src="compressedSrc" controls></video>
    },
    // 加载视频源文件（假设从文件选择器选择）
    chooseVideo() {
      uni.chooseVideo({
        sourceType: ['album', 'camera'],
        maxDuration: 60,
        camera: 'back',
        success: (res) => {
          this.src = res.tempFilePath;
          this.compressVideo();
        }
      });
    }
  }
};

注意事项：

  1. 检查文件路径：确保 src 路径正确，并且文件确实存在于该路径。
  2. 质量和分辨率：调整 quality 和 outputSize 参数，看是否能改善压缩后视频的可用性。
  3. 播放验证：使用 <video> 标签验证压缩后的视频是否能正常播放。
  4. 错误处理：在 fail 回调中打印详细的错误信息，有助于定位问题。
  5. 平台差异：注意 uni-app 在不同平台上的行为差异，特别是文件路径的处理和权限问题。

如果上述方法仍然无法解决问题，建议查看 uni-app 的官方文档或社区，看是否有其他开发者遇到并解决了类似的问题。

回到顶部