正确处理 $http 调用 AngularJS 中的错误

Question

有没有一种很好的方法来捕获 Angular 中有关连接问题的错误？

服务 $http POST：

    dossierService.getDossier(uid)

    .then(function (result) {

        vm.dossier = result.dossier;

    }, function (error) {

        handleError(error)

    });//end dossierService.getDossier(uid)

如果有连接问题会返回错误：

POST http://192.168.25.1:8080/api/query net::ERR_CONNECTION_TIMED_OUT

如何向用户显示正确的消息，让他/她知道确切的错误是什么？

Answer 1

$http.post("/path", {data:"data"}).then(function(response){
    // do something with success response
}).catch(function(error) {

  console.log(JSON.stringify(error));
  $scope.myerror=error

});

在你看来……

<div ng-if="myerror!=null">
    {{myerror}} OR {{myerror.message}}
</div>

Answer 2

您可以使用 http 响应代码创建对象并链接消息。要抛出这些错误，您可以使用拦截器。

moduleError.factory('HttpErrorHandler', function (){
    return {
        401: 'You are not logged in',
        403: 'You do not have permissions'
    }
});



$httpProvider.interceptors.push(function($q, HttpErrorHandler) {
  return {
   'responseError': function(rejection) {
      console.log(HttpErrorHandler[rejection.status]);
  };
});

如果错误与此操作有关，请在您正在启动的地方启动错误。您可以使用正文中的对象为您的错误抛出代码 400，例如：

{
   code: 30002, //Thats your custom code
   message: 'My custom error message'
}

.

dossierService.getDossier(uid)

.then(function (result) {

    vm.dossier = result.dossier;

}, function (error) {

    if(error.status == 400){
      var my_error = JSON.parse(error.data);
      console.log(my_error.message);
    }

});

我认为这是一个很好的方法。