how to compile CEF project have h264 component for win

最新推荐文章于 2024-06-27 10:13:22 发布

LostSpeed

最新推荐文章于 2024-06-27 10:13:22 发布

阅读量536

点赞数

本文链接：https://blog.csdn.net/LostSpeed/article/details/90578831

版权

前言

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

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

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

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

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

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

编译环境

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.