0

0

c++如何将项目编译为WebAssembly(Wasm)_c++ Emscripten入门教程【Web】

裘德小鎮的故事

裘德小鎮的故事

发布时间:2026-01-07 18:17:03

|

468人浏览过

|

来源于php中文网

原创

c++编译为webassembly需通过emscripten工具链:1.用emsdk安装配置环境;2.编写含extern "c"导出函数的c++代码;3.用emcc加exported_functions等选项编译;4.通过js胶水代码或webassembly api加载调用。

c++如何将项目编译为webassembly(wasm)_c++ emscripten入门教程【web】

用 C++ 编译成 WebAssembly,核心是借助 Emscripten 工具链 —— 它不是直接输出 .wasm 文件的“编译器”,而是一套完整的、基于 LLVM 的 Web 编译平台,能把 C/C++ 代码交叉编译为可在浏览器或 Node.js 中运行的 wasm + JS 胶水代码。

1. 安装并配置 Emscripten

推荐使用官方提供的 emsdk 管理工具,避免环境混乱:

  • 下载 emsdk:git clone https://github.com/emscripten-core/emsdk.git
  • 进入目录并安装最新稳定版:./emsdk install latest./emsdk activate latest
  • 激活环境:source ./emsdk_env.sh(Linux/macOS)或 emsdk_env.bat(Windows)
  • 验证:emcc --version 应显示 Emscripten 版本(如 3.1.49),同时 llvmnode 也需在 PATH 中

2. 编写一个可编译的 C++ 示例

注意:WebAssembly 本身不直接处理 DOM 或 I/O,需通过 JS 调用或 Emscripten 提供的封装。简单示例(hello.cpp):

#include <stdio.h>
extern "C" int add(int a, int b) {
    return a + b;
}
int main() {
    printf("Hello from WebAssembly!\n");
    return 0;
}

关键点:

立即学习C++免费学习笔记(深入)”;

  • 导出函数用 extern "C" 防止 C++ 名字修饰(便于 JS 调用)
  • 避免依赖未支持的系统库(如 <thread></thread><filesystem></filesystem>);可用的 STL 功能由 Emscripten 运行时提供
  • main() 会被自动调用(除非加 -s NO_FILESYSTEM=1 等精简选项)

3. 使用 emcc 编译为 WebAssembly

基础命令(生成 .html + .js + .wasm):

Booltool
Booltool

常用AI图片图像处理工具箱

下载
emcc hello.cpp -o hello.html

常用关键选项:

  • -O2-Oz:启用优化(-Oz 更小体积)
  • --no-entry:不自动生成 main 入口(适合只导出函数的库)
  • -s EXPORTED_FUNCTIONS='["_add"]':显式导出 C 函数(注意下划线前缀)
  • -s EXPORTED_RUNTIME_METHODS='["ccall","cwrap"]':启用 JS 端调用能力
  • -s STANDALONE_WASM=1:只生成纯 .wasm(无 JS 胶水),需自行加载执行

例如只生成 wasm + 显式导出 add:

emcc hello.cpp -O2 -s EXPORTED_FUNCTIONS='["_add"]' -s EXPORTED_RUNTIME_METHODS='["ccall"]' -s STANDALONE_WASM=1 -o hello.wasm

4. 在网页中加载和调用

若用 -o hello.html,直接打开即可运行;若用 STANDALONE_WASM=1,需手动加载:

<script>
fetch('hello.wasm').then(response => response.arrayBuffer())
  .then(bytes => WebAssembly.instantiate(bytes))
  .then(result => {
    const add = result.instance.exports._add;
    console.log(add(3, 5)); // 输出 8
  });
</script>

更推荐用 Emscripten 生成的 JS 胶水(如 hello.js),它已封装好模块初始化、内存管理、函数映射等:

<script src="hello.js"></script>
<script>
Module.onRuntimeInitialized = () => {
  console.log(Module.ccall('add', 'number', ['number', 'number'], [3, 5]));
};
</script>

基本上就这些。Emscripten 把底层细节封装得比较友好,真正难的是适配 C++ 代码本身 —— 比如替换系统调用、处理指针内存、避免阻塞主线程。起步建议从无依赖的小函数开始,再逐步集成。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
线程和进程的区别
线程和进程的区别

线程和进程的区别:线程是进程的一部分,用于实现并发和并行操作,而线程共享进程的资源,通信更方便快捷,切换开销较小。本专题为大家提供线程和进程区别相关的各种文章、以及下载和课程。

723

2023.08.10

线程和进程的区别
线程和进程的区别

线程和进程的区别:线程是进程的一部分,用于实现并发和并行操作,而线程共享进程的资源,通信更方便快捷,切换开销较小。本专题为大家提供线程和进程区别相关的各种文章、以及下载和课程。

723

2023.08.10

Java 并发编程高级实践
Java 并发编程高级实践

本专题深入讲解 Java 在高并发开发中的核心技术,涵盖线程模型、Thread 与 Runnable、Lock 与 synchronized、原子类、并发容器、线程池(Executor 框架)、阻塞队列、并发工具类(CountDownLatch、Semaphore)、以及高并发系统设计中的关键策略。通过实战案例帮助学习者全面掌握构建高性能并发应用的工程能力。

95

2025.12.01

js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

528

2023.06.20

js获取当前时间
js获取当前时间

JS全称JavaScript,是一种具有函数优先的轻量级,解释型或即时编译型的编程语言;它是一种属于网络的高级脚本语言,主要用于Web,常用来为网页添加各式各样的动态功能。js怎么获取当前时间呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

494

2023.07.28

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

658

2023.08.03

js是什么意思
js是什么意思

JS是JavaScript的缩写,它是一种广泛应用于网页开发的脚本语言。JavaScript是一种解释性的、基于对象和事件驱动的编程语言,通常用于为网页增加交互性和动态性。它可以在网页上实现复杂的功能和效果,如表单验证、页面元素操作、动画效果、数据交互等。

5858

2023.08.17

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

492

2023.09.01

Golang 测试体系与代码质量保障:工程级可靠性建设
Golang 测试体系与代码质量保障:工程级可靠性建设

Go语言测试体系与代码质量保障聚焦于构建工程级可靠性系统。本专题深入解析Go的测试工具链(如go test)、单元测试、集成测试及端到端测试实践,结合代码覆盖率分析、静态代码扫描(如go vet)和动态分析工具,建立全链路质量监控机制。通过自动化测试框架、持续集成(CI)流水线配置及代码审查规范,实现测试用例管理、缺陷追踪与质量门禁控制,确保代码健壮性与可维护性,为高可靠性工程系统提供质量保障。

24

2026.02.28

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
PostgreSQL 教程
PostgreSQL 教程

共48课时 | 9.9万人学习

Git 教程
Git 教程

共21课时 | 3.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号