Qt+openCV学习笔记(十六)Qt6.6.0rc+openCV4.8.1+emsdk3.1.37编译静态库

前言:

有段时间没来写文章了,趁编译库的空闲,再写一篇记录文档

WebAssembly的发展逐渐成熟,即便不了解相关技术,web前端也在不经意中使用了相关技术的库,本篇文档记录下如何编译WebAssembly版本的openCV,可以给使用C++开发web前端的小伙伴使用

一、安装需要的软件

1.安装git

这方便教程很多,不再重复。笔者使用的是git2.33

2.安装cmake

这个教程也很多,但笔者没有安装,使用的是Qt安装时,下载的

3.安装emsdk3.1.37

笔者偷懒了,也是搭建qt6.6.0时使用的版本,具体教程就不放置了

若不想自己安装的,可以下载笔者使用的版本

二、下载所需要的资源

1.下载opencv4.8.1源码

https://github.com/opencv/opencv/archive/refs/tags/4.8.1.zip

2.下载opencv_contrib-4.8.1源码

https://github.com/opencv/opencv_contrib/archive/refs/tags/4.8.1.zip

3.wechat_qrcode模型

detect.caffemodel

detect.prototxt

sr.caffemodel

sr.prototxt

4.xfeatures2d

boostdesc_bgm.i

boostdesc_bgm_bi.i

boostdesc_bgm_hd.i

boostdesc_binboost_064.i

boostdesc_binboost_128.i

boostdesc_binboost_256.i

boostdesc_lbgm.i

vgg_generated_48.i

vgg_generated_64.i

vgg_generated_80.i

vgg_generated_120.i

5.face_landmark_model.dat

三、设置环境变量

环境变量设置方法很多,可以直接设置系统的环境变量,笔者使用的是在一个cmd窗口中临时设置环境变量

执行如下命令

D:\emsdk\emsdk-3.1.37\emsdk_env.bat
set path=D:\Qt\Tools\mingw1120_64\bin;D:\Program Files\Git\usr\bin;%path%

若是查看环境变量执行如下

echo %path%

注:一定要记得,激活emsdk的环境变量 

四、生成make文件

在设置好环境变量的cmd中执行(请按实际目录执行)

D:\Qt\Tools\CMake_64\bin\cmake-gui.exe

打开如下窗口

Qt+openCV学习笔记(十六)Qt6.6.0rc+openCV4.8.1+emsdk3.1.37编译静态库_第1张图片

点击configure,弹出如下窗口

Qt+openCV学习笔记(十六)Qt6.6.0rc+openCV4.8.1+emsdk3.1.37编译静态库_第2张图片

 以上是笔者的设置,点击Next,

设置编译器,以下是笔者的设置

 Qt+openCV学习笔记(十六)Qt6.6.0rc+openCV4.8.1+emsdk3.1.37编译静态库_第3张图片

 之后就是等待完成,此过程时间有点长​

 configure完成后,修改配置选项

笔者提示,很多库并没有做web上的兼容,建议先编译opencv官方推荐的选项,然后再根据自己的需要,增加其他模块

以下是opencv官方使用的默认选项,可供有需要的小伙伴参考

'-DPYTHON_DEFAULT_EXECUTABLE=D:\\Program\\Python310\\python.exe', 
'-DENABLE_PIC=FALSE', 
'-DCMAKE_BUILD_TYPE=Release', 
"-DCMAKE_TOOLCHAIN_FILE='emsdk-3.1.37\\cmake\\Modules\\Platform\\Emscripten.cmake'", 
"-DCPU_BASELINE=''", 
'-DCMAKE_INSTALL_PREFIX=/usr/local', 
"-DCPU_DISPATCH=''", 
'-DCV_TRACE=OFF', 
'-DBUILD_SHARED_LIBS=OFF', 
'-DWITH_1394=OFF', 
'-DWITH_ADE=OFF', 
'-DWITH_VTK=OFF', 
'-DWITH_EIGEN=OFF', 
'-DWITH_FFMPEG=OFF', 
'-DWITH_GSTREAMER=OFF', 
'-DWITH_GTK=OFF', 
'-DWITH_GTK_2_X=OFF', 
'-DWITH_IPP=OFF', 
'-DWITH_JASPER=OFF', 
'-DWITH_JPEG=OFF', 
'-DWITH_WEBP=OFF', 
'-DWITH_OPENEXR=OFF', 
'-DWITH_OPENGL=OFF', 
'-DWITH_OPENVX=OFF', 
'-DWITH_OPENNI=OFF', 
'-DWITH_OPENNI2=OFF', 
'-DWITH_PNG=OFF', 
'-DWITH_TBB=OFF', 
'-DWITH_TIFF=OFF', 
'-DWITH_V4L=OFF', 
'-DWITH_OPENCL=OFF', 
'-DWITH_OPENCL_SVM=OFF', 
'-DWITH_OPENCLAMDFFT=OFF', 
'-DWITH_OPENCLAMDBLAS=OFF', 
'-DWITH_GPHOTO2=OFF', 
'-DWITH_LAPACK=OFF', 
'-DWITH_ITT=OFF', 
'-DWITH_QUIRC=ON', 
'-DBUILD_ZLIB=ON', 
'-DBUILD_opencv_apps=OFF', 
'-DBUILD_opencv_calib3d=ON', 
'-DBUILD_opencv_dnn=ON', 
'-DBUILD_opencv_features2d=ON', 
'-DBUILD_opencv_flann=ON', 
'-DBUILD_opencv_gapi=OFF', 
'-DBUILD_opencv_ml=OFF', 
'-DBUILD_opencv_photo=ON', 
'-DBUILD_opencv_imgcodecs=OFF', 
'-DBUILD_opencv_shape=OFF', 
'-DBUILD_opencv_videoio=OFF', 
'-DBUILD_opencv_videostab=OFF', 
'-DBUILD_opencv_highgui=OFF', 
'-DBUILD_opencv_superres=OFF', 
'-DBUILD_opencv_stitching=OFF', 
'-DBUILD_opencv_java=OFF', 
'-DBUILD_opencv_js=ON', 
'-DBUILD_opencv_python2=OFF', 
'-DBUILD_opencv_python3=OFF', 
'-DBUILD_EXAMPLES=ON', 
'-DBUILD_PACKAGE=OFF', 
'-DBUILD_TESTS=ON', 
'-DBUILD_PERF_TESTS=ON', 
'-DBUILD_DOCS=OFF', 
'-DWITH_PTHREADS_PF=OFF', 
'-DCV_ENABLE_INTRINSICS=OFF', 
'-DBUILD_WASM_INTRIN_TESTS=OFF', 
"-DCMAKE_C_FLAGS='-s WASM=1 -s SINGLE_FILE=1 -s USE_PTHREADS=0 '", 
"-DCMAKE_CXX_FLAGS='-s WASM=1 -s SINGLE_FILE=1 -s USE_PTHREADS=0 '"

内容比较多,需要大家细心设置,或第一次直接使用cmake命令 

以下是笔者感兴趣的选项

安装目录(生成的动态库的目录)

 是否生成付费相关的部分

 添加扩展库,注意要具体到modules目录

 

  再次点击configure后,可能还需要还需要设置多次,配置其他选项或下载文件

继续点击configure(可以多点几次,有时多点几次就可以下载成功),

若输出中仍然存在红色的文字,打开编译目录,找到日志文件CMakeDownloadLog.txt,查看缺少或下载失败的文件,下载完成后,按日志文件的提示,放入指定目录即可

笔者已下载缺少的文件,处理方法如下

1.把downloads和testdata两个目录,直接放在编译目录(笔者已整理好内部目录)

再次点击configure,此时应该不会有红色的文字了(若存在,请自主解决)

点击generate,生成makefile文件

四、编译源码

设置好环境变量的cmd中,切换目录到编译目录(请按实际目录执行)

执行mingw32-make -j6 开始编译

(6代表同时开6个线程编译,请读者按照自己机器的配置设置,以加快编译速度)

些过程耗时较长,笔者等待了半小时左右

编译完成后,执行mingw32-make install

过会就可以在安装目录找到生成的静态库了,笔者是在编译目录下的install

Qt+openCV学习笔记(十六)Qt6.6.0rc+openCV4.8.1+emsdk3.1.37编译静态库_第4张图片

因时间关系,笔者本次就不添加测试程序了

已生成的静态库(正式库+xfeatureds2d)​​​​​​​

后记:

1.WebAssembly开发,一般使用静态库,若有小伙伴执意使用动态库,可以自行编译下测试

2.部分库,即使编译成功,也不一定能使用,或出错,如imgcodecs模块,笔者使用cv::imwrite()时,会导致网页异常退出

3.笔者建议,不要使用world的库,发布程序时,库太大了,不实用

你可能感兴趣的:(Qt+WebAssembly,Qt+openCV,qt,opencv,学习)