Angularjs 如何对 $http 调用进行正确的错误处理？

Posted 2023-02-19

【中文标题】Angularjs 如何对 $http 调用进行正确的错误处理？

【英文标题】：Angularjs how to do proper error handling for $http call?

【发布时间】：2021-09-09 00:25:04

【问题描述】：

我的控制器变空或 undefined 数据从服务传回，这反过来又导致控制器出现错误，因为无法处理 undefined 结果。我正在重新阅读有关错误处理的材料，并且开始怀疑我的错误处理是否不完整。由于我的控制器正在获取响应，但响应为空/未定义，因此这意味着我的服务仍在传回错误响应....但基于我的服务，我认为应该使用 catch 处理它。如何解决此问题，以便我的服务处理错误并仅将正确的数据传回控制器？

控制器：

.controller('listCtrl', function($scope,listService) 

listService.getList(1)
.then(function(res) 
  if (res.list!= null)    // <--- `Exception: Cannot read property 'list' of undefined`
     ...
     ...
   else 
     ...
     ...
  
) ;

服务：

.factory("listService", function($http,$q) 
  // errMgmt 5100

  var headers= ;
  var listMain = [] ;  // Current Lists
  var listPast = [] ;  // Past Lists


  function setVars() 
    baseUrl = "https://api.mydomain.com/v1/index.php" ;
    headers = 
      'Pragma':'no-cache', 
      'Expires': -1, 
      'Cache-Control':'no-cache,no-store,must-revalidate', 
      'Content-Type' : 'application/json',        
      'X-Requested-With':'com.mydomain',
      Authorization: 'Token ' +clientToken
     ;
  
      

  function getList(typeID) 
    if (typeID == 1) 
      listMain = [] ;
     else if (typeID == 2) 
      listPast = [] ;
    
    setVars() ;
    var dataObj = ["type":typeID,"userID":userData.user_ID] ;
    var req = 
      method: 'POST',
      url: baseUrl,
      timeout:httpTimeout,
      headers: headers,
      data: JSON.stringify(dataObj)
    
     return $http(req)
    .then(function(response)
      if (typeID == 1) 
        listMain = response.data[0] ;  <-- Error happening, but being processed in success
        return listMain ;
       else if (typeID == 2) 
        listPast = response.data[0] ;
        return listPast ;        
      
    ).catch(function(err) 
      var msg = setError(err) ;
      errMgmt("services/getList",5100,msg) ;
    );
  

  return 
    getList: function(typeID)   // typeID : 1=current lsit, 2=past list
      return getList(typeID) ;
    
 )

我已经阅读了各种各样的内容，但引起我注意的是我的服务可能需要定义为：

return $http(req) 
.then(function(success)    
   // success response
,function(error1) 
   // error response
).catch(error2) 
   // catch all
) ;

如果是这种情况，那么 function(error1) 与 .catch(error2) 之间究竟有什么区别 - 每个过程具体是什么？

【参考方案1】：

尝试使用 success() 和 error() 调用 $http

.factory("listService", function($http,$q) 
  // errMgmt 5100

  var headers= ;
  var listMain = [] ;  // Current Lists
  var listPast = [] ;  // Past Lists


  function setVars() 
    baseUrl = "https://api.mydomain.com/v1/index.php" ;
    headers = 
      'Pragma':'no-cache', 
      'Expires': -1, 
      'Cache-Control':'no-cache,no-store,must-revalidate', 
      'Content-Type' : 'application/json',        
      'X-Requested-With':'com.mydomain',
      Authorization: 'Token ' +clientToken
     ;
  
      

  function getList(typeID) 
  
    if (typeID == 1) 
      listMain = [] ;
     else if (typeID == 2) 
      listPast = [] ;
    
    setVars() ;
    var dataObj = ["type":typeID,"userID":userData.user_ID] ;
    var req = 
      method: 'POST',
      url: baseUrl,
      timeout:httpTimeout,
      headers: headers,
      data: JSON.stringify(dataObj)
    

    $http(req).success(function(data, status) 
    
    if (status == 200) 
    
      alert(data);
      if (typeID == 1) 
        listMain = data ;  
        return listMain ;
       else if (typeID == 2) 
        listPast = data;
        return listPast ;        
             
      
    
    ).error(function(data) 
    
      alert(data);
    );   
  

  return 
    getList: function(typeID)   // typeID : 1=current lsit, 2=past list
      return getList(typeID) ;
    
 )