使用Emscripten可将C++编译为WebAssembly。1. 安装emsdk并配置环境;2. 编写含extern "C"导出函数的C++代码;3. 用emcc生成wasm和js文件;4. 在HTML中通过Module调用\_add等函数;5. 可选-s EXPORTED_FUNCTIONS限制导出函数。

要将C++代码编译为WebAssembly(Wasm),你需要使用Emscripten工具链。Emscripten是一个完整的LLVM+Clang+Binaryen编译器套件,能将C/C++代码转成可在浏览器中运行的WebAssembly模块。
1. 安装Emscripten
第一步是安装Emscripten SDK。官方推荐使用emsdk来管理Emscripten版本和环境配置。
- 克隆emsdk仓库:
git clone https://github.com/emscripten-core/emsdk.git
- 进入目录并安装最新版Emscripten:
cd emsdk
./emsdk install latest
./emsdk activate latest
立即学习“C++免费学习笔记(深入)”;
- 设置环境变量:
source ./emsdk_env.sh(Linux/macOS)
或运行emsdk_env.bat(Windows)
2. 编写C++代码
创建一个简单的C++文件,例如hello.cpp:
#include
extern "C" {
int add(int a, int b) {
return a + b;
}
}
int main() {
std::cout return 0;
}
注意:extern "C"用于防止C++名称修饰,使函数在JavaScript中更容易调用。
3. 编译为WebAssembly
使用emcc命令将C++代码编译为Wasm:
emcc hello.cpp -o hello.html
这会生成多个文件:
- hello.wasm:核心WebAssembly二进制文件
- hello.js:胶水代码,负责加载和实例化Wasm模块
- hello.html:可选的测试HTML页面
如果你想只生成wasm和js文件而不生成HTML:
emcc hello.cpp -o hello.js --no-entry
4. 在网页中调用C++函数
生成的JS文件会暴露一个Module对象。你可以在HTML中这样调用add函数:
注意:C++导出的函数前会加下划线_。
5. 导出特定函数(可选)
如果你只想导出某些函数,可以使用-s EXPORTED_FUNCTIONS参数:
emcc hello.cpp -o hello.js -s EXPORTED_FUNCTIONS='["_add", "_main"]'
还可以启用EXPORT_NAME来自定义模块名:
emcc hello.cpp -o hello.js -s EXPORTED_FUNCTIONS='["_add"]' -s EXPORT_NAME=MyModule
基本上就这些。配置好Emscripten后,编译和调用流程很直接。关键是理解JS与Wasm之间的交互方式,以及如何正确导出和调用函数。











