2. 软件开发
    3. how to compile CEF project have h264 component for win

    how to compile CEF project have h264 component for win

    xiaoxiao2025-04-25  37

    前言

    CEF 是一个基于google chromium的简单的框架。 它主要是作为一个内嵌浏览器嵌入到客户端应用程序中。

    领导有洁癖，不敢用第三方编译好的CEF组件。 自己编译开源工程，好处挺多的，以后想改个啥，自己说了算。

    先查资料，看前面的同学咋玩的。 因为前面同学编译的CEF版本不一样，过程也不一样，说法不一。

    有的同学不光改配置，而且去动人家的cpp. 跟领导学了一下，被领导一顿训。 确实，这么大的第三方组件，没看懂人家实现时，怎么能去动人家的实现呢？动一行也不允许哦。

    最后，只改工程配置，确实可以编译出完全支持HTML5的CEF. 去拿YouTube做测试，音频和视频都支持的很好，美美的。

    开源大工程编译，是重度下载编译型的任务。 一般情况，只需要改对配置文件，然后就是下载和编译的漫长等待了。

    官方网站

    https://bitbucket.org/chromiumembedded/cef

    git库地址

    git clone https://bitbucket.org/chromiumembedded/cef.git

    官方编译说明

    https://bitbucket.org/chromiumembedded/cef/wiki/MasterBuildQuickStart.md

    编译环境

    Win10专业版(1809.177763.503) i7-7820X (3.6GHZ, 8核16线程 ) 64GB内存 256MB-SSD系统盘 1TB-SSD工作盘 Visual Studio 2017 -企业版 15.9.7，已经按照chromium68的编译环境，配置好了要安装的VS组件。

    修改区域设置

    这步是其他同学实验上说的，这步可能有用。

    添加系统环境变量

    这步照网上同学资料上设置的，官方文档并没有说明. CEF_ARCHIVE_FORMAT=tar.bz2 DEPOT_TOOLS_WIN_TOOLCHAIN=0 CEF_USE_GN=0 GYP_DEFINES=buildtype=Official GYP_MSVS_VERSION=2017 GYP_GENERATORS=ninja,msvs-ninja

    后来做通实验后，看到有些环境变量，其实有些是update.bat和create.bat中指定的环境变量。 这步如果不设置，不知道是不是对下边编译工程由影响，没有副作用就好。 感觉这步是没用的，因为官方指南没说。 但是，将这些环境变量拿掉，再从头做一遍，也划不来，一天就废了。没有副作用就好。 因为以前在本机做过chromium68的实验，将环境变量和编译CEF和chromium相关的摘出来，记录一下

    实验

    实验分3轮，能清晰的看到修改前后的效果比对。 按照这3轮的实验步骤，可以确定工程编译的方向性问题。 不至于出了编译问题，不好找问题的原因。

    第1轮： 直接git最新的Master版本，按照官方指南，下载编译成功。 通过开源工程的测试例子，看看原版的特性支持。 这一轮，主要熟悉一下官方编译指南。

    第2轮： 挑一个指定版本，按照官方指南，下载编译成功。 通过开源工程的测试例子，看看原版的特性支持。 这一轮，主要看看自己关心的这个版本，是否和当前的编译环境匹配不？

    第3轮： 对自己指定的版本，修改配置，加入新特性支持。下载编译成功。 通过开源工程的测试例子和第三方的检测页面，看看新特性是否已经加入。 然后就可以找有新特性支持的站点，进行测试，看看效果咋样。

    第1轮

    下载工程

    整个速度快, 稳定的梯子, 来下载官方工程。 CEF的下载内容有13GB, 如果下载到中间网断了，那真杯具。

    严格按照官方说明(https://bitbucket.org/chromiumembedded/cef/wiki/MasterBuildQuickStart.md)来操作 工程所在的盘选为1TB的SSD, 盘符为X盘。

    新建目录

    x:\code x:\code\automate x:\code\chromium_git 下载https://storage.googleapis.com/chrome-infra/depot_tools.zip 解压到到 x:\code\depot_tools目录 运行 update_depot_tools.bat cd x:\code\depot_tools update_depot_tools.bat 下载 https://bitbucket.org/chromiumembedded/cef/raw/master/tools/automate/automate-git.py ，放到 x:\code\automate\automate-git.py 制作脚本x:\code\chromium_git\update.bat

    set GN_DEFINES=use_jumbo_build=true set GN_ARGUMENTS=--ide=vs2017 --sln=cef --filters=//cef/* python ..\automate\automate-git.py --download-dir=x:\code\chromium_git --depot-tools-dir=x:\code\depot_tools --no-distrib --no-build Pause

    这一步只是下载，不编译。 参数 --no-build ：不编译 参数 --no-distrib ：不发布

    下载CEF工程 这步很悲剧，外网千万不能断. 如果网断了，就要从头开始下载13GB的代码… 在开始下载前, 先烧柱香，拜拜菩萨:) 我的运气还行, 只断了一次(在下载了6GB时). 看资料上的一个同学，一个星期都在下代码:P

    cd x:\code\chromium_git update.bat

    建立create.bat x:\code\chromium_git\chromium\src\cef\create.bat

    rem x:\code\chromium_git\chromium\src\cef\create.bat set GN_DEFINES=use_jumbo_build=true set GN_ARGUMENTS=--ide=vs2017 --sln=cef --filters=//cef/* call cef_create_projects.bat Pause

    运行create.bat

    Cd /d x:\code\chromium_git\chromium\src\cef\ create.bat

    运行create.bat, 打了patch, 产生了工程文件cef.sln x:\code\chromium_git\chromium\src\out\Debug_GN_x86\cef.sln x:\code\chromium_git\chromium\src\out\Debug_GN_x64\cef.sln x:\code\chromium_git\chromium\src\out\Release_GN_x86\cef.sln x:\code\chromium_git\chromium\src\out\Release_GN_x64\cef.sln 用ninja来编译工程

    cd /d x:\code\chromium_git\chromium\src

    可以编译以下4种工程配置

    ninja -C out\Debug_GN_x86 cef ninja -C out\Debug_GN_x64 cef ninja -C out\Release_GN_x86 cef ninja -C out\Release_GN_x64 cef

    如果要单独编译Release_x86版本，运行下列命令

    ninja -C out\Release_GN_x86 cef

    运行编译出的CEF应用的例子程序 官方整这步，主要是让开发者看下效果. 官方说 : 看，编译成功，可以运行，不要赖我哦。

    cd /d x:\code\chromium_git\chromium\src out\Release_GN_x86\cefclient.exe

    查看CEF的版本信息 在cefclient.exe中的url栏输入chrome://version, 可以看到CEF和chromium的版本。

    CEF75.0.0-master.1986+g35295d2+chromium-75.0.3749.0Chromium75.0.3749.0OSWindowsWebKit537.36 (@ffee52ed13b5cdf6e41886af8562a5be5294a7a5)JavaScript7.5.128FlashUser AgentMozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3749.0 Safari/537.36Command Line"out\Release_GN_x86\cefclient.exe" --lang=en-US --log-file="x:\code\chromium_git\chromium\src\out\Release_GN_x86\debug.log" --disable-gpu-shader-disk-cache --file-url-path-alias="/gen=x:\code\chromium_git\chromium\src\out\Release_GN_x86\gen"Module Pathx:\code\chromium_git\chromium\src\out\Release_GN_x86\libcef.dllCache Path

    查看CEF支持的HTML5特性 在测试程序cefclient.exe的url栏中输入http://html5test.com/ 或在测试程序cefclient.exe中选择菜单 可以看到官方版本不支持MP4, H264, H265 但是支持MP3 这时，可以备份这个版本了。防止后续实验不行了，还有个还原点可用。重新下载13GB的代码，纯粹在浪费时间。 因为工程中有不存在的文件夹快捷方式，最好用7zip分卷压缩保存成备份.7z. 用windows自带的拷贝文件夹的功能，拷贝到其他盘，会因为文件夹快捷不存在，拷贝过程挂住，只能取消。

    第2轮

    实验证明，如果要从这个官方master版本，update到自己中意的某个发布版本，是编译不过的。 如果不带update.bat 不带 --force-clean，只带 --branch=3729。 其实不太确定，因为第一次玩CEF编译，实验过程改来改去。实验都没过，除了参考资料的url, 其他中间记录自然也就没意义。 如果要靠谱的话，还是从头update到自己指定的版本。

    还是要从头下载编译一个指定版本。

    要从头来了，将第1轮实验的目录改名吧。 如果不改名，因为新的update.bat指定了–force-clean 参数，也会清掉第一轮的下载内容

    新建目录 x:\code x:\code\automate x:\code\chromium_git 制作脚本x:\code\chromium_git\update.bat 这个update.bat，指定了 --branch=3729， 下载3729版本。 参数 --force-clean，指定清除所有非本次下载的代码。

    之所以下载3729版本，是因为在第一轮实验完成后，用git可以看到离master版本最近的发布版本是3729. 而且本次实验，不需要回到winxp能用的版本，那就选择最新能用的发布版本。

    rem X:\code\chromium_git\update.bat set GN_DEFINES=use_jumbo_build=true set GN_ARGUMENTS=--ide=vs2017 --sln=cef --filters=//cef/* python ..\automate\automate-git.py --branch=3729 --download-dir=x:\code\chromium_git --depot-tools-dir=x:\code\depot_tools --no-distrib --no-build --force-clean pause

    建立create.bat update.bat运行完后，x:\code\chromium_git\chromium\src\cef\目录中应该是有cef_create_projects.bat和一堆其他文件，如果这个目录是空的，就要重新运行update.bat. create.bat内容和第1轮一样。

    x:\code\chromium_git\chromium\src\cef\create.bat rem x:\code\chromium_git\chromium\src\cef\create.bat set GN_DEFINES=use_jumbo_build=true set GN_ARGUMENTS=--ide=vs2017 --sln=cef --filters=//cef/* call cef_create_projects.bat pause

    运行编译出的CEF应用的例子程序 cd /d x:\code\chromium_git\chromium\src out\Release_GN_x86\cefclient.exe 在cefclient.exe中运行chrome://version, 可以看到CEF和chromium的版本。 可以看到编译出的版本确实为3729（74.0.3729.157） 可以看出CEF的发布版本是随着chromium走的。

    CEF 74.1.19+gb62bacf+chromium-74.0.3729.157 Chromium 74.0.3729.157 OS Windows WebKit 537.36 (@7b16107ab85c5364cdcd0b2dea2539a1f2dc327a) JavaScript 7.4.288.28 Flash User Agent Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.157 Safari/537.36 Command Line “out\Release_GN_x86\cefclient.exe” --lang=en-US --log-file=“x:\code\chromium_git\chromium\src\out\Release_GN_x86\debug.log” --disable-features=NetworkService --disable-gpu-shader-disk-cache --file-url-path-alias="/gen=x:\code\chromium_git\chromium\src\out\Release_GN_x86\gen" Module Path x:\code\chromium_git\chromium\src\out\Release_GN_x86\libcef.dll Cache Path 这个3729的官方版本同样是没有h264支持的。

    保存实验目录的备份 防止后续实验不行了，还有个还原点可用。重新下载13GB的代码，纯粹在浪费时间。 因为工程中有不存在的文件夹快捷方式，最好用7zip分卷压缩保存成备份.7z. 用windows自带的拷贝文件夹的功能，拷贝到其他盘，会因为文件夹快捷不存在，拷贝过程挂住，只能取消。

    第3轮

    这版实验，就可以在第2轮的基础上做了。

    可以用上第2轮的大部分内容，不会导致下载很多代码。 因为在update.bat和create.bat中加入了h264的配置，版本都一样。 只会更新很少的内容(大约几万个文件)，网络正常的话，有10分钟就完事。

    在update.bat和create.bat中set GN_DEFINES后增加如下属性 is_official_build=true proprietary_codecs=true ffmpeg_branding=Chrome

    新版update.bat的内容

    rem X:\code\chromium_git\update.bat rem set GN_DEFINES=use_jumbo_build=true set CEF_USE_GN=1 set GN_DEFINES=is_official_build=true proprietary_codecs=true ffmpeg_branding=Chrome set GN_ARGUMENTS=--ide=vs2017 --sln=cef --filters=//cef/* rem python ..\automate\automate-git.py --branch=3729 --download-dir=x:\code\chromium_git --depot-tools-dir=x:\code\depot_tools --no-distrib --no-build python ..\automate\automate-git.py --branch=3729 --download-dir=x:\code\chromium_git --depot-tools-dir=x:\code\depot_tools –no-update --no-distrib --no-build pause

    新版create.bat的内容。

    rem x:\code\chromium_git\chromium\src\cef\create.bat set CEF_USE_GN=1 set GN_DEFINES=is_win_fastlink=true proprietary_codecs=true ffmpeg_branding=Chrome set GN_ARGUMENTS=--ide=vs2017 --sln=cef --filters=//cef/* call cef_create_projects.bat Pause

    先运行新版的update.bat 再运行新版的create.bat 再编译工程。

    cd /d x:\code\chromium_git\chromium\src ninja -C out\Release_GN_x86 cef

    测试是否CEF已经加入了H264功能，是否支持HTML5.

    测试

    先用CEF带的例子看是否有H264

    cd /d x:\code\chromium_git\chromium\src out\Release_GN_x86\cefclient.exe

    可以看到已经加入H624支持了 再测试下，是否支持HTML5 测试url 为 https://www.youtube.com/html5/ 在out\Release_GN_x86\cefclient.exe的url输入栏中输入 https://www.youtube.com/html5/ 说明，加入H264的CEF也完全支持HTML5.

    总结

    看了那么多参考资料，觉得还是stackoverflow大法好

    参考资料

    https://blog.csdn.net/baidu_32237719/article/details/79509819

    https://stackoverflow.com/questions/43845493/how-to-enable-h264-support-in-cef3-latest-version/45404590#45404590

    https://magpcss.org/ceforum/viewtopic.php?f=6&t=13515&start=40#p35221

    https://blog.csdn.net/qpshen/article/details/78559710 https://blog.csdn.net/sum0000/article/details/86645083 https://blog.csdn.net/u012814856/article/details/76263059 https://blog.csdn.net/qpshen/article/details/78559710 https://blog.csdn.net/zhuhongshu/article/details/54193842 https://blog.csdn.net/baidu_32237719/article/details/79509819 https://blog.csdn.net/yufei_lgq/article/details/53838270

    最新回复(0)