可以将Blazor组件嵌入非.NET网站吗？

Question

我们希望为我们的客户开发一个客户端Blazor组件，以便在他们网站上嵌入页面。该网站是使用Drupal编写的，但我的问题实际上是关于将Blazor集成到任何非ASP.NET网站中。

这个https://www.nativoplus.studio/blog/blazor-introduction/上的图片似乎表明这应该是可能的，因为没有运行时部分依赖于.NET主机。

据我所知，客户端Blazor组件是使用WASM和JavaScript相结合的方式进行交互运行的，因此似乎应该可以将Blazor组件嵌入任何网站，而不仅仅是用.NET编写的网站？

（可能还需要Mono.wasm存在，我不确定它是否仅用于将我们的C#客户端应用程序编译为wasm，或者在运行应用程序时也需要它？）

理论上这是可能的，还是我忽略了一些明显的问题导致无法实现？

如果是这样，请问有人能否举例说明我们需要告诉客户网站公司添加哪些文件以及这些文件应该放在哪里？

- tomRedox

---

你需要mono.wasm，它是一个.NET主机（运行时）。 - H H

@HenkHolterman 哦，我明白了，所以在上面的示例图像中，YourApp.wasm 调用的所有 .net 库（System 等）都驻留在 mono.wasm 文件中？ - tomRedox

你的C#客户端应用程序没有编译为wasm，它需要mono运行时，而mono本身是编译为程序集的。据我所知，未来计划使你的Blazor应用程序能够编译为AOT程序集。 - enet

是的，在当前形式中没有 YourApp.wasm，只有 YourApp.dll。 - H H

Answer 1

是的，这是可能的。一旦使用dotnet publish发布客户端Blazor应用程序，生成的文件可以从任何静态文件托管中提供服务。例如，您可以从发布结果的文件夹中使用http-server .提供结果。

为了控制Blazor应用程序在最终HTML应用程序中可见的外观，您可以根据需要增强index.html。 <app>标记将被Blazor应用程序替换。

- codevision

---

有没有一种方法可以指定 Blazor 应用程序应该呈现在哪个 DOM 元素中？例如，相当于 app.AddComponent<App>("app");？ - tomRedox

如果您查看wwwroot中的index.html，这是一个示例，说明您如何在常规HTML页面中嵌入Blazor。如果您有<app>标签，它将被转换为Blazor应用程序。 - codevision

我认为在 Startup.cs 中的 app.AddComponent<App>("app") 行导致了该替换发生？ - tomRedox

是的，你说得对。但是这样想。您拥有具有为客户端 Blazor 标签而广为人知的静态 HTML 页面。一旦客户端 Blazor 初始化，它就会运行 Program.cs 并设置自身。就像任何 jQuery 插件实例化自己一样。在客户端 Blazor 中，Program.cs 查找使用 app.AddComponent 注册的标记，并将这些标记转换为 Blazor 组件。就是这样。我怀疑我们的想法是相同的，只是用不同的词语表达。 - codevision

当然！我太习惯于使用服务器端的Blazor，以至于忘记了对于客户端的Blazor，客户端应用程序项目中也有Startup.cs文件，并且该文件是运行在浏览器中的代码的一部分。我之前把它看作是在服务器上运行的代码（如果没有运行.NET则无法运行）。 - tomRedox

Answer 2

可以做到。来自此处：https://learn.microsoft.com/en-us/aspnet/core/blazor/hosting-models?view=aspnetcore-3.0：

“ASP.NET Core Web服务器不是必需的，可以实现无服务器部署场景（例如从CDN提供应用程序）。”

如果我在Visual Studio中将客户端Blazor项目发布到文件系统，则会获得index.html、css文件夹和包含js和wasm文件的_framework文件夹。

我想应该可以从任何地方提供它们，但还没有尝试过。

- robaker

---

是的，但是Blazor带来了一个路由器，我不确定导航会如何（如果）。 - H H