【QT】编译QtWebEngine（Build QtWebEngine from source）Win10+QT5.7.1_x64+VS2015

1、前言

关于QtWebEngine是干什么的，怎么用的，不在此赘述。

1.1、为什么要编译QtWebEngine

QT默认的QtWebEngine是不支持mp3、mp4解码的，也就是说，如果想要在QT浏览网页的时候支持在线播放音视频，就需要让QtWebEngine支持对音视频格式的解码。QtWebEngine底层使用了chromium库，可能是为了避免知识产权方面的问题，QT并没有直接提供对应的音视频解码的第三方库，只提供了第三方库的源码，所以就需要自己手动编译了。

2、编译环境

在编译的时候遇到了各种奇奇怪怪的问题，基本上都是编译环境引起。通过不断的尝试，摸索出来按照以下的环境进行配置成功率会比较高。

环境的配置比较全面并且麻烦，建议有条件的尽量按照文档中所描述的进行配置。

2.1、操作系统

首先就是操作系统，建议尽量通过虚拟机进行操作。

在虚拟机中安装一个纯净的操作系统, 本文档中使用的是Win10_x64。并且最好把操作系统的语言设置成英文，设置成英文会避免在编译时出现一些字符格式上的错误。

1）修改操作系统语言

 这个需要下载英语的语言包。

2）修改操作系统区域

将操作系统的区域设置为美国：

2.2、软件安装

我会把用到的软件放到网盘中，有需要的可以直接下载，网盘地址：

链接：https://pan.baidu.com/s/18WSYn6Jf02z9e-74A_-2EQ。

提取码：js87

2.2.1、VS2015

下载地址：下载 Visual Studio Tools - 免费安装 Windows、Mac、Linux。

安装VC++模块，SDK Windows 10 (10.0.xxxxx.x)

可以将VS2015的显示语言改成英文，否则在编译时，部分字符会显示成乱码，不确定是否会影响正常编译。

2.2.2、QT5.7.1

下载地址：Index of /new_archive/qt/5.7/5.7.1。

本文档中安装的是 qt-opensource-windows-x86-msvc2015_64-5.7.1

安装：

 一定要勾选Source和QtWebEngine!

一定要勾选Source和QtWebEngine!

一定要勾选Source和QtWebEngine!

安装完成之后，将qt安装目录下的bin路径添加至系统环境变量。

2.2.3、Python2.7

下载地址：Python Releases for Windows | Python.org。

一定要安装2.7.x的版本，不支持python3！

本文档中安装的是 python-2.7.18.amd64

安装完成之后，将安装目录添加至系统环境变量中。

2.2.4、Perl

下载地址：Strawberry Perl for Windows。

本文档中使用的是 strawberry-perl-5.32.1.1-64bit

安装完成之后，会自动将bin目录添加至系统环境变量。

2.2.5、Bison and Flex

下载地址：https://sourceforge.net/projects/winflexbison/。

将win-bison.exe重命名为bison.exe，将win-flex.exe重命名为flex.exe。

然后将bison.exe和flex.exe的路径添加至系统环境变量。

2.2.6、Gperf

下载地址：Gperf for Windows。

安装gperf-3.0.1.exe（这个需要双击进行安装），将bin目录添加至系统环境变量

（可以将bison.exe和flex.exe都放在这个文件夹下）。

2.2.7、Git

下载地址：Git - Downloads。

下载windows x64所用版本 Git-2.38.1-64-bit，安装完成将bin目录添加至系统环境变量。

所有软件安装完成之后的系统环境变量：

 ！所有的软件安装完成，配置环境变量之后，重启一下电脑！

3、编译流程

以管理员权限打开cmd，打开命令行工具。

1）找一下 vcvars64.bat 文件所在目录，先进入到该目录下：

cd C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\bin\amd64\

然后执行 vcvars64.bat：

 2）进入到qtwebengine原文件所在目录：

cd C:\Qt\Qt5.7.1\5.7\Src\qtwebengine

 3）qmake编译

qmake WEBENGINE_CONFIG+=use_proprietary_codecs qtwebengine.pro

（环境变量已配置）

或者

C:\Qt\Qt5.7.1\5.7\msvc2015_64\bin\qmake.exe WEBENGINE_CONFIG+=use_proprietary_codecs qtwebengine.pro

 4）nmake

nmake

（环境变量已配置）

或者

"C:\Program Files (x86)\Microsoft Visual Studio 14.0\VC\bin\amd64\nmake.exe"

如果所有的环境都配置正确的话，此时就正常编译了，会花费比较长的时间（本机大概花费了将近3个小时）

5）nmake install

这一步骤其实是将编译好库拷贝到QT的指定目录下。如果没必要的话，可以不用执行这一步，编译好的库都在C:\Qt\Qt5.7.1\5.7\Src\qtwebengine文件夹下了：

 install其实就是将编译好的库自动拷贝到QT的bin目录下。

4、编译时遇到的问题

编译总是遇到很多奇怪的问题。总是会不断的尝试各种方法以解决问题，最终虽然会解决，但是有时候也不明确问题的根本原因是什么，或者说不知道哪一种方法才是解决问题的直接方式。所以在此记录一下遇到的问题，以及可能的解决方法。

4.1、问题一：module machine type ‘x64’ conflicts with target machine type ‘x86’

 这个问题应该是在编译的时候没选对编译工具的版本，试了很多次，只要严格按照上面的编译流程执行的话就不会出现这个问题。

4.2、问题二：target architecture x64 is only support on x64 host

 这个问题困扰我很久，看问题描述应该也是编译版本没选对的原因，但是不管怎么尝试都还是会出现这个问题，后来重新装个纯净的win10操作系统并把相关软件安装之后，再执行编译，发现这个问题就没有了，后来猜测可能和我以前的系统中还装有vs2019+qt5.12.12有关，虽然期间我把vs2019和qt5.12.12都卸载了，但是应该还有有些残留的东西影响了编译。

这就是为啥建议一定要搞一个纯净的操作系统的原因。

4.3、问题三：ninja.exe is not recognized as an internal or external command operable program or batch file

 这个ninja.exe是在编译过程中生成的执行程序，但因为某个未知原因造成此次编译没有正常生成（怀疑是因为没有把vs2015设置成英文有关，虽然把vs2015设置成英文之后还是会报这个错误doge，也有可能是因为没有把nmake所在目录添加至环境变量）

我解决这个问题的方式是把前面编译时（虽然最终没有编译成功，但是ninja.exe生成成功了）生成的ninja.exe给拷贝到指定目录中：

 我会把这个ninja.exe同样放到网盘中，以防有遇到同样的问题的。

5、引用

5.1、官方教程

QT中关于编译QtWebEngine的教程并不多，偶然间找到了一个官方介绍编译QtWebEngine的说明，非常简单：

链接：Qt Tutorial - Build QtWebEngine from source。

5.2、其它引用

官方的文档总是很简单，但是实际操作中总是会出现很多问题，下面是参考的一下其它的文档：

1）visual studio - How to compile Qt webengine (5.11) on Windows with proprietary codecs - Stack Overflow。

2）解决QWebEngineView无法播放H5 Mp4问题_粗心的郑先生的博客-CSDN博客。

3）解决QtWebEngine无法播放H5中的mp4_二丶九的博客-CSDN博客。

4）Qt5 编译 Qt WebEngine_帅气转身而过的博客-CSDN博客。

5）VS2017+Qt5.12.7-重新编译webengine-MP4播放的问题 - 简书。