如何将承载令牌添加到 HTTP 请求的标头?

Posted

技术标签:

【中文标题】如何将承载令牌添加到 HTTP 请求的标头?【英文标题】:How do I add a Bearer Token to the header of a HTTP request? 【发布时间】:2019-12-20 06:32:52 【问题描述】:

我无法弄清楚如何设置授权标头,其中授权作为键,不记名令牌作为值。

我已经完成了一个内置身份验证的 Web API。我已经在邮递员上对其进行了测试,并且一切正常。问题出在邮递员身上,我将令牌副本通过它传递给新的键和值,在站点中我不确定如何在 Blazor 项目中更改这些值。

在http://testapi.com/api/token/username/password 处输入对 API 的 Get 时,API 会发回一个代码,我需要将该代码放入标题中。

login.razor

@page "/"
@inject HttpClient Http

<h1>Hello, world!</h1>

Welcome To The New Site

<EditForm Model="@use" OnValidSubmit="@HandleValidSubmit" OnInvalidSubmit="@HandleInvalidSubmit" Context="EditFormContext">
    <DataAnnotationsValidator />
    <DxFormLayout>
        <DxFormLayoutItem Caption="Username:" ColSpanMd="6">
            <Template>
                <DxTextBox @bind-Text="@use.username" />
            </Template>
        </DxFormLayoutItem>
        <DxFormLayoutItem Caption="Password:" ColSpanMd="6">
            <Template>
                <DxTextBox @bind-Text="@use.password" />
            </Template>
        </DxFormLayoutItem>
        <DxFormLayoutItem ColSpanMd="12">
            <Template>
                <ValidationSummary />
            </Template>
        </DxFormLayoutItem>
        <DxFormLayoutItem ColSpanMd="12">
            <Template>
                <button type="submit">Submit</button>
            </Template>
        </DxFormLayoutItem>
    </DxFormLayout>
</EditForm>

@code 
        User[] token;
        User use = new User();

        async void  HandleValidSubmit()
        
            token = await Http.GetJsonAsync<User[]>("http://testapi.com/api/token/" + use.username + "/" + use.password);
            if (token != null)
            
                await SaveToken();
                await SetAuthorizationHeader();
                Console.WriteLine("OnValidSubmit");
            
        
        private void HandleInvalidSubmit()
        
            Console.WriteLine("OnInvalidSubmit");
        

        private async Task SaveToken()
        

        

        private async Task SetAuthorizationHeader()
        

        

    class User
    
        public string username  get; set; 
        public string password  get; set; 
    

【问题讨论】:

【参考方案1】:

我使用 API / IdentityServer4 / Blazor(服务器端)进行了类似的设置。也许你可以使用我在this *** question 中发布的一些代码。

【讨论】:

【参考方案2】:

如果您使用的是服务器端 Blazor @Pascal R。答案应该会带您走上正确的道路。 对于客户端 Blazor:

    将令牌保存到您的应用程序的全局可访问存储中。类似于本地存储或级联值 每次您需要进行经过身份验证的 ws 调用时,都从存储中获取令牌并将其添加为标头。

要将令牌保存在本地存储中,我建议使用:Blazored Local storage。

【讨论】:

以上是关于如何将承载令牌添加到 HTTP 请求的标头?的主要内容,如果未能解决你的问题,请参考以下文章

Angular 4图像异步与承载标头

简单 Odata 客户端 - 如何在每个请求标头中添加 oAuth 令牌?

如何将自定义 HTTP 请求标头添加到 Thymeleaf 生成的表单或链接?

如何将 Django 的 CSRF 令牌添加到 jQuery POST 请求的标头?

keycloak 客户端协议映射器(脚本映射器)将请求标头添加到令牌中

将标头添加到 http 请求