自助建站和wordpress,网站界面设计案例分析,技术支持 济源网站建设,包装设计案例分析前言#xff1a;
有段时间没来写文章了#xff0c;趁编译库的空闲#xff0c;再写一篇记录文档
WebAssembly的发展逐渐成熟#xff0c;即便不了解相关技术#xff0c;web前端也在不经意中使用了相关技术的库#xff0c;本篇文档记录下如何编译WebAssembly版本的openCV
有段时间没来写文章了趁编译库的空闲再写一篇记录文档
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 pathD:\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
打开如下窗口
点击configure弹出如下窗口
以上是笔者的设置点击Next
设置编译器以下是笔者的设置 之后就是等待完成此过程时间有点长 configure完成后修改配置选项
笔者提示很多库并没有做web上的兼容建议先编译opencv官方推荐的选项然后再根据自己的需要增加其他模块
以下是opencv官方使用的默认选项可供有需要的小伙伴参考
-DPYTHON_DEFAULT_EXECUTABLED:\\Program\\Python310\\python.exe,
-DENABLE_PICFALSE,
-DCMAKE_BUILD_TYPERelease,
-DCMAKE_TOOLCHAIN_FILEemsdk-3.1.37\\cmake\\Modules\\Platform\\Emscripten.cmake,
-DCPU_BASELINE,
-DCMAKE_INSTALL_PREFIX/usr/local,
-DCPU_DISPATCH,
-DCV_TRACEOFF,
-DBUILD_SHARED_LIBSOFF,
-DWITH_1394OFF,
-DWITH_ADEOFF,
-DWITH_VTKOFF,
-DWITH_EIGENOFF,
-DWITH_FFMPEGOFF,
-DWITH_GSTREAMEROFF,
-DWITH_GTKOFF,
-DWITH_GTK_2_XOFF,
-DWITH_IPPOFF,
-DWITH_JASPEROFF,
-DWITH_JPEGOFF,
-DWITH_WEBPOFF,
-DWITH_OPENEXROFF,
-DWITH_OPENGLOFF,
-DWITH_OPENVXOFF,
-DWITH_OPENNIOFF,
-DWITH_OPENNI2OFF,
-DWITH_PNGOFF,
-DWITH_TBBOFF,
-DWITH_TIFFOFF,
-DWITH_V4LOFF,
-DWITH_OPENCLOFF,
-DWITH_OPENCL_SVMOFF,
-DWITH_OPENCLAMDFFTOFF,
-DWITH_OPENCLAMDBLASOFF,
-DWITH_GPHOTO2OFF,
-DWITH_LAPACKOFF,
-DWITH_ITTOFF,
-DWITH_QUIRCON,
-DBUILD_ZLIBON,
-DBUILD_opencv_appsOFF,
-DBUILD_opencv_calib3dON,
-DBUILD_opencv_dnnON,
-DBUILD_opencv_features2dON,
-DBUILD_opencv_flannON,
-DBUILD_opencv_gapiOFF,
-DBUILD_opencv_mlOFF,
-DBUILD_opencv_photoON,
-DBUILD_opencv_imgcodecsOFF,
-DBUILD_opencv_shapeOFF,
-DBUILD_opencv_videoioOFF,
-DBUILD_opencv_videostabOFF,
-DBUILD_opencv_highguiOFF,
-DBUILD_opencv_superresOFF,
-DBUILD_opencv_stitchingOFF,
-DBUILD_opencv_javaOFF,
-DBUILD_opencv_jsON,
-DBUILD_opencv_python2OFF,
-DBUILD_opencv_python3OFF,
-DBUILD_EXAMPLESON,
-DBUILD_PACKAGEOFF,
-DBUILD_TESTSON,
-DBUILD_PERF_TESTSON,
-DBUILD_DOCSOFF,
-DWITH_PTHREADS_PFOFF,
-DCV_ENABLE_INTRINSICSOFF,
-DBUILD_WASM_INTRIN_TESTSOFF,
-DCMAKE_C_FLAGS-s WASM1 -s SINGLE_FILE1 -s USE_PTHREADS0 ,
-DCMAKE_CXX_FLAGS-s WASM1 -s SINGLE_FILE1 -s USE_PTHREADS0
内容比较多需要大家细心设置或第一次直接使用cmake命令
以下是笔者感兴趣的选项
安装目录生成的动态库的目录
是否生成付费相关的部分
添加扩展库注意要具体到modules目录
再次点击configure后可能还需要还需要设置多次配置其他选项或下载文件
继续点击configure可以多点几次有时多点几次就可以下载成功
若输出中仍然存在红色的文字打开编译目录找到日志文件CMakeDownloadLog.txt查看缺少或下载失败的文件下载完成后按日志文件的提示放入指定目录即可
笔者已下载缺少的文件处理方法如下
1.把downloads和testdata两个目录直接放在编译目录笔者已整理好内部目录
再次点击configure此时应该不会有红色的文字了若存在请自主解决
点击generate,生成makefile文件
四、编译源码
设置好环境变量的cmd中切换目录到编译目录(请按实际目录执行
执行mingw32-make -j6 开始编译
6代表同时开6个线程编译请读者按照自己机器的配置设置以加快编译速度
些过程耗时较长笔者等待了半小时左右
编译完成后执行mingw32-make install
过会就可以在安装目录找到生成的静态库了笔者是在编译目录下的install 因时间关系笔者本次就不添加测试程序了
已生成的静态库正式库xfeatureds2d)
后记
1.WebAssembly开发一般使用静态库若有小伙伴执意使用动态库可以自行编译下测试
2.部分库即使编译成功也不一定能使用或出错如imgcodecs模块笔者使用cv::imwrite()时会导致网页异常退出
3.笔者建议不要使用world的库发布程序时库太大了不实用
