WebAssembly安装和使用

dennimer

已于 2024-07-29 16:12:32 修改

阅读量259

点赞数 2

文章标签： wasm

于 2024-07-29 16:10:10 首次发布

本文链接：https://blog.csdn.net/disiongo/article/details/140773468

版权

Mac环境安装，打开终端，安装emscripten

brew install emscripten

新建adder.c文件

int add(int a, int b) {
  return a + b;
}

打开终端编译adder.c文件

emcc --no-entry -O3 adder.c -o adder.wasm -s EXPORTED_FUNCTIONS="['_add']"

要求输出.wasm文件，表示不需要胶水代码
不加--no-entry会报错，说找不到main函数
EXPORTED_FUNCTIONS是导出的函数，导出后可以在js访问

这时候你会得到adder.wasm文件

electron使用之前的设置

通过设置webPreferences.experimentalFeatures = true 实现

const webveiw = new BrowserView({
  webPreferences: {
   experimentalFeatures: true
 }
})

vue里面调用

const fs = require('fs');
const wasmSource = new Uint8Array(fs.readFileSync("./src/adder.wasm"));
const wasmModule = new WebAssembly.Module(wasmSource);
const wasmInstance = new WebAssembly.Instance(wasmModule, {
    env: {
    }
});

const result = wasmInstance.exports.add(2, 40);
console.log("结果=",result);

参考资料：https://zhuanlan.zhihu.com/p/658311362