http.get - 如何正确捕获404错误

4
我正在构建一个日历应用程序,从(目前模拟的)后端获取每天的数据。 如果http.get的url正确,则可以正常工作,但是如果url错误或后端请求的日期没有任何数据/ json对象(例如,周末没有任何数据),则会返回404错误。但控制台中的日志很少显示它,而总是给出以下错误:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

很明显,由于请求的日期没有Json对象存在,因此无法在那里找到预期的字符。检查网络分析后发现确实是404错误。
我使用了基本的http.get和handleError,来自这里https://angular.io/guide/http#subscribe 带有http.get的服务代码:
getDayInfo(date: string): Observable<any> {
  return this.gttp.get('somepath/' + date + '/somemoreinfo')
    .map(this.extractData, // works just fine
         console.log('map running for date: ', date)
    ) 
    .catch(this.handleError);
}

private extractData(res: Response) {
  if (res != null) {
    let body = res.json();;
    return body;
  } else { // else return an empty dummy json, doesn't really work here
    return '[{"id": "", "userId": "", "userName": "", "type": { "name": "" }, "date": {' +
    '"startDate": "", "endDate": "", "startTime": "", "endTime": "" }   }]'; }
}

private handleError(error: Response | any) {
  console.log('Errorhandling triggered'); 
  let errMsg: string;
  if (error instanceof Response) {
    console.log('Errorhandling if-block'); // this triggers on a 404
    const body = error.json() || '';
    const err = body.error || JSON.stringify(body);
    errMsg = `${error.status} - ${error.statusText || '' } ${err}`;
  } else {
    errMsg = error.message ? error.message : error.toString();
  }
  console.error('Error ', errMsg); // this never appears in the log though
  return Observable.throw(errMsg);
}

我的目标是捕获404错误,而不是让它抛出我之前发布的JSON.parse错误,并通过发送空的json对象(或虚拟的json对象)来处理它,以便日历中的日期仅显示空白。
1个回答

5

您的问题出在这行代码上

const body = error.json() || '';

问题在于,当您的后端发送错误(此处为404)时,您没有发送JSON对象。因此,如果您使用了error.json(),请不要期望得到JSON对象!

要么您从后端返回JSON错误,要么您不在错误处理程序中使用json()函数。

如果您不使用json()函数,您还可以访问status属性(如果我记得正确),其中包含错误代码。因此,您可以对其进行条件判断,例如如果它是404,则执行您想要的操作。

希望我表达清楚了,如果没有,请随时要求更多细节!


我直接从Angular.io中使用了handleError函数的一部分,认为它应该没问题...会在那个区域进行一些实验。 - m41n
当我刚开始时,我也这样做了,但你必须考虑到响应高度取决于你的后端,并且(至少对我来说)在出现错误时很少考虑发送JSON对象。 - user4676340
似乎测试错误状态作为字符串可以工作,所以我似乎能够在这里捕获它并在我的组件中进一步处理它。此时,我相信这将是我需要的解决方案,因此感谢您。 - m41n
尝试使用 console.log(error) 并查看您可以使用哪些字段。别担心,这既不是修复也不是解决方法,Response 对象就是用来这样使用的,您会发现它们甚至有一个 _body,实际上是由 json() 函数返回的 JSON。 - user4676340

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接