如何使用 Mono WebAssembly 在浏览器中运行简单的 .NET 方法?

How do I use Mono WebAssembly to run a simple .NET method in browser?(如何使用 Mono WebAssembly 在浏览器中运行简单的 .NET 方法?)

问题描述

假设我在服务器上有一个 .NET dll 文件，它有一个简单的类:

Let's say I have a .NET dll file on the server, that has this simple class:

public static class C {
    public static int Add(int a, int b) => a + b;
}

我想使用 Mono 的 WebAssembly 支持在浏览器中调用 C.Add.
(假设我可以将 dll 下载到浏览器中，例如使用 fetch)

I want to invoke C.Add in browser using Mono's WebAssembly support.
(assume that I can download the dll into browser, e.g. with fetch)

问题:

1. Mono 需要哪些 .js/.wasm 文件，我从哪里获得这些文件?
2. 加载完所有内容后，如何真正从 JS 调用 C.Add?

我检查了 npm，但我没有在那里找到 Mono WASM.

I checked npm but I haven't found Mono WASM there.

注意:我已经有一个 dll，所以我对 WASM IL 解释器感兴趣，而不是 WASM AOT 构建.

Note: I already have a dll, so I'm interested in WASM IL interpreter and not WASM AOT build.

推荐答案

这是我找到的.

• 步骤如下所述:docs/getting-started/obtain-wasm-sdk.md
• 简短的总结:您必须下载并解压缩 从 Jenkins 构建

让我们调用解压后的文件夹WASM-SDK.

Let's call the unpacked folder WASM-SDK.

注意:如果按照 Mono 文档中的描述运行 packager.exe，则可以跳过以下步骤，但我想在此处描述手动方法以便更好地理解.

Note: you can skip following steps if you run packager.exe as described in Mono docs, but I want to describe the manual approach here for better understanding.

将以下 dll 放在您的站点根目录下(比如说在 managed 文件夹下):

Put the following dlls under your site root (lets say under managed folder):

• 包含class C的主dll，我们称之为app.dll
• BCL 依赖，在这种情况下你只需要:

• Main dll that contains class C, let's call it app.dll
• BCL dependencies, in this case you only need:

1. WASM-SDKwasm-bclwasmmscorlib.dll
2. WASM-SDKwasm-bclwasmFacades etstandard.dll
3. WASM-SDKframeworkWebAssembly.Bindings.dll

1. WASM-SDKwasm-bclwasmmscorlib.dll
2. WASM-SDKwasm-bclwasmFacades etstandard.dll
3. WASM-SDKframeworkWebAssembly.Bindings.dll

1. 从站点根目录下的 WASM-SDK elease 中复制 mono.js 和 mono.wasm
2. 注册你的Module并导入mono.js:

1. Copy mono.js and mono.wasm from WASM-SDK elease under your site root
2. Register your Module and import mono.js:

<script>
window.Module = {};
window.Module.onRuntimeInitialized = () => {
   const config = {
       vfsPrefix: "managed",
       deployPrefix: "managed",
       enableDebugging: 0
   };
   const assemblies = [
       'app.dll',
       'mscorlib.dll',
       'WebAssembly.Bindings.dll',
       'netstandard.dll'
   ];
   MONO.mono_load_runtime_and_bcl(
       config.vfsPrefix,
       config.deployPrefix,
       config.enableDebugging,
       assemblies,
       () => {
          Module.mono_bindings_init("[WebAssembly.Bindings]WebAssembly.Runtime");
          const add = Module.mono_bind_static_method("[app] C:Add");

          // ⬇️ This is what calls C.Add():
          console.log('C.Add:', add(1, 2));
       }
   )
};
<script>
<script async src="bW9uby5qcw=="></script>

1. 如果使用 IIS，请确保有一个 application/wasm 用于 .wasm 扩展的 mime 类型寄存器.

1. If using IIS, make sure that there is a application/wasm mime type register for the .wasm extension.

全部完成

现在，一旦您打开 HTML，您应该会在浏览器控制台中看到 C.Add: 3.

这篇关于如何使用 Mono WebAssembly 在浏览器中运行简单的 .NET 方法?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！