我做了一个asp.net core 2.0 SignalR Hub,它使用Bearer Token进行身份验证。现在我有点不知道如何通过SignalR Angular 5客户端连接到它。如果我从Hub中删除授权,我实际上可以连接,所以连接工作,现在我相信我只需要将授权承载添加到连接的Http Header。
我的Angular 5项目的package.json
文件中的SignalR客户端引用:"@aspnet/signalr-client": "^1.0.0-alpha2-final"
我的Angular组件:
import { Component, OnInit } from '@angular/core';
import { finalize } from 'rxjs/operators';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { ToastrService } from 'ngx-toastr';
import { AuthenticationService } from '../core/authentication/authentication.service';
import { HubConnection } from '@aspnet/signalr-client';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
quote: string;
isLoading: boolean;
jwtToken:string;
private hubConnection: HubConnection;
constructor(
private _http: HttpClient,
private _auth : AuthenticationService,
private _toastr: ToastrService) { }
ngOnInit() {
this.isLoading = false;
this.jwtToken = this._auth.currentToken;
this.hubConnection = new HubConnection('http://localhost:27081/hub/notification/');
this.hubConnection
.start()
.then(() => console.log('Connection started!'))
.catch(err => console.error('Error while establishing connection :(', err));
this.hubConnection.on("send", data => {
console.log(data);
});
}
showToastr(){
this._toastr.success('Hello world!', 'Toastr fun!');
}
}
字符串
由于阅读类似的问题,我尝试:this.hubConnection.Headers.Add("token", tokenValue);
但它不工作,标题属性不存在。
如何将Bearer令牌添加到HubConnection的Http Header?
谢谢你的帮助
4条答案
按热度按时间kr98yfug1#
要使用@aspnet/signalr(^1.1.4)执行此操作,可以使用以下代码
字符串
还可向中心添加注解
型
作为一个侧面说明,SignalR在使用WebSocket协议时似乎没有将Bearer令牌作为头部附加,而是将其作为“access_token”参数添加到请求URL,这需要您配置您的身份验证,以便在SignalR选择使用ws时处理此令牌。
型
2ul0zpep2#
通过阅读它们的源代码和测试,似乎可以提供一个包含访问令牌的选项对象,如下所示
字符串
特别是测试文件here中的代码
kknvjkwl3#
我找不到一种方法来解决使用角,但我做了它使用asp.net以下this article。
这就是我所做的:现在为了连接,我在querystring中传递jwt token并指定传输类型:
字符串
然后在
startup.cs
>ConfigureServices()
中:型
b4qexyjb4#
最简单的方式:使用自定义中间件进行认证前,通过查询参数设置auth header,具体如下:
字符串