首页 > 代码库 > [WASM] Call a JavaScript Function from WebAssembly
[WASM] Call a JavaScript Function from WebAssembly
Using WASM Fiddle, we show how to write a simple number logger function that calls a consoleLog function defined in JavaScript. We then download and run the same function in a local project.
WASM Fiddle: https://wasdk.github.io/WasmFiddle/?cvrmt
Demo Repo: https://github.com/guybedford/wasm-intro
Basiclly WASM is hard to debug, we still need Javascript to help, the way to do debugging is we pass Javascript Console.log function into WASM though "imports".
Defined a C code:
#include <math.h>void consoleLog (float num);float getSqrt (float num) { consoleLog(num); return sqrt(num);}
Defined a function called "consoleLog".
After build to wasm:
(module (type $FUNCSIG$vf (func (param f32))) (type $FUNCSIG$ff (func (param f32) (result f32))) (import "env" "consoleLog" (func $consoleLog (param f32))) (table 0 anyfunc) (memory $0 1) (export "memory" (memory $0)) (export "getSqrt" (func $getSqrt)) (func $getSqrt (param $0 f32) (result f32) (call $consoleLog (get_local $0) ) (f32.sqrt (get_local $0) ) ))
It‘s importing consoleLog from a module called environment.
This is just a default module namespace name for the externals of a C code compilation process.
Now on JS side, we need to pass the console.log function from "imports" param:
function fetchAndInstantiateWasm(url, imports) { return fetch(url) .then((res) => { if (res.ok) { return res.arrayBuffer(); } throw new Error(‘Unable to fetch WASM‘) }) .then((bytes) => { return WebAssembly.compile(bytes); }) .then(module => { return WebAssembly.instantiate(module, imports || {}); }) .then(instance => instance.exports); } fetchAndInstantiateWasm(‘./program.wasm‘, { env: { consoleLog: (num) => console.log(num) } }) .then(m => { window.getSqrt = m.getSqrt; });
[WASM] Call a JavaScript Function from WebAssembly
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。