从 httpClient 获取 HttpErrorResponse 时出现问题

Question

我在使用 angular 和 .net 后端时遇到问题。在我的应用程序中，当用户试图做一些不允许的事情时，我试图 return http status 403 Forbidden。

在我的后端控制器中

[HttpDelete("{id}")]
public async Task<ActionResult<UserProject>> DeleteUserProject(int id)
{
    ...
    // Insufficient permissions"
    return Forbid();
}

在我的 angular 服务中

deleteProjectUser(userProjectId: number): Observable<any> {
  return this.http.delete(`${environment.apiUrl}/UserProjects/${userProjectId}`, { observe: 'response' })
    .pipe(
      tap(
        userProject => {
          // works
          return userProject;
        },
        error => {
          // Expecting HttpErrorResponse with error.status == 403
          console.log(error);
        }));
}

在我的 angular 组件中

leaveProject(userProjectId: number) {
    console.log('remove user-project with id: ' + userProjectId);
    this.projectService.deleteProjectUser(userProjectId)
      .pipe(first())
      .subscribe(
        data => {
          // everything worked
        },
        error => {
          // Expecting propagated HttpErrorResponse
          console.log(error);
        });
}

我可以看到后端 returns 403 没有正文，正如 chrome 中预期的那样。但是当后端使用 Forbid() 方法 returns 403 时，我没有从 http.delete 得到 HttpErrorResponse。我收到类型错误。

在chrome控制台中输出

remove user-project with id: 1202
userProjectService.leaveProject userProjectId: 1202
DELETE http://localhost:5000/api/UserProjects/1202 403
TypeError: Cannot read property 'message' of null
    at CatchSubscriber.selector (error.interceptor.ts:20)
    at CatchSubscriber.error (catchError.js:29)
    at XMLHttpRequest.onLoad (http.js:2477)
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Object.onInvokeTask (core.js:39680)
    at ZoneDelegate.invokeTask (zone-evergreen.js:390)
    at Zone.runTask (zone-evergreen.js:168)
    at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:465)
    at invokeTask (zone-evergreen.js:1603)
    at XMLHttpRequest.globalZoneAwareCallback (zone-evergreen.js:1640)
TypeError: Cannot read property 'message' of null

好的，但如果我不使用 Forbid() 方法。我可以设置一个正文，所以我将后端更改为

return new ObjectResult("Forbidden") { StatusCode = 403 };

然后我在我的服务和组件中收到字符串“Forbidden”作为错误。但是仍然没有来自 HttpClient 的 HttpErrorResponse。怎么了？如果出现问题，我想要一个 HttpErrorResponse 和来自 HttpClient.delete 的 http 状态代码。

Answer 1

您的堆栈跟踪显示您的应用程序中有一个 error.interceptor。 TypeError 出现在你系统的那个部分。您可以检查拦截器中的第 20 行，以查看有关您尝试解决的问题的更多详细信息。

从 httpClient 获取 HttpErrorResponse 时出现问题

Problem getting HttpErrorResponse from httpClient

angular

angular-httpclient