更新记录

3.6.0(2024-04-10)

  • 修复视频文件名称存在 ‘空格’ 时,识别不到的问题。

3.5.0(2024-03-08)

  • 新增 FFmpeg 和 FFprobe 纯命令执行,可自定义处理视频,音频等文件。

3.4.0(2024-01-30)

  • 全部升级 FFmpeg 视频内核处理。
  • Android 端修复 MOV 视频格式无法在安卓端使用的问题。
  • 增加参数 crf 视频质量压缩比设置1-100值之间。
  • 增加参数 resolutionMax 用来限制最大的分辨率处理。
查看更多

平台兼容性

Android Android CPU类型 iOS
适用版本区间:4.4 - 14.0 armeabi-v7a:支持,arm64-v8a:支持,x86:未测试 适用版本区间:9 - 17

原生插件通用使用流程:

  1. 购买插件,选择该插件绑定的项目。
  2. 在HBuilderX里找到项目,在manifest的app原生插件配置中勾选模块,如需要填写参数则参考插件作者的文档添加。
  3. 根据插件作者的提供的文档开发代码,在代码中引用插件,调用插件功能。
  4. 打包自定义基座,选择插件,得到自定义基座,然后运行时选择自定义基座,进行log输出测试。
  5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项:使用HBuilderX2.7.14以下版本,如果同一插件且同一appid下购买并绑定了多个包名,提交云打包界面提示包名绑定不一致时,需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择


Android 和 IOS 视频裁剪、压缩插件

一、实例化插件

const  crop=uni.requireNativePlugin("Html5app-VideoCrop");

支持的视频格式:MP4、MOV、FLV

二、方法使用, 打开裁剪视频界面

crop.openCrop({
"url":"",
"resolution":"480p", //分辨率
"mode":"scale", //视频模式,fill=填充、scale=裁剪
"showModeButton":true,//是否显示裁剪/填充切换图标按钮
"quality":"sd", // 视频质量
"ratio":"9/16", //视频比例
"mintime":2000, //限制最小裁剪时间,单位t毫秒
"maxtime":0,//限制最大的裁剪时间,0代表不限制作,单位秒
"codecs":2,//编码方式
"gop":"5", // 关键帧
"fps":"25", // 帧率
"saveToAlbum":true // 是否保存到相册
},
ret=>{

});

三、传入参数说明

参数名称 说明 默认值 是否必填
url 视频地址, 平台绝对路径 例如:/storage/emulated/0/DCIM/Camera/2019-10-23-161242310-crop.mp4
resolution 分辨率: 360p,480p,540p,720p,1080p, 留空使用原始视频分辨率 原始视频分辨率
resolutionMax 分辨率: 360p,480p,540p,720p,1080p, 允许的最大分辨率,例如设置720p, 当视频超过720p时则按720p处理 当resolution为空时有效
mode 裁剪模式: scale=>裁剪 ,fill=>填充 scale
quality 视频质量: ld=>低清,sd=>标清,hd=>高清,ssd=>超清 sd
crf 视频质量压缩比: 1-100 值之间,如果设置了crf 压缩比quality 则无效,crf 值越大压缩文件越小,视频越模糊,反之则文件大,清晰,sd标清 对标 crf=23 0
ratio 视频比例: 1/1,3/4,4/3,9/16,16/9, 留空则使用原视频的比例
mintime 限制最小裁剪时间 , 单位是毫秒 2000
maxtime 限制最大裁剪时间 ,0代表不限制, 单位是秒 0
maxTimeTip 限制最大裁剪时间自定义提示文内 ,空代表默认提示内容,
codecs 编码方式:0=FFmpeg 编码, 1=>H264 编码兼容性高,2=>H265(HVC1) 高效文件更小,兼容性可能不支持一些设备上播放 1
gop 关键帧,建议GOP值为5-30 5
fps 帧率越高,图像越流畅,文件也越大。建议视频帧率:25-30。 25
saveToAlbum 是否把视频保存到相册,默认是:false,保存到相册 false
saveDirectory 自定义储存路径:例如:plus.io.convertLocalFileSystemURL("_doc");
showModeButton 是否显示裁剪/填充切换图标按钮 true

四、 返回的数据

1. 裁剪成功

{
    "code": 0, 
    "duration": "15", 
    "mp4": "/storage/emulated/0/DCIM/Camera/2019-10-23-161242310-crop.mp4",
    "image": "/storage/emulated/0/CropImage/image_cropimage.jpg?t=1571818382751",
    "msg": "裁剪视频成功",
    "size": 6113603
}
参数名称 说明
code 返回 0 代表成功
duration 视频总时长,单位/秒
size 视频文件大小,单位/字节
mp4 裁剪后的视频地址
image 裁剪后的视频的封面图片地址
msg 提示语

五、 无界面的压缩视频方法

  • 压缩视频推荐使用模式2 FFmpeg 压缩,可以把视频压缩的比较小。
crop.videoToZip({
url:"", //视频本地路径
resolution:"480p", //分辨率: 360p,480p,540p,720p,1080p, 留空使用原始视频分辨率
quality:"hd",  //视频质量: ld=>低清,sd=>标清,hd=>高清,ssd=>超清
ratio:"3/4", //视频比例: 1/1, 3/4, 9/16 ,resolution 为空时 ratio 无效, ratio,为空,则使用原视频的比例
codecs:2, //编码方式:0=FFmpeg 编码, 1=>H264 编码兼容性高,2=>H265(HVC1) 高效文件更小,兼容性可能不支持一些设备上播放
gop:5, //键帧,建议GOP值为5-30
fps:25, //帧率越高,图像越流畅,文件也越大。建议视频帧率:25-30。
saveToAlbum:true, // 是否保存到相册    startTime:0,
mode:"fill", //视频模式,裁剪scale, 填充fill
startTime:0, // 裁剪的开始时间,单位是:毫秒
endTime:10*1000, // 裁剪的结束时间,单位是:毫秒
cropRect:{offsetX:0,offsetY:0,width:200,height:200}   //矩形裁剪 ,当 mode 为裁剪scale 模式时有效, 可以裁剪视频任意部分区域。
},ret=>{

console.log(JSON.stringify(ret));

});     

按固定分辨率压缩视频。

  • resolution 参数填写分辨率,固定视频宽度:分辨率: 360p,480p,540p,720p,1080p 。
  • ratio 的值为空。
  • 例如:
{
resolution:"1080p",
ratio:""
}

自适应视频压缩

  • ratio 参数留空,则按视频原来的分辨率来压缩。
{
ratio:""
}
  • 视频处理中进度回调
{"msg":"视频处理进度百分比","progress":100,"code":1}
  • 视频处理成功
    {"code":0,
    "size":6113603,
    "msg":"视频处理完成",
    "image":"file:///var/mobile/Containers/Data/Application/338CB844-F75A-4C69-B243-A846D40787CE/tmp/vieoCropImage.jpg",
    "mp4":"file:///var/mobile/Containers/Data/Application/338CB844-F75A-4C69-B243-A846D40787CE/tmp/cutVideo.mp4",
    "duration":25
    }

六、 取消压缩

//取消处理
 crop.cancel();

七、 删除压缩视频,和 裁剪视频时,留下的视频文件,已免占用更多空间

//删除视频
 crop.deleteCache();

八、FFmpeg 和 FFprobe 纯命令执行方法

  • FFmpeg

    let vi="ffmpeg -i input.mp4 -ss 00:00:10 -vframes 1 output.jpg";  例如在第3秒处获取视频的图片,文件路径需要是平台绝对路径

    crop.FFmpeg({command:vi},
      log=>{

        console.log(log); 
     },
     result=>{

         console.log(result);  
    });  
  • FFprobe 可以提供有关视频文件的详细信息,包括视频流、音频流、编解码器信息、分辨率、帧率等。

    let vi="ffprobe -i input.mp4 -show_streams -show_format"; 
    //在这个命令中,-i input.mp4 用于指定要分析的视频文件,-show_streams 用于显示视频和音频流的信息,-show_format 用于显示文件格式信息。

    crop.FFprobe({command:vi},
    log=>{

      console.log(log);

    }); 

视频分辨率

视频分辨率指的是视频横向和纵向上的有效像素,理论上视频分辨率越高,图像越清晰。但分辨率越高也意味着文件越大,处理越耗时。移动端考虑到不同设备性能差异,建议设置分辨率720p及以下。常见的视频分辨率如下:

分辨率 1:1 3:4 9:16
360p 360x360 360x480 360x640
480p 480x480 480x640 480x848
540p 540x540 540x720 540x960
720p 720x720 720x960 720x1280
1080p 1080x1080 1080x1440 1080x1920

视频路径 转换

  • 如果是这种相对路径:_doc/download/01.mp4 ,需要转换成绝对路径,才能访问到文件。

    var filePath=plus.io.convertLocalFileSystemURL("_doc/download/01.mp4"); 

    转换后,例如:

    /storage/emulated/0/DCIM/Camera/2019-10-23-161242310-crop.mp4
    
  • 如果发现 /storage/ 开头的路径访问不了,可以在路径前面加上file:// ,例如:file:///storage/ ,这种。

安卓扫一扫 下载体验

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

无,没有采集任何用户数据。

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问