Angular中HTTP请求返回非Observable导致switchMap报错排查

问题背景 #

需要实现两次嵌套API调用，选用switchMap处理，但当前Angular 18 + RxJS 7项目中，第二个HTTP请求不被识别为Observable。相同代码在其他项目可正常运行，当前项目位于monorepo，包含AngularJS降级兼容代码。

报错信息 #

你提供了一个无效对象，预期是流。你可以提供Observable、Promise、ReadableStream、Array、AsyncIterable或Iterable。

复现代码 #

const { http } = this;
const url = `URL1`;

http.get<any>(url).pipe(
  switchMap(res => {
    console.log('call 1 finished')
    return http.get<any>('URL2')
  }),
).subscribe(val => {
  console.log('successful operation', val);
})

• 订阅从未触发执行
• 若用of()包裹第二个HTTP调用，代码可运行，但订阅输出的val是Observable对象本身，而非请求响应数据

临时可行方案 #

将第二个HTTP请求转为Promise，用lastValueFrom包装，可绕过问题：

this.http.get('https://catfact.ninja/fact').pipe(
  switchMap( (res) => {
    return lastValueFrom(this.http.get('https://catfact.ninja/fact'));
  }),
).subscribe((val) => {
  console.log('Final output2:', val);
});

排查方向 #

推测项目中Observable对象存在异常，所有接收Observable的RxJS操作符（如switchMap、forkJoin）传入HTTP请求时均会报错，可从以下方向排查：

• HTTP拦截器：检查项目内的HTTP拦截器，是否在处理响应时错误修改了返回值类型，将Observable转为非流对象
• RxJS依赖冲突：monorepo环境下可能存在多版本RxJS，或错误导入了非rxjs库的Observable类
• AngularJS降级代码：混合环境中的Zone.js配置、异步处理逻辑可能破坏了Observable的流特性
• HttpClient自定义封装：检查项目中是否对HttpClient进行了自定义封装，导致get方法未返回标准Observable

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