Blazor:没有会话/ JWT令牌时重定向到“登录”页面吗?

时间:2019-03-28 15:16:37

标签: authentication redirect login blazor

我正在尝试在Blazor中创建一个新应用程序,并且正在进行身份验证。我正在使用存储在本地存储中的JWT令牌。当应用程序加载时,我需要检查存储中是否有令牌。如果是这样,请将其添加到所有API请求的HTTP标头中,否则,在页面加载之前将其重定向到登录页面。有多个页面需要检查,因此需要在单个位置进行以覆盖所有内容。应该在启动中完成吗?

搜索没有提供解决方案,因为我是Blazor的新手,所以找到合适的搜索词有点困难:)

4 个答案:

答案 0 :(得分:6)

创建一个组件并将其命名为RedirectToLogin.razor

@inject NavigationManager Navigation
@code {
    [CascadingParameter]
    private Task<AuthenticationState> AuthenticationStateTask { get; set; }

    protected override async Task OnInitializedAsync()
    {
        var authenticationState = await AuthenticationStateTask;

        if (authenticationState?.User?.Identity is null || !authenticationState.User.Identity.IsAuthenticated)
        {
            var returnUrl = Navigation.ToBaseRelativePath(Navigation.Uri);

            if (string.IsNullOrWhiteSpace(returnUrl))
                Navigation.NavigateTo("YourLoginPath", true);
            else
                Navigation.NavigateTo($"{YourLoginPath}?returnUrl={returnUrl}", true);
        }
    }
}

修改App.razor

<Found Context="routeData">
    <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(HostLayout)">
        <NotAuthorized>
            <RedirectToLogin></RedirectToLogin>
        </NotAuthorized>
    </AuthorizeRouteView>
</Found>

贷方转到:this article

答案 1 :(得分:2)

我所做的是编写自己的http服务来实现此目的。

它称为后端,并具有令牌的属性,如下所示:

    public string ApiToken
    {
        get
        {
            if (!string.IsNullOrEmpty(apitoken))
                return apitoken;

            apitoken = Browser.ReadStorage("apitoken");
            return apitoken;
        }

        set
        {
            Browser.WriteStorage("apitoken", value);
        }
    }

然后在该类中实现http类具有的所有方法,同时注入您的令牌。例如:

    public async Task<T> GetJsonAsync<T>(string uri)
    {
            this.InProgress = true;
            var result = await http.GetJsonAsync<ServerResult<T>>(uri, this.ApiToken);
            this.InProgress = false;

            if (!result.Success)
            {
                BlazorExtensions.Browser.Alert($"Error: {result.ErrorMessage}");
                return default(T);
            }

            return result.ValueObject;

    }

随处都可以使用后端服务来执行您的请求。方便使用您的api网址。

编辑 对于重定向部分:为简洁起见,我省略了这一部分,但这是完整的方法:

    public async Task<T> GetJsonAsync<T>(string uri)
    {
        try
        {
            this.InProgress = true;
            var result = await http.GetJsonAsync<ServerResult<T>>(uri, this.ApiToken);
            this.InProgress = false;

            if (!result.Success)
            {
                BlazorExtensions.Browser.Alert($"Error: {result.ErrorMessage}");
                return default(T);
            }

            return result.ValueObject;
        }
        catch (UnauthorizedAccessException)
        {
            this.InProgress = false;
            uriHelper.NavigateTo("/bzr/Logon");
            return default(T);
        }
        catch (Exception e)
        {
            BlazorExtensions.Browser.Alert($"Fout bij http fetch: {e.Message}");
            this.InProgress = false;
            return default(T);
        }
    }

uriHelper只需注入构造函数中即可:

    public IUriHelper uriHelper { get; private set; }

    public Backend(HttpClient httpInstance, IUriHelper uriHelper)
    {
        http = httpInstance;
        this.uriHelper = uriHelper;

猜猜这就是您需要的吗?

答案 2 :(得分:1)

Startup是什么意思? Startup类,对吧?

目前,Razor组件框架没有应用程序事件周期。请耐心等待...即将到来...同时,为了学习起见,请使用Components事件周期。 通常,您应该将JWT存储在本地存储中,包括有关用户的数据,用户是否已通过身份验证等数据,以及检索此数据以确定用户是否通过身份验证的服务。您可以在需要身份验证(或授权)时调用此服务。

顺便说一句,您并不是要通过说“ before the page loads”来停止...的过程。您只是说您不希望显示“新个人资料页面”,例如在在线约会网站中,如果用户未通过身份验证,对吗?好吧,在这种情况下,请从页面(组件)的OnInit或OnInitAsync方法中调用身份验证的本地服务(该服务从本地存储中检索数据)。

希望这对您有帮助...

答案 3 :(得分:0)

一种解决方案(目前,我认为还不是最好的方法吗?)是为所有组件页面创建基类,以继承并覆盖OnInit方法以进行检查和重定向。在加载应用程序后导航到链接时,此方法也适用。

在app.cshtml组件中进行检查仅适用于首次启动,而在应用程序中导航时则无效。这对其他检查很好,但不能保护路由。