Angular中使用oidc-client-ts登出时遇Content-Type无效错误

解决办法 #

1. 自定义HTTP客户端适配响应格式 #

oidc-client-ts支持自定义HTTP实现，你可以通过继承默认的HttpClient来修改请求头或处理不符合规范的响应：

import { HttpClient } from 'oidc-client-ts';

class CustomOidcHttpClient extends HttpClient {
  async send(request: any): Promise<any> {
    // 给token revocation请求添加Accept头，引导服务器返回JSON格式
    if (request.url.includes('/token/revocation')) {
      request.headers['Accept'] = 'application/json';
    }

    const response = await super.send(request);

    // 处理服务器返回的text/plain空响应
    if (
      request.url.includes('/token/revocation') &&
      response.status === 200 &&
      response.contentType === 'text/plain; charset=utf-8' &&
      !response.body
    ) {
      // 把响应伪装成符合要求的JSON格式
      response.body = '{}';
      response.contentType = 'application/json';
    }

    return response;
  }
}

然后在初始化UserManager时指定这个自定义客户端：

const userManagerConfig = {
  // 你的其他配置（authority、client_id等）
  httpClient: new CustomOidcHttpClient()
};

const userManager = new UserManager(userManagerConfig);

2. 要求身份提供商调整端点响应 #

根据OAuth 2.0令牌撤销规范，/token/revocation端点的成功响应应该使用application/json作为Content-Type（即使返回空内容）。如果有权限，直接联系新身份提供商的运维团队，让他们修改这个端点的响应头，改成Content-Type: application/json，同时返回空对象{}或者空JSON数组[]。

3. 降级oidc-client-ts版本（不推荐） #

部分旧版本的oidc-client-ts对Content-Type的检查没有那么严格，不过这种方法可能引入其他兼容性问题，不建议优先使用。

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