Angular 7未根据请求发送正确的标头

Posted 2023-03-10

【中文标题】Angular 7未根据请求发送正确的标头

【英文标题】：Angular 7 not sending correct header on request

【发布时间】：2019-04-11 12:40:43

【问题描述】：

我无法在 Angular 7 中发送正确的标题！ 我在后端使用护照：

"app.get('/api/users', passport.authenticate('jwt', session: false), (req, res, next) => ... bla bla bla...."

当我尝试将有效令牌从邮递员发送到我的路径/api/用户时，一切正常，但是当我从 Angular 执行此操作时却没有。 （* Angular 不显示错误！） 假设“Bearer validToken”是一个有效的令牌 这样我发送标题：

getAll() 

const httpOptions = 
headers: new HttpHeaders(
'Content-Type': 'application/json',
'Authorization': 'Bearer validToke.' 
  );
;

return this.http.get<user[]>(`http://localhost:3000/api/users`, httpOptions);

我可以从 Angular 进行身份验证并获取 Bearer 令牌，一切正常，如果我删除 passport.authenticate ('jwt', session: false)，我可以获得用户列表

感谢您的阅读！

【参考方案1】：

我可以通过创建一个拦截器来解决这个问题：

import  Injectable  from '@angular/core';
    import  HttpRequest, HttpHandler, HttpEvent, HttpInterceptor  from '@angular/common/http';
    import  Observable  from 'rxjs';

    import  AuthenticationService  from '../_services/authentication.service';

    @Injectable()
    export class JwtInterceptor implements HttpInterceptor 
      constructor(private authenticationService: AuthenticationService) 

      intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> 
        // add authorization header with jwt token if available
        let currentUser = this.authenticationService.currentUserValue;
        if (currentUser && currentUser.token) 
          request = request.clone(
            setHeaders: 
              Authorization: `$currentUser.token`
            
          );
        

        return next.handle(request);
      
    

谢谢

【参考方案2】：

对我来说一切似乎都是正确的 - 但我对您的代码进行了一些小改动

不要绑定HttpOptions直接在请求中绑定HttpHeaders检查下面的代码

getAll() 

const httpHeaders = new HttpHeaders (
     'Content-Type': 'application/json',
     'Authorization': 'Bearer validToke.' 
   );

return this.http.get<user[]>(`http://localhost:3000/api/users`,  headers: httpHeaders );

现在这将为请求添加您的标头 - 如果您用于从不同域获取数据 - 尝试在您的服务器上添加 cors - 浏览器会将请求预先发送为HttpOptions，然后将其绑定为@ 987654325@在你的情况下

希望它有效 - 编码愉快！！