从 Blazor 项目中的不同程序集引用 JavaScript 文件

Question

我有一个 Razor 类库项目，我想在其中添加几个使用 JavaScript 互操作的自定义组件。当我调用 Window 对象中已存在的函数时，互操作工作正常。例如，这工作得很好：

JSRuntime.InvokeVoidAsync("alert", "Hello world");

但是，当我需要的函数不是 Window 对象原生的（即它们在不同的 interops.js 文件中声明）时，我需要<script>在页面 HTML 中添加引用该文件的标签。由于该文件驻留在不同的程序集中，该文件的路径是什么？

Answer 1

有两种方法可以解决这个问题。

使用引用的 RCL 中的静态资产

来自文档

RCL 的 wwwroot 文件夹中包含的文件在前缀 _content/{LIBRARY NAME}/ 下向 RCL 或使用应用程序公开。例如，名为 Razor.Class.Lib 的库会生成指向 _content/Razor.Class.Lib/ 的静态内容的路径。生成 NuGet 包且程序集名称与包 ID 不同时，请使用 {LIBRARY NAME} 的包 ID。

使用 Reflection 读取嵌入的资产内容

这种方法允许您直接执行 Javascript 代码，而无需在 HTML 中包含带有<script>.

首先创建辅助方法来检索嵌入的 javascript 文件内容：

public static string GetEmbeddedJSInteropCode(Assembly assembly, string path)
{
    using var stream = assembly.GetManifestResourceStream(path);
    using var reader = new StreamReader(stream);
    return reader.ReadToEnd();
}

然后你可以这样称呼它

await JSRuntime.InvokeVoidAsync("eval", GetEmbeddedJSInteropCode(typeof(SomeRCLType).Assembly, "SomeRCL.SomeFolder.Init.js"));
await JSRuntime.InvokeVoidAsync("someRCLFunction", "Foobar");