http.get（）。pipe（）-无法从服务器获取实际的响应对象以进行日志记录

Question

用例-向服务器发出http get调用。记录来自服务器的实际响应。转换响应对象（将纪元日期字段转换为javascript日期）。然后返回转换后的对象。

代码段-

/** GET users from the server */
  getUsers(): Observable<IUser[]> {
    this.logger.log(`GET on ${this.baseUrl}`);
    return this.http.get<IUser[]>(this.baseUrl).pipe(
      tap(users => this.logger.log(`fetched users - `, users)),
      map(users => {
        return users.map(user => this.convertResponse(user));
      }),
      catchError(handleError.bind({ logger: this.logger }))
    );
  }

当前，我正在使用tap（）记录响应。然后使用map（）转换响应对象。但是显示的日志消息是转换后的对象的消息，而不是服务器的原始响应。

如何在转换之前捕获响应对象？

编辑-

  private convertResponse(user: IUser): IUser {
    user.createdDate = new Date(user.createdDate);
    user.modifiedDate = new Date(user.modifiedDate);
    return user;
  }

Answer 1

您的convertResponse方法使数组中的对象变异（然后返回变异的对象）。您做记录阵列的“未转换”版本，但是当您在开发人员工具中点击“ expend”时，突变已经发生，并且您正在查看对象的外观就像之后一样，您的突变发生了。

在Chrome中扩展对象时，如果将鼠标悬停在扩展旁边的蓝色“ i”工具提示上，则会看到此警告。

更改您的convertResponse方法以返回一个新对象。

  private convertResponse(user: IUser): IUser {
    return {
      ...user,
      createdDate = new Date(user.createdDate),
      modifiedDate = new Date(user.modifiedDate),
    }
  }