Angular & Spring - 标头未传递到后端答案

【问题标题】：Angular & Spring - Headers not passed to backendAngular & Spring - 标头未传递到后端
【发布时间】：2020-09-01 18:47:09
【问题描述】：

我正在尝试在来自 Angular 前端的 http 请求中添加一个 Authorization 标头，但它不起作用：后端没有收到此标头。

当我在 Chrome 的控制台上观看时，我可以看到请求包含标头。
当我使用 Postman 时，后端的标头没问题。

这是邮递员的截图：

这是我的 Angular 拦截器：

    intercept(request: HttpRequest<any>, next: HttpHandler): 
        Observable<HttpEvent<any>> {
            if (!request.url.startsWith('http')) {
               if (localStorage.getItem('token')) {
                 let headers: HttpHeaders = request.headers;
                 headers = headers.set('Authorization', 'Bearer ' + 
                 localStorage.getItem('token'));

                 request = request.clone({
                     url: environment.backendUrl + request.url, headers
                 });
               }
            }

            console.log("headers are : ", request.headers);

            return next.handle(request).pipe(catchError((error: 
            HttpErrorResponse) => 
            {
               [...]
            })) as any;
   }

这是我的 Spring 过滤器：

public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain chain) throws IOException, ServletException {

    final HttpServletRequest request = (HttpServletRequest) servletRequest;
    final HttpServletResponse response = (HttpServletResponse) servletResponse;

    // Assume we have only one Authorization header value
    final Optional<String> token = Optional.ofNullable(request.getHeader(HttpHeaders.AUTHORIZATION));
    // Optional is empty
    [...]
}

【问题讨论】：

不确定 tihs 是否有帮助，但我使用：request = request.clone({ setHeaders: { foo: bar } });

标签： angular spring http http-headers angular-http-interceptors

【解决方案1】：

您必须在 Access-Control-Allow-Headers（在后端）中添加 Authorization 标头键

Access-Control-Allow-Headers：授权（当你这样给予时，它只接受指定的标头。意味着如果你想接受另一个密钥，如授权，你必须提及该密钥名称）

或

你也可以这样给予

访问控制允许标题：*

【讨论】：

我认为这不是问题，否则我无法与 Postman 一起工作。然而，我添加了 Spring 配置并没有改变任何东西：registry.addMapping("/**").allowedMethods("").allowedHeaders("");
我认为这是问题，您只能检查一次
我遇到了同样的问题。前端我使用的是角度后端我使用的是弹簧启动。我用soapui检查它正在工作，但是当我运行应用程序时它显示相同的错误。它是在允许标头中指定授权密钥后工作正常

【解决方案2】：

我的问题是在 WebSecurityConfig 上，我忘了用这个启用 CORS：

http
      .cors().and()

【讨论】：