调用GET API时出现HTTP 400错误，问题根源是什么？

核心问题分析 #

HTTP 400错误通常是请求格式不合法导致的，结合你的代码和Postman正常的情况，大概率是客户端请求头配置错误：

• Access-Control-Allow-Origin是服务器返回给客户端的响应头，不是客户端请求头，你在GET请求里添加这个头会触发服务器的非法请求校验。
• GET请求不需要设置Content-Type: application/json（GET没有请求体），多余的头信息可能干扰服务器解析。

具体修改步骤 #

1. 修正api.service.ts的请求方法 #

删除不必要的请求头配置：

getLocales(): Observable<any> {
  // 移除错误的请求头，GET请求无需额外Content-Type，也不要加Access-Control-Allow-Origin
  return this.http.get(environment.url + 'api/local');
}

2. 确保拦截器正确注册 #

检查app.module.ts是否已将拦截器加入providers，否则拦截器不会生效：

import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { AuthInterceptorService } from './auth-interceptor.service'; // 替换为你的拦截器实际路径

@NgModule({
  declarations: [/* ... */],
  imports: [/* ... */],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptorService,
      multi: true // 允许多个拦截器共存
    }
  ],
  bootstrap: [/* ... */]
})
export class AppModule { }

3. 优化拦截器的token读取逻辑 #

避免重复读取localStorage，同时确保token格式正确：

export class AuthInterceptorService {
  constructor() { }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const token = localStorage.getItem('token');
    let request = req;

    if (token) {
      request = req.clone({
        setHeaders: {
          Authorization: `Bearer ${token.trim()}` // 去除token可能存在的空格
        }
      });
    }

    return next.handle(request);
  }
}

4. 排查额外细节 #

• 打开浏览器开发者工具（F12）→ 切换到Network标签，查看请求的Request Headers和Response详情，Symfony通常会返回具体的错误描述（比如哪个头不合法）。
• 确认environment.url的格式：如果url末尾没有斜杠，拼接后是否会出现https://localhost:8000api/local这种错误路径？建议统一在environment里配置带末尾斜杠的地址，比如https://localhost:8000/。

内容的提问来源于stack exchange，提问作者user20725278