如何将C/C++代码转成webassembly(Linux环境）

最新推荐文章于 2023-11-06 10:30:11 发布

omage

最新推荐文章于 2023-11-06 10:30:11 发布

阅读量400

点赞数

本文链接：https://blog.csdn.net/omage/article/details/128189492

版权

nodejs 同时被 3 个专栏收录

19 篇文章 0 订阅

订阅专栏

Linux

18 篇文章 0 订阅

订阅专栏

C++

6 篇文章 0 订阅

订阅专栏

如何将C/C++代码转成webassembly_omage的博客-CSDN博客学习如何将C/C++代码转成webassemblyhttps://blog.csdn.net/omage/article/details/128163526?spm=1001.2014.3001.5501 上篇笔者分享了在window环境下如何将C/C++代码编译成webassembly，当中用了非常简单的C代码做了示例，然后在按照官网的一篇指南进行实践时,发现在window环境下编译有很多C代码的文件时不太方便，示例当中的命令也只能适用于linux环境。
Compiling an Existing C Module to WebAssembly - WebAssembly | MDNA core use-case for WebAssembly is to take the existing ecosystem of C libraries and allow developers to use them on the web.https://developer.mozilla.org/en-US/docs/WebAssembly/existing_C_to_wasm

为此，笔者干脆使用win10下的Linux子系统作为环境来实践下如何在linux环境编译。那如何在win10下安装Linux子系统的文章网上一大把，我就不赘述了。

注：笔者Linux子系统安装的是Debian

配置国内镜像

进入linux子系统

wsl

安装CA证书工具包，后面切换到国内镜像用的到

sudo apt-get update

sudo apt-get install ca-certificates

备份/etc/apt/sources.list文件

修改/etc/apt/sources.list文件，内容如下

deb https://mirrors.tencent.com/debian/ bullseye main non-free contrib
deb-src https://mirrors.tencent.com/debian/ bullseye main non-free contrib
deb https://mirrors.tencent.com/debian-security/ bullseye-security main
deb-src https://mirrors.tencent.com/debian-security/ bullseye-security main
deb https://mirrors.tencent.com/debian/ bullseye-updates main non-free contrib
deb-src https://mirrors.tencent.com/debian/ bullseye-updates main non-free contrib
deb https://mirrors.tencent.com/debian/ bullseye-backports main non-free contrib
deb-src https://mirrors.tencent.com/debian/ bullseye-backports main non-free contrib

安装Emscripten SDK (简称emsdk)

安装前先安装git和python3

sudo apt-get install git
sudo apt-get install python3

克隆emsdk

git clone https://gitee.com/openeuler-graphics/emsdk.git

安装

git checkout main
 
./emsdk install latest

./emsdk activate latest

source ./emsdk_env.sh

验证安装是否成功

emcc -v

如出现如下信息表示安装成功了

emcc (Emscripten gcc/clang-like replacement + linker emulating GNU ld) 3.1.22 (a9981ae2a7dc3c45f833d0b2202f739d87ac05c8)
clang version 16.0.0 (https://github.com/llvm/llvm-project 8491d01cc385d08b8b4f5dd097239ea0009ddc63)
Target: wasm32-unknown-emscripten
Thread model: posix
InstalledDir: /home/ouyang/data/emsdk/upstream/bin

编译一个已有的C代码库

(上面示例用的是libwebp代码)

git clone https://github.com/webmproject/libwebp

在libwebp目录下新建一个webp.c文件

内容如下

#include "emscripten.h"
#include "src/webp/encode.h"

EMSCRIPTEN_KEEPALIVE
int version() {
  return WebPGetEncoderVersion();
}

进入代码目录，运行

mkdir -p target

emcc -s EXPORTED_RUNTIME_METHODS='["cwrap"]' -I . webp.c ./src/{dec,dsp,demux,enc,mux,utils}/*.c -o target/mylib.js

注：这个 -I参数很奇怪，在emcc帮助和文档里查不到，从实践情况看应该是指设定代码编译的根目录，会影响你的代码文件里的引用路径。

上述命令编译成功后，会在target目录生成mylib.js、mylib.wasm文件。

然后我们在写一个简单的mylib.html文件，内容如下

<!doctype html>
<html lang="en-us">
<body>

<script src="./mylib.js"></script>
<script>
  Module.onRuntimeInitialized = async () => {
    const api = {
      version: Module.cwrap("version", "number", []),
    };
    console.log(api.version());
  };
</script>
</body>
</html>

将这三个文件部署到您的web服务上，笔者使用nodejs + koa的方式来做web服务，具体代码可参考如何将C/C++代码转成webassembly_omage的博客-CSDN博客

在浏览器输入地址： http://127.0.0.1:3000/mylib.html

omage

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
如何将C/C++代码转成webassembly(Linux环境）

上篇笔者分享了在window环境下如何将C/C++代码编译成webassembly，当中用了非常简单的C代码做了示例，然后在按照官网的一篇指南进行实践时,发现在window环境下编译有很多C代码的文件时不太方便，示例当中的命令也只能适用于linux环境。
复制链接

扫一扫

专栏目录