如何在没有Microsoft身份的情况下进行JWT身份验证blazor服务器? [英] how to jwt authentication blazor server without microsoft identity?

问题描述

我正在使用blazor服务器(不使用webapi，httpclient和...) 而且我想使用jwt进行身份验证

i'm using blazor server ( not use webapi, httpclient and ...) and i want to use jwt for authentication

1. 我应该在哪里存储令牌? localStorage还是cookie?
2. 如何将jwt发送到服务器的所有请求?

3. 我必须使用AuthenticationStateProvider吗?

1. Where should I store token? localStorage or cookie?
2. how to send jwt to server all of the request?

3. I had to use AuthenticationStateProvider?

我使用了httpContext，但除非将其放入cshtml中，否则我得到了一个错误 我也在AuthenticationStateProvider内部使用了localstorage文件，但是 只是有一个错误

I used httpContext but I got an error unless it fit into the cshtml file I also used localstorage inside AuthenticationStateProvider but just got an error

还，哪个更好? blazor服务器(一个项目)或 带有webapi的blazor服务器?(两个项目，blazor服务器和api)

also , which one is better? blazor server (one project) or blazor server with webapi?(two project, blazor server and api)

推荐答案

哪个更好? blazor服务器(一个项目)或带有webapi的blazor服务器?(两个项目，blazor服务器和api)

which one is better? blazor server (one project) or blazor server with webapi?(two project, blazor server and api)

没有这样的东西更好.这完全取决于您的要求.您是否需要或希望使用Wep Api?如果您不打算使用Web Api，请不要使用Jwt身份验证.要访问A Web Api端点时，将使用Jwt访问令牌.您可以改用Identity UI系统来验证您的用户.您可能很熟悉，并且可以在一段时间内完成设置和运行.

There is no such thing better. It all depends on your requirements. Do you need or do you wish to use a Wep Api ? If you're not going to use a Web Api, don't use a Jwt authentication. A Jwt access token is used when you want to access A Web Api endpoints. You can use the Identity UI system instead, to authenticate your users. Which you're probably familiar with, and can be set up and run in a little while.

我应该在哪里存储令牌? localStorage还是cookie?

Where should I store token? localStorage or cookie?

You may use the JavaScript local storage to store and retrieve Jwt tokens.

如何将jwt发送到服务器的所有请求

how to send jwt to server all of the request

您的意思是服务器Wep Api端点，对吗?

You mean to a server Wep Api endpoint, right ?

1. 从本地存储中检索Jwt令牌(只要您的应用具有 已经对用户进行身份验证，并将令牌存储在本地存储中) 例如:

1. Retrieve the Jwt token from your local storage ( provided that your app has already authenticated the user, and stored the token in the local storage) as for instance:

@code {

 List<Hotel> hotels;

 protected override async Task OnInitializedAsync()
 {
    // Read the token from the store
    var token = await TokenProvider.GetTokenAsync();

    var httpClient = clientFactory.CreateClient();
    httpClient.BaseAddress = new Uri("https://localhost:44381/");

    // Perform HTTP call to your Web Api end point Hotels
    // Deserialized the response into a list of hotel objects.
    hotels = await httpClient.GetJsonAsync<List<Hotel>>("api/hotels",
                    new AuthenticationHeaderValue("Bearer", token));

 }
}

请注意如何将Jwt令牌传递给Wep Api端点.

Note how I pass the Jwt token to the Wep Api endpoint.

我必须使用AuthenticationStateProvider吗?

I had to use AuthenticationStateProvider?

您问是否使用AuthenticationStateProvider吗?

Do you ask whether to use the AuthenticationStateProvider ?

通常，您不使用AuthenticationStateProvider.它的子类ServerAuthenticationStateProvider被自动添加到DI容器中，因此您可以将其注入到组件中并使用它.在客户端Blazor中，您必须创建一个自定义AuthenticationStateProvider.

Ordinarily, you don't use the AuthenticationStateProvider. Its subclass, ServerAuthenticationStateProvider, is automatically added to the DI container, so you can inject it to your components and use it. In Client side Blazor you'll have to create a custom AuthenticationStateProvider.

但是，您必须使用AuthorizeRouteView和AuthorizeView之类的组件，它们需要AuthenticationState对象才能起作用，并且由AuthenticationStateProvider提供.

However, you'll have to use components such as AuthorizeRouteView and AuthorizeView, which need the AuthenticationState object to function, and it is provided by the AuthenticationStateProvider.

在此处查看，在我的答案中我如何使用它们...

See here, in my answer, how I use them...

更新:

我的意思是，哪个更好?带有signal的blazor服务器或带有webapi的blazor?

I mean, which is better? blazor server with signalr or blazor with webapi?

Blazor服务器应用程序是基于SignalR的SPA，这意味着应用程序(浏览器)的客户端与应用程序(服务器)的服务器端之间的通信是由SignalR实现的.一般来说，SignalR在当前上下文中是构成上述Blazor Server App的两个部分之间的传输和通信方式.

Blazor Server App is SignalR-based SPA, meaning that the communication between the client-side of the application (browser) and the server-side of the application (server) is implemented by SignalR. Generally speaking, SignalR, in the current context, is a means of transportation and communication between the two parts which constitutes A Blazor Server App, mentioned above.

但是，在当前上下文中，Web Api是可以通过HTTP调用访问的Web API.更具体地说，它是一个使用控制器添加到项目中的应用程序，该控制器公开了可以使用HttpClient服务调用的端点.

A web Api, however, in the current context, is an API over the web which can be accessed using HTTP calls. More specifically, it is an application you add to your project with controllers that expose end points you can call using HttpClient service.

正如您所看到的，它不是SignalR与Web Api的关系，因为该术语指的是两个完全不同的概念.您可能会问到SignalR与HTTP协议之间的区别...

As you can see, it's not SignalR versus Web Api, as this terms refer to two completely different concepts. You may ask about the difference between SignalR versus HTTP protocols...

我会问一个正确的问题，而不是您的问题:我应该如何使用服务器端Blazor应用程序访问数据，我应该使用服务或Web Api吗?我已经在其他答案中详细回答了这个问题.您也可以查阅文档.

I'll ask the correct question instead of your question: How should I access data with my server-side Blazor app and what should I use services or Web Api ? I've answered this question at length in my other answers. You can also consult the docs.

请注意，您应该创建一个希望从Blazor Server App中使用的Web Api项目.

Note that you should create a Web Api project of you wish to use it from your Blazor Server App.

以及如何使用Signalr授权blazor?

and how authorize blazor with signalr?

我想现在您已经知道答案了. Server Blazor App基于SignalR.在这方面，您什么也没做.只需创建此类项目，然后开始编码，学习Blazor的核心Blazor组件模型.

I guess that by now you know the answer. Server Blazor App is SignalR-based. You don't do anything in that regard. Just create such type of project, and start coding, learning Blazor component model, which is the heart of Blazor.

最后，我只想提到Blazor客户端或Blazor WebAssembly Apps，不要使用SignalR，而要使用WebAssembly，以防万一.

Wrapping up, I just want to mention that Blazor client-side or Blazor WebAssembly Apps, do not employ SignalR, but rather WebAssembly, in case your confusion comes from here.

这篇关于如何在没有Microsoft身份的情况下进行JWT身份验证blazor服务器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！