1

请参阅这个问题的上下文 和 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 页面等。

但是,当我在地址栏中的 url 添加分段 /FirstApp 并按 Enter 键时,路由器会显示消息“对不起,此地址没有任何内容”。而不是导航到由基本 url /FirstApp/ 表示的项目

这里有人知道如何实现我正在寻找的请求功能吗?

4

1 回答 1

1

这是演示如何执行此操作的 Repo 的摘要。

子文件夹 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 程序集 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);
}

包含完整解决方案的回购在这里

该网站如下所示:

绿地

于 2022-02-14T17:57:37.120 回答