具有授权 header 和不记名令牌的 Blazor 导航

Question

我想通过 HealthChecksUI 创建 HealthChecks 门户，但授权访问受限。
我还使用 Blazor 来完成授权对话框的创建和接收访问令牌。

所以我配置 HealthChecksUI：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    //...
    app.UseEndpoints(endpointsBuilder =>
    {
        //...
        endpointsBuilder.MapHealthChecksUI(setup =>
        {
            setup.UIPath = "/portal";
            setup.ApiPath = "/portal/api";
            setup.WebhookPath = "/portal/webhooks";
            setup.ResourcesPath = "/portal/resources";
        }).RequireAuthorization(); // This means access to '/portal' route will be limited by authorization.
        //...
    }
    //...
}

我在 HTTP 授权 header 中使用 不记名令牌 在执行任何请求时进行授权。

接下来让我们检查授权工作：
来自 POSTMAN 的 GET 请求，带有有效的承载令牌到“/portal”路由成功传递。此外，如果我更改令牌，则会收到 401 Unauthorized 错误。所以看起来授权系统工作正常。

下一步将使用授权对话框执行令牌接收和重定向到门户页面。
下面的代码只是一个在 .razor 页面中使用的简单授权函数

private async Task SubmitAsync()
{
    var (authorizationSuccessful, accessToken) = await authorizationService.AuthorizeAsync(authorizationData).ConfigureAwait(false);

    if (authorizationSuccessful)
    {
        navigationManager.NavigateTo("/portal", true);
    }
    else
    {
        throw new UnauthorizedAccessException("Incorrect login or password");
    }
}

所以问题是：
当授权通过（authorizationSuccessful 是 true）和导航执行时，我进入了没有任何授权数据的“/portal”页面，所以我得到 401 Unauthorized 错误。

问题是：

如何通过 Authorization HTTP Header 中的 NavigateTo 方法传递接收到的不记名令牌 (accessToken) 以完成对“/portal”页面的授权访问？有可能吗？

Answer 1

不幸的是，不可能以这种方式完成此任务。

根据仅使用 JS ( and ) 做类似事情的尝试，它不能用普通 JS 完成。

所以我们这里只有几个选项：

通过 cookie 共享授权令牌

Cookie 是基于浏览器的共享存储，因此可以在导航后立即从此处检查访问令牌。

通过查询发送授权令牌

NavigateTo 方法可以与这样的查询参数一起使用：

navigationManager.NavigateTo($"/portal?token={accessToken}", true);

所以我们可以直接从查询参数中检查访问令牌。

具有授权 header 和不记名令牌的 Blazor 导航

Blazor navigation with authorization header and bearer token

c#

routing

navigation

authorization

blazor

问题是：

通过 cookie 共享授权令牌

通过查询发送授权令牌