Angular中HTTP POST请求返回Unauthenticated错误的排查求助

1. 修正HttpClient.post的参数顺序（最可能的直接原因） #

你的代码错误地将请求选项（headers、body）都放在了第二个参数位置，不符合Angular HttpClient.post的调用规范。正确的调用格式是：http.post(url, body, options)

修正后的代码：

add_product(token: string, data: any): Observable<any> {
    return this.http.post<any>(`${API_USERS_URL}/products/create`, data, {
        headers: {
            'Authorization': 'Bearer ' + token,
            'Content-Type': 'application/json' // 若后端要求JSON格式建议添加
        }
    });
}

注意：

• 第二个参数直接传data即可，HttpClient会自动将对象序列化为JSON，无需手动调用JSON.stringify
• 包含headers的配置对象必须放在第三个参数位置

2. 验证Token的有效性 #

• 检查token是否为空、过期或格式错误（比如Bearer和Token之间必须有空格）
• 打开浏览器开发者工具的Network面板，查看请求头，确认Authorization头是否完整携带了Bearer Token
• 用Postman等工具直接调用该接口并传入相同Token，验证是否能正常请求，排除后端接口本身的问题

3. 检查请求头的Content-Type #

如果后端要求接收JSON格式的请求体，需确保请求头包含Content-Type: application/json。Angular在传入对象作为body时会自动添加该头，但手动处理body时可能丢失，修正后的代码已配置该头，可根据后端要求调整。

4. 排查跨域或后端认证逻辑问题 #

• 确认后端是否允许当前域名的跨域请求，是否配置CORS允许携带自定义头（如Authorization）
• 检查后端认证中间件是否正确解析Bearer Token，比如是否存在大小写敏感问题（Authorization头的拼写必须准确）

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