我將一些WASM代碼（從Go代碼編譯）集成到Angular中以使用一些函數(shù)。目前，這僅在一個地方完成，因此不會在整個應用程序中共享。我剛剛對WASM和Go使用了“標準”程序：let go = new Go();WebAssembly.instantiateStreaming(fetch('mywasm.wasm'), go.importObject).then((res) => { go.run(res.instance); myCoolWasmFunction();});但是，我想在應用程序的多個部分中執(zhí)行WASM，因此嘗試將其移動到服務中。我能夠使用RxJS主題并在該函數(shù)之后監(jiān)聽“執(zhí)行請求”，但我無法將任何內容返回到應用程序的其他部分。go.run(...)基本上，我正在尋找一種干凈且可用的方法來執(zhí)行 Angular 應用程序中由 wasm 公開的不同函數(shù)。我是否應該將 wasm 的東西放入 其中，并創(chuàng)建一個只調用這些“全局可用”函數(shù)的服務？如何啟用 angular 來識別它們，只需使用文件即可？index.html.d.ts
1 回答
皈依舞
TA貢獻1851條經(jīng)驗 獲得超3個贊
我在這個Github Repo的幫助下解決了這個問題。這就像在服務內部創(chuàng)建一個公共變量一樣簡單，并且在加載 WASM 時，將導出的 WASM 函數(shù)設置為該變量，以便可以從服務外部調用它們。對于下面的示例，我添加了一個小的typescript接口，以使其與類型安全一起使用：
因此，在 WASM 服務中可能如下所示：
private Suite: WasmSuite; // Here the exported functions are stored after wasm was initiated
/*
WasmSuite is defined like this:
type MyFunctionInterface = (input: string) => string;
interface WasmSuite {
myFunction: MyFunctionInterface;
}
*/
// This is just to let components know when WASM is ready
public ready: BehaviorSubject<boolean> = new BehaviorSubject(false);
constructor() {
// Init wasm, then update the ready state
this.init().then(_ => {
this.ready.next(true);
});
}
private async init() {
let go = new Go();
return WebAssembly.instantiateStreaming(
fetch('assets/main.wasm'),
go.importObject
).then((res) => {
go.run(res.instance);
// Set the Suite to an object containing the functions. The casting of the function is somewhat optional, but I think it's good practice.
this.Suite = {
myFunction: my_exported_func as MyFunctionInterface,
// "my_exported_func" is what I exported in Go via js.Global().Set("my_exported_func", js.FuncOf(myGoFunc))
};
});
}
public callMyFunction(input: string) {
// I like to publish methods to components instead of the suite object, so this is just an "interface" between callers and WASM.
return this.Suite.myFunction(input);
}
- 1 回答
- 0 關注
- 85 瀏覽
添加回答
舉報
0/150
提交
取消