Angular HttpClient拦截器问题：429错误返回状态码0而非429

问题分析 #

后端返回429（请求次数过多）状态码时，Postman能正常识别，但Angular中HttpErrorResponse.status始终为0，200、500、401等状态码则可正常处理。这种情况通常和跨域配置、错误处理逻辑或浏览器拦截有关。

常见解决办法 #

1. 检查后端CORS配置 #

当后端返回429时，若未正确设置CORS响应头，浏览器会拦截响应，导致Angular无法获取真实状态码。需确保后端返回429时携带以下头信息：

• Access-Control-Allow-Origin：设置为前端域名（如http://localhost:4200）
• Access-Control-Allow-Headers：包含请求中自定义的头（比如你的Authorization、sid）
  注意：部分后端框架在返回限流错误时，会默认跳过CORS头的设置，需要手动添加该逻辑。

2. 调整Angular拦截器的错误处理逻辑 #

当前使用tap操作符处理错误，推荐改用catchError专门捕获错误流，同时增加对status为0场景的兼容判断：

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    let accessToken = sessionStorage.getItem("access_token");
    if (request.url !== './assets/config/env.json') {
        request = request.clone({
            setHeaders: {
                Authorization: `Bearer ${accessToken}`,
                sid: `${this.config.getEnv('sid')}`,
            }
        });
    }
    return next.handle(request).pipe(
        tap(event => this.handleResponse(request, event)),
        catchError(error => {
            this.handleError(request, error);
            // 重新抛出错误，保证后续订阅者能捕获
            return throwError(() => error);
        })
    );
}

handleError(req: HttpRequest<any>, errorResponse: HttpErrorResponse) {
    // 兼容status为0的情况，结合错误信息判断是否为429
    const isTooManyRequests = errorResponse.status === 429 || 
                              (errorResponse.status === 0 && errorResponse.message.includes('Too Many Requests'));
    if (isTooManyRequests) {
        this.mostrarMensajeNoDuplicado("请求次数过多，请稍后再试。");
    } 
}

3. 排查浏览器拦截问题 #

打开浏览器开发者工具的Network面板，触发请求后查看：

• 如果看不到429响应，说明浏览器提前拦截了请求，需调整后端限流策略的触发频率；
• 如果能看到429响应但Angular中status为0，直接回到第一步检查CORS配置。

验证步骤 #

1. 打开浏览器开发者工具，切换到Network标签；
2. 触发目标请求，查看Response Headers中的CORS配置是否齐全；
3. 确认Response的状态码是否为429；
4. 根据结果调整后端或前端代码。

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