在 angular2 中显示 web api 异常

Posted 2023-03-10

【中文标题】在 angular2 中显示 web api 异常

【英文标题】：Display web api exception in angular2

【发布时间】：2016-12-02 12:01:15

【问题描述】：

我正在开发一个带有 web api 后端和 angular2 前端的项目。我在 angular2 中显示服务器错误时遇到问题。每次服务器错误都会引发 CORS 错误。

Here is my sample api

public IActionResult Post([FromBody] Visitor model)

  if (model == null) throw new HttpResponseException(new HttpResponseMessage(HttpStatusCode.NoContent)
  
      ReasonPhrase = "Missing model in post"
  );
  _registerService.register(model);
  return Ok(model);    



And here is my angular2 service


addVisit(visit: Visit) 

let siteId = visit.siteId;
let body = JSON.stringify(visit);
let headers = new Headers( 'Content-Type': 'application/json' );
let options = new RequestOptions( headers: headers );

return this.authHttp
    .post(`$this._visitorsUrl` + siteId, body, options)
    .map(res => 
        res.json();
        console.log("map: " + JSON.stringify(res.json()));
    )
    .catch(err => console.log(err));

当模型为 null 时返回错误 502 或 CORS 错误，但当模型不为 null 时返回 200

我的问题是如何显示服务器返回的错误。

【参考方案1】：

你不能添加类似的东西

error =>  this.errorMessage = <any>error;

在 if 你检查 null 的地方？我在 .subscribe 到 .map 中使用它，但我相信它就是您正在寻找的东西？

【讨论】：

我已经这样做了，但仍然无法使用 handleError (error: any) let errMsg = (error.message) ?错误消息：错误状态？ $error.status - $error.statusText : '服务器错误';控制台.error(errMsg); // 登录到控制台而不是返回 Observable.throw(errMsg);

这里你有另一个例子基本上做同样的事情，检查getCountriesByRegion()，如果它没有出现，可能是因为别的原因？ waynehong.com/javascript/angular-2-service-example-typescript

【参考方案2】：

您应该将响应转换为 InternalServerError 并返回 Content，如下面的代码 sn-p 所示

throw new HttpResponseException(new HttpResponseMessage(HttpStatusCode.InternalServerError)
            
                ReasonPhrase = "Missing model in post",
                Content = new StringContent("Missing Model in post")
            );

然后您将能够在角度错误的 statusText 属性中看到错误。

【讨论】：

它返回了什么？

XMLHttpRequest 无法加载 500

【参考方案3】：

.net Core 2.2 中有一个错误修复，修复了“在错误 500 的情况下不发送 CORS 标头”的错误，该错误会导致 CORS 错误。

https://github.com/aspnet/AspNetCore/issues/2378