在单个解决方案中创建多个 WebAssembly 项目
Isa*_*aac 4 blazor blazor-webassembly hosted-blazor-webassembly
请参阅此问题的上下文 以及 MrC aka Shaun Curtis 的答案
这个问题是关于我过去试图解决但没有取得巨大成功的事情。您熟悉 我曾经下载并运行的这个示例吗？它不起作用。然后我意识到我必须将基本url添加到浏览器地址栏中的url中才能运行第一个项目，例如：https://localhost: 44302/FirstApp即Client项目。对于 SecondClient 来说应该是https://localhost: 44302/SecondApp。这正是MrC aka Shaun Curtis的示例应用程序的工作原理，尽管他添加了 Razor Pages 应用程序来提供用于重定向到四个项目的菜单。
我尝试将第一个托管的 WebAssemby 前端项目设置为默认项目，但没有取得多大成功；那是当我运行应用程序或在地址栏中键入时https://localhost: 44302.，如果我键入，https://localhost: 44302/FirstApp我会看到我添加到解决方案中的第一个独立 WebAssembly 项目。第二个项目、第三个项目等等，都是 WebAssembly 项目。我无法这样做：当我运行默认项目时，一切都很好...我可以在项目范围内导航，路由到 Counter 页面、FetchData 页面等。
但是，当我将段 /FirstApp 添加到地址栏中的 url 并按 Enter 键时，路由器会显示消息“抱歉，该地址没有任何内容”。而不是导航到基本 url /FirstApp/ 表示的项目
这里有人知道如何实现我正在寻找的所需功能吗？
这是存储库的摘要，演示了如何执行此操作。
子文件夹 Web Assembly 项目具有这样的项目文件。重要的一点是设置<StaticWebAssetBasePath>
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
<PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<Nullable>enable</Nullable>
<ImplicitUsings>enable</ImplicitUsings>
<StaticWebAssetBasePath>grey</StaticWebAssetBasePath>
</PropertyGroup>
....
像Index.html这样。base我们更新了、css 和框架 js 文件的路径。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>Blazr.Medusa.Grey</title>
<base href="/grey/" />
<link href="/grey/css/bootstrap/bootstrap.min.css" rel="stylesheet" />
<link href="/grey/css/app.css" rel="stylesheet" />
<link href="Blazr.Medusa.Grey.styles.css" rel="stylesheet" />
</head>
<body>
<div id="app">Loading...</div>
<div id="blazor-error-ui">
An unhandled error has occurred.
<a href="" class="reload">Reload</a>
<a class="dismiss"></a>
</div>
<script src="/grey/_framework/blazor.webassembly.js"></script>
</body>
</html>
Web 项目依赖于所有 Web Assembly 项目，因此它们都可以映射到wwwwroot.
Web 项目Program如下所示，每个 Web Assembly SPA 都有特定的端点。默认映射到基础 Web Assembly 项目 - Blazr.Medusa.WASM。
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddRazorPages();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
app.MapWhen(ctx => ctx.Request.Path.StartsWithSegments("/grey"), app1 =>
{
app1.UseBlazorFrameworkFiles("/grey");
app1.UseRouting();
app1.UseEndpoints(endpoints =>
{
endpoints.MapFallbackToFile("/grey/{*path:nonfile}", "/grey/index.html");
});
});
app.MapWhen(ctx => ctx.Request.Path.StartsWithSegments("/green"), app1 =>
{
app1.UseBlazorFrameworkFiles("/green");
app1.UseRouting();
app1.UseEndpoints(endpoints =>
{
endpoints.MapFallbackToFile("/green/{*path:nonfile}", "/green/index.html");
});
});
app.MapWhen(ctx => ctx.Request.Path.StartsWithSegments("/purple"), app1 =>
{
app1.UseBlazorFrameworkFiles("/purple");
app1.UseRouting();
app1.UseEndpoints(endpoints =>
{
endpoints.MapFallbackToFile("/purple/{*path:nonfile}", "/purple/index.html");
});
});
app.UseBlazorFrameworkFiles("");
app.UseRouting();
app.UseAuthorization();
app.MapRazorPages();
app.MapFallbackToFile("/index.html");
app.Run();
每个站点中的站点链接组件MainLayout提供 SPA 之间的导航
<div class="p-2 m-2 text-end">
<button class="btn btn-sm btn-primary me-1" @onclick='() => Go("")'>Go Base</button>
<button class="btn btn-sm btn-secondary me-1" @onclick='() => Go("grey")'>Go Grey</button>
<button class="btn btn-sm btn-success me-1" @onclick='() => Go("green")'>Go Green</button>
<button class="btn btn-sm btn-dark me-1" @onclick='() => Go("purple")'>Go Purple</button>
</div>
@code {
[Inject] private NavigationManager? NavManager { get; set; }
private void Go(string colour)
=> this.NavManager?.NavigateTo($"/{colour}", true);
}
包含完整解决方案的存储库位于此处
该网站如下所示：
| 归档时间： |
|
| 查看次数： |
2508 次 |
| 最近记录： |