Angular 2 如何从后端读取自定义错误消息

Posted

技术标签:

【中文标题】Angular 2 如何从后端读取自定义错误消息【英文标题】:Angular 2 how to read Custom error message from backend 【发布时间】:2016-12-30 11:47:34 【问题描述】:

Angular 2 的问题在 AngularJS 中不存在,我将错误消息作为带有后端 API 调用的字符串发送,以防出现错误,以错误状态 401 为例,现在的问题是我不能从 Angular2 http 响应消息中读取此消息,而我可以从 AngularJS 中做到这一点:

我尝试了以下代码,但没有任何帮助:

承诺:

this._http.post('/login',email: 'email@example.com', password: '123')
            .toPromise()
            .then((resp) => console.log(resp), (error) => console.log(error));

可观察:

this._http.post('/login',email: 'email@example.com', password: '123')
    .subscribe(response =>console.log(response), (error) => console.log(error));

我从后端发送响应作为文本,对于 OK 或 Unauthorized,对于 OK,我发回 String token == UUID.randomUUID().toString();,对于错误,我发回类似 String error = " Invalid credentials "; 的消息,问题是 console.log 有效并且打印成功的文本(在这种情况下是令牌),但如果出现错误,它只会打印:Response with status: 200 for URL: null

如果我将代码更改为JSON.stringify(error),我会得到如下信息:

"_body":,"status":401,"ok":false,"statusText":"Unauthorized","headers":"null":["HTTP/1.1 401 Unauthorized"],"Access-Control-Allow-Headers":["Origin"," X-Requested-With"," Content-Type"," Accept"," Referer"," User-Agent"],"Access-Control-Allow-Met
hods":["POST"," GET"," PUT"," DELETE"," OPTIONS"],"Access-Control-Allow-Origin":["*"],"Allow":["*"],"Content-Length":["36"],"Content-Type":["text/plain; charset=utf-8"],"Date":["Tue"," 23 Aug 2016 14:53:25 GMT"],"type":2,"url":null

正如您所见,Object 内部甚至没有提到错误测试!

我尝试将后端的错误响应更改为返回 json,如下所示:


   "message": "invalid email or password"

我可以在_body里面得到结果,我只能这样读:console.log(error._body.message)!但我觉得这种方式有问题,在这种情况下我不想以 json 的形式响应。

对于 angularjs (angular 1),打印响应非常简单,一切都很酷,而在 angular 2 中,这是一个真正的问题。

什么问题,以及如何在不对后端进行任何重构的情况下解决这个问题?

编辑:

我使用 Angular 2.0.0-rc.4 和 http 相同:`"@angular/http": "2.0.0-rc.4"

【问题讨论】:

【参考方案1】:

莫桑法尔 就我而言,我正在使用 Asp Web Api 作为后端,这也让我抓狂,我发现的唯一解决方案是在 json 中转换并阅读消息,我知道这真的很难看,但对我有用。 问候。

CheckError(error: any) 
    let servermsg: any = JSON.parse(error._body)["ModelState"]["Login"][0];
    if (servermsg) 
        this.showMsg = true;
        this.msg = servermsg;
    

【讨论】:

【参考方案2】:

如果您从服务器返回 JSON 对象,您可以在客户端使用以下代码:

let errMsg: ErrorMessage = err.json();
console.log(errMsg.message)

export class ErrorMessage 
  message:string;

【讨论】:

以上是关于Angular 2 如何从后端读取自定义错误消息的主要内容,如果未能解决你的问题,请参考以下文章

如何根据 Angular 2 中的自定义验证规则显示错误消息?

如何使用自定义错误消息捕获“TypeError:无法读取未定义的属性(读取'0')”?

如何显示来自 angular 8 typescript 订阅的错误消息?

使用 Angular 和 JWT 令牌持续登录

如何从后端路由器获取错误消息?

Angular 材质 Snackbar 配置与自定义 panelClass 配置,用于错误、成功、警告消息