使用RxJS的lastValueFrom处理HTTP请求时，如何获取真实服务端错误而非EmptyError？

我完全理解你的困扰——明明服务端返回了422错误，却被lastValueFrom转换成了EmptyError，根本拿不到真实的错误信息。这背后的原因其实很清晰：

当lastValueFrom处理Observable时，如果源Observable没有发出任何值就直接完成，它就会抛出EmptyError。在你的场景里，大概率是doStuff()返回的Observable在遇到服务端错误时，没有正确抛出HttpErrorResponse，而是被转换成了一个空Observable（比如内部用了catchError并返回EMPTY），导致lastValueFrom认为没有任何值被发出，从而抛出EmptyError。

下面是两种可行的解决方法：

方法1：修复服务中的Observable实现 #

先检查doStuff()的代码，如果存在类似下面的错误处理逻辑：

doStuff(): Observable<DoStuffResponse> {
  return this.http.post('/api/your-endpoint', payload).pipe(
    catchError(err => {
      // 错误地吞掉了HTTP错误，返回空Observable
      return EMPTY;
    })
  );
}

你需要修改它，让真实错误被重新抛出，而不是被吞掉：

import { throwError } from 'rxjs';

doStuff(): Observable<DoStuffResponse> {
  return this.http.post('/api/your-endpoint', payload).pipe(
    catchError(err => {
      // 重新抛出原始的HttpErrorResponse
      return throwError(() => err);
    })
  );
}

这样调整后，当服务端返回422错误时，Observable会直接抛出对应的HttpErrorResponse，lastValueFrom就能捕获到这个真实错误，而不是EmptyError。

方法2：在调用端提前拦截并重新抛出错误 #

如果你无法修改服务代码，可以在调用lastValueFrom之前，通过pipe先拦截错误并重新抛出：

import { catchError, throwError } from 'rxjs';

const response = await lastValueFrom(
  this.service.doStuff().pipe(
    catchError(err => {
      // 确保错误被抛出，不让Observable空完成
      return throwError(() => err);
    })
  )
).catch((e) => {
  console.log('#1', e); // 这里会输出真实的HttpErrorResponse，包含422状态码等信息
  return {} as DoStuffResponse;
});

额外注意：避免重复使用last()操作符 #

如果你的doStuff()里已经使用了last()操作符，一定要去掉它！因为lastValueFrom本身就是用来获取Observable最后一个值的，重复使用last()会导致：当Observable因HTTP错误抛出异常时，last()会先抛出EmptyError，直接覆盖了原始的服务端错误。

比如，不要这样写：

// 错误的实现
doStuff() {
  return this.http.post(...).pipe(last());
}

改成：

// 正确的实现
doStuff() {
  return this.http.post(...);
}

按照上面的方法调整后，你就能成功捕获到真实的422服务端错误了。

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