C:\Users\Administrator目录下（即用户目录），Qt for webass构建套件编译的时候会去这里找编译器和各种编译需要的变量。
- 第六步：用记事本打开.emscripten，将 emsdk_path = os.path.dirname(os.environ.get('EM_CONFIG')).replace('\\', '/') 改成emsdk目录的绝对路径，比如 emsdk_path = 'H:/github/emsdk'，如果运行有问题则全部改成绝对路径。
- 第七步：打开QtCreator，配置Qt for WebAssembly构建套件，此时可以看到编译器中能够识别到所需的em编译器。
- 第八步：编译好以后如果弹出的是IE浏览器则复制地址拷贝到谷歌浏览器或者edge或者火狐浏览器运行，目前IE浏览器不支持WebAssembly。
- 第九步：默认采用的是静态编译，意味着可以脱离Qt环境运行，.wasm文件比较大因为静态集成了Qt的运行库。除了编译运行以外，还可以直接发布到有ngix或者apche环境的站点，直接可以运行。他就类似于PHP需要站点环境支持才能运行。

#### 2、小白懒人办法
常规的办法是万能的，包括选用其他版本的编译器等，但是大部分的初学者其实还没有git环境和python环境呢，怎破，此时非常想体验一把将qt程序编译到网页运行的想法超级强烈，马上安排懒人办法，注意此办法针对的是Qt5.15.2版本，本人特意将下载好的编译器整个文件夹中各种无关的文件全部删除。
emsdk地址：[https://pan.baidu.com/s/1ZxG-oyUKe286LPMPxOrO2A](https://pan.baidu.com/s/1ZxG-oyUKe286LPMPxOrO2A) 提取码：o05q 名称：emsdk.zip

- 第一步：将下载好的emsdk压缩包解压到目录，为了方便统一管理，我这里放在C:/Qt。
- 第二步：将emsdk目录下的.emscripten文件复制到C:\Users\Administrator目录下（即用户目录），Qt for webass构建套件编译的时候会去这里找编译器和各种编译需要的变量。
- 第三步：默认.emscripten文件中填写的是我这边安装的目录，你可以用记事本打开进行编辑改成你的目录。
- 第四步：重新打开QtCreator，切换到工具-选项-kits，重新设置Qt5.15.2 webassemly的编译器，下拉选择Emscripten Compiler。
- 第五步：新建个项目，拖几个控件放界面，编译大概一分钟左右，由于是静态编译时间会久一点，此时会生成五个文件，其中qtloader.js和qtlogo.svg每个项目是一样的，不同的文件是untitled.js、untitled.html、untitled.wasm。需要发布的话只需要将这5个文件拷贝到网站的WWW目录下就行。
- 第六步：编译完成以后会自动打开电脑默认浏览器比如IE浏览器，因为IE浏览器不支持wasm，所以你需要将地址复制拷贝到edge或者谷歌火狐等浏览器运行。
- 第七步：如果要支持中文则需要将中文字体文件添加到项目的资源文件一起编译。
- 其他说明：首次加载比较慢，后面由于有缓存的原因重新加载非常快，建议发布的时候可以放一个带宽很好的服务器。

### （三）、支持的模块
目前qt for webassembly套件不是支持所有的模块，比如常见的sql数据库模块就不支持，估计现在wasm还是定位在客户端的原因吧，network中的tcp udp也不支持，好消息是websocket client是支持的，也就意味着你可以写个websocket的server端负责监听和解析，web端直接websocket通信交互，比如传输视频数据，这不就是网页中显示实时视频了！亲测无误。

- Qt5Charts
- Qt5Core
- Qt5Gui
- Qt5Quick
- Qt5Svg
- Qt5WebSockets
- Qt5Widgets
- Qt5QuickControls2
- 其他部分模块

## 三、效果图