Nswag/Angular 在錯誤事件中顯示 API 錯誤信息

Question

首先，我將 CQRS 架構用於后端 API，並將 NSWAG 用作 API 連接； 在前端 Angular 的服務代理中生成 API 端點。

我對我的 POST API 進行了簡單驗證，同時測試創建的 API 結果在 DevTools 中有所不同。

在“網絡”選項卡中，發生了我預期的驗證，但在“控制台”選項卡中，結果不同； 事實上，結果是我需要的。

這是我的問題。 有圖有詳細

API 電話代碼

     saveLocationType(createLocationTypeCommand){
    this.tenantService.createLocationType(createLocationTypeCommand).subscribe(result => {
   // Do Something
    }, error => {
      console.log(error); 
    })
  }

這是來自我在網絡選項卡中的 API 的驗證結果是正確的。

這是我在控制台中的問題，這里的結果在網絡選項卡中必須相同。

我相信控制台中的結果來自服務代理，因為這是為前端生成/格式化 API 的代理。

有沒有辦法配置 NSWAG 生成的服務代理？ 還是有其他方法可以在網絡選項卡中的控制台選項卡中顯示錯誤消息？

Answer 1

我使用這些參考解決了我的問題：

• https://github.com/RicoSuter/NSwag/issues/2327
• https://lurumad.github.io/problem-details-an-standard-way-for-specifying-errors-in-http-api-responses-asp.net-core

我實施的 C# Web API 中的片段解決了我的問題

  [HttpPost("setup/locationType", Name = "createLocationType")]
        [ProducesResponseType((int)HttpStatusCode.OK)]
        [ProducesResponseType(typeof(ValidationProblemDetails), (int)HttpStatusCode.BadRequest)]
        public async Task<IActionResult> CreateLocationTypeAsync([FromBody] CreateLocationTypeCommand command)
        {
            try
            {
                var commandResult = await _mediator.Send(command);

                if (!commandResult)
                {
                    return BadRequest();
                }

                return Ok();
            }
            catch(Exception ex)
            {
                var problemDetails = new ValidationProblemDetails
                {
                    Status = (int)HttpStatusCode.BadRequest,
                    Type = "",
                    Title = "Create Location Type",
                    Detail = ex.Message,
                    Instance = HttpContext.Request.Path
                };

                return new ObjectResult(problemDetails)
                {
                    ContentTypes = { "application/problem+json" },
                    StatusCode = (int)HttpStatusCode.BadRequest,
                };
            }

        }

謝謝！

Answer 2

如果您使用 angular http 客戶端，請嘗試使用 responseType 文本選項。

return this.http.post(url,body, {responseType: 'text'}).subscribe()

默認情況下，客戶端嘗試將響應作為 responseType: 'json' 處理。 他嘗試將此響應解析為 json 並失敗並引發此錯誤。

有關非 Json 響應體的更多信息，您可以在此處找到： https://angular.io/guide/http#requesting-non-json-data