Windows下编译CEF3，添加MP3，MP4支持，修复触屏设备下长按崩溃

最近项目需要使用Chrome环境，Cef是一个C++的Chromium框架，CefSharp则是Cef的C#的封装。

Cef源码托管地址：https://bitbucket.org/chromiumembedded/cef/src

CefSharp源码托管地址：https://github.com/cefsharp/CefSharp

CefSharp最新支持的Cef版本是3.2987，对应的Chromium版本为57，这个可以直接用NuGet下载，但是由于专利原因默认不支持MP3、MP4播放，所以需要重新编译3.2987版本的Cef；最新版的Cef版本使用的是Chromium62，MP3专利2017年已经到期，按理说应该已经会默认包含在62中了，然而测试的并没有默认包含，也就是使用最新的Cef也要重新编译。

编译之前就知道是个大坑，编译的时候也终于体会到了

编译前你需要

1. 一个稳定的VPN
2. Windows 7或之后版本，必须64位
3. Visual Studio 2015（也可以是2013，我使用的是2015 Update 3）
4. Windows 10 SDK 10.0.14393（每个版本需要的SDK版本不同，请参考文档）
5. Python2.7（配置好环境变量）
6. 最少60G的硬盘空间（我编译完成32位Release版后源码+输出总计59G）
7. 时间以及耐心

源码获取

首先配置VPN，由于我用的SS，GIT和Python不知道为什么总是不走代理，最后使用了Proxifier来配置全局代理才成功。

下载Proxifier后免费试用1个月，编译几次足够了。

选择菜单Profile->Proxy Servers->Add，输入SS中配置的参数：

配置好后去Cef源码页面选择需要编译版本

在cef/tools/automate目录下载automate-git.py  （此文件可能有错误，后面我会附上改好的文件，要注意每个版本的不能通用，也就是比如3112版本下的automate-git.py不能用于2987版本，尤其是新版本的不能用于太老的版本，我前几次都是吃了这个亏）

将automate-git.py放在一个目录名短一点的目录中，路径中不能有中文 如：C:\cef，管理员权限运行CMD，进入automate-git.py目录中，运行

python automate-git.py –download-dir=c:\cef\source –branch=2987 –no-build –no-distrib –force-clean

–download-dir：将源码下载到哪里

–branch：要获取的版本

–no-build –no-distrib：获取完后不编译

–force-clean：清除上次获取的信息，如果一次没有成功，带上这个参数再执行，否则会出错

这个脚本会自动下载Cef、Chromium、depot_tools，如果下载过程出现问题，一般是网络问题，只要再次运行这个脚本就可以了；整个源码大概15G左右，如果VPN慢的话要等很长时间。

编译前修改添加支持

首先在 控制面板->区域->管理->更改系统区域设置 里将当前系统区域设置为英语(美国)后重启电脑

修改：

C:\cef\source\chromium\src\third_party\ffmpeg\chromium\scripts\build_ffmpeg.py

598行左右

1
2
3
4
5
6

# Google Chrome & ChromeOS specific configuration.
configure_flags['Chrome'].extend([
'--enable-decoder=aac,h264,mp3,mpeg4,amrnb,amrwb,flv',
'--enable-demuxer=aac,mp3,mov,avi,amr,flv',
'--enable-parser=aac,h264,mpegaudio,mpeg4video,h263',
])

修改：

C:\cef\source\chromium\src\third_party\ffmpeg\chromium\config\Chrome\win\ia32\config.h

C:\cef\source\chromium\src\third_party\ffmpeg\chromium\config\Chrome\win\x64\config.h

在#define FFMPEG_CONFIGURATION后面添加

-enable-decoder=’rv10,rv20,rv30,rv40,cook,h263,h263i,mpeg4,msmpeg4v1,msmpeg4v2,msmpeg4v3,amrnb,amrwb,ac3,flv’ -enable-demuxer=’rm,mpegvideo,avi,avisynth,h263,aac,amr,ac3,flv,mpegts,mpegtsraw’ -enable-parser=’mpegvideo,rv30,rv40,h263,mpeg4video,ac3′

2017年12月14日，修复触屏设备下长按选择崩溃问题：

这个问题在最新版本已经解决了，但是老版还存在这个问题，根据CEF官方的修复方法，修改：

cef\source\chromium\src\cef\libcef\browser\browser_main.cc

45行左右：

1
2
3
4

#include "ui/display/screen.h"
#include "ui/views/test/desktop_test_views_delegate.h"
#include "ui/views/widget/desktop_aura/desktop_screen.h"
#include "ui/wm/core/wm_state.h"//添加

135行左右：

1
2
3
4

new views::DesktopTestViewsDelegate;
wm_state_.reset(new wm::WMState);//添加
 
#if defined(OS_WIN)

cef\source\chromium\src\cef\libcef\browser\browser_main.h

33行左右：

1
2
3
4
5
6
7
8
9
10
11

class ExtensionsClient;
}
//以下为添加
#if defined(USE_AURA)
namespace wm {
class WMState;
}
#endif
 
class CefBrowserContextImpl;
class CefDevToolsDelegate;

75行左右：

1
2
3
4
5
6
7
8

std::unique_ptr<extensions::ExtensionsClient> extensions_client_;
std::unique_ptr<extensions::ExtensionsBrowserClient> extensions_browser_client_;
//以下为添加
#if defined(USE_AURA)
std::unique_ptr<wm::WMState> wm_state_;
#endif
 
DISALLOW_COPY_AND_ASSIGN(CefBrowserMainParts);

开始编译

进入刚刚下载的目录中，新建一个bat批处理

1
2
3
4
5
6
7
8
9
10
11
12
13
14

set WIN_CUSTOM_TOOLCHAIN=1
set CEF_VCVARS=none
set GYP_MSVS_OVERRIDE_PATH=C:\Program Files (x86)\Microsoft Visual Studio 14.0
set SDK_ROOT=C:\Program Files (x86)\Windows Kits\10
set LIB=C:\Program Files (x86)\Windows Kits\10\Lib\10.0.14393.0\um\x86;C:\Program Files (x86)\Windows Kits\10\Lib\10.0.14393.0\ucrt\x86;C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\lib;C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\atlmfc\lib;%LIB%
set INCLUDE=C:\Program Files (x86)\Windows Kits\10\Include\10.0.14393.0\um;C:\Program Files (x86)\Windows Kits\10\Include\10.0.14393.0\ucrt;C:\Program Files (x86)\Windows Kits\10\Include\10.0.14393.0\shared;C:\Program Files (x86)\Windows Kits\10\Include\10.0.14393.0\winrt;C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\include;C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\atlmfc\include;%INCLUDE%
set VS_CRT_ROOT=C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\crt\src\vcruntime
set GYP_DEFINES=proprietary_codecs=1 ffmpeg_branding=Chrome
 
set CEF_USE_GN=1
set GN_DEFINES=is_win_fastlink=true
set GN_DEFINES=proprietary_codecs=true ffmpeg_branding=Chrome
set GN_ARGUMENTS=--ide=vs2015 --sln=cef --filters=//cef/*
python ..\automate-git.py --no-depot-tools-update --no-debug-build --force-build --no-update --build-log-file --download-dir=c:\cef\source --depot-tools-dir=c:\cef\source\depot_tools

GYP_MSVS_OVERRIDE_PATH：VS2015目录；

SDK_ROOT：Win10SDK根目录；

LIB系统变量添加Win10SDK 14393 Lib目录以及VS目录中VC的Lib目录；

INCLUDE系统变量添加Win10SDK 14393的Include以及VS目录中VC的Include目录；

VS_CRT_ROOT：这个说明里是写添加VS runtime目录，但是我在网上搜了一大圈都没找到具体位置，只是找到了一个大概的目录名，并不确定对不对，但是编译没有问题；

GN_DEFINES：添加MP3、MP4支持；

–no-depot-tools-update：不更新depot_tools；

–no-debug-build：不编译debug版本，如果写–no-release-build则不编译release版本；

–force-build：强制编译；

–no-update：不更新代码；

–build-log-file：生成编译log，出错时很重要，完全编译32位Release大概会有470M左右的log；

–download-dir：之前配置的下载路径；

–depot-tools-dir：depot tools路径。

如果需要编译64位，则需要添加–x64-build参数，但是64位编译需要很高的内存。

在CMD中运行此批处理即可开始编译。

然后就是漫长的等待，我成功编译的一次大概6个小时，前几次出错都是3个小时以后才出的，太坑爹了；如果编译错误，可以在log文件中搜索error来判断错误位置，修改后再执行即可。

编译完成后输出目录在 chromium\src\out\Release_GN_x86复制里面需要用到的文件即可。

编译之前CefSharp自带的：

编译之后：

最后附上修改之后的automate-git