Angular 你知道我该如何给这个函数添加标题吗?

Angular 你知道我该如何给这个函数添加标题吗?,angular,rest,typescript,token,Angular,Rest,Typescript,Token,有什么想法我可以添加标题的功能如下所示?我创建了登录服务,得到了200的响应状态。但是,当我尝试发送GET请求时,我的GET加载资源失败:服务器响应状态为403(禁止)。 我得到: get(url: string, options?: RequestOptionsArgs): Observable<Response> { return super.get(appConfig.apiUrl + url, this.addJwt(options)).catch(this.hand

有什么想法我可以添加标题的功能如下所示?我创建了登录服务,得到了200的响应状态。但是,当我尝试发送GET请求时,我的GET
加载资源失败:服务器响应状态为403(禁止)。

我得到:

get(url: string, options?: RequestOptionsArgs): Observable<Response> {
    return super.get(appConfig.apiUrl + url, this.addJwt(options)).catch(this.handleError);
}

 private addJwt(options?: RequestOptionsArgs): RequestOptionsArgs {
        // ensure request options and headers are not null
        options = options || new RequestOptions();
        options.headers = options.headers || new Headers();

        // add authorization header with jwt token
        let currentUser = JSON.parse(localStorage.getItem('currentUser'));
        if (currentUser && currentUser.token) {
            options.headers.append('Authorization', 'Bearer ' + currentUser.token);
        }

        return options;
    }
get(url:string,options?:RequestOptionsArgs):可观察{
返回super.get(appConfig.apiUrl+url,this.addJwt(options)).catch(this.handleError);
}
私有addJwt(选项?:RequestOptionsArgs):RequestOptionsArgs{
//确保请求选项和头不为null
选项=选项| |新请求选项();
options.headers=options.headers | | new headers();
//使用jwt令牌添加授权标头
让currentUser=JSON.parse(localStorage.getItem('currentUser');
if(currentUser&¤tUser.token){
options.headers.append('Authorization','Bearer'+currentUser.token);
}
返回选项;
}
解决方案 问题是后端希望令牌以
令牌132083128901302
的形式发送,而我正在发送
承载132083128901302
。将承载者更改为令牌后,一切正常

let headers = new Headers({ 'Authorization': 'Bearer ' + jwt });
let options = new RequestOptions({ headers: headers });
return this.http.get('http://test.dev/get/user', options).map(res => res.json());

我强烈建议您通过HttpClient模块使用拦截器。它易于实现,应用程序中的代码更少,更易于管理。

看起来您已经在注释处添加了标题
//使用jwt令牌添加授权标题
。您认为缺少哪个标题?仅供参考,
.subscribe()
肯定是错误的
.catch(this.handleError)
更糟糕,它直接来自Angular官方指南(它需要是
.catch(e=>this.handleError(e));
)。道德是,棱角分明的官方导游是完全可怕的。沃德·贝尔,你真丢脸。即使将
.subscribe()
更改为
.subscribe(response2=>this.response2=response2),代码仍然错误,因为您不想从
LoginService
中的服务调用返回订阅,只想返回
可观察的
。除非您直接在已添加的组件中使用
Http
,否则我创建此函数仅用于测试,以检查标头是否添加良好,但此代码仅使用一次。在登录头自动添加之后,您的解决方案和我的解决方案没有什么不同,不是吗?不,根本没有什么不同。这就是为什么我说使用拦截器。我给你的代码只是一个解决方案。我将为您链接一个教程,或者您可以自己搜索,因为有很多关于如何实现角度拦截器的教程。拦截器就像一个中间件,对于每个请求,拦截器都会自动添加头,然后处理请求。因此,您只能在一个位置添加标题。
let headers = new Headers({ 'Authorization': 'Bearer ' + jwt });
let options = new RequestOptions({ headers: headers });
return this.http.get('http://test.dev/get/user', options).map(res => res.json());