首页 文章

从节点服务器到Angular客户端的响应未定义第一次(仅)特定请求

提问于
浏览
0

我有一个问题,我的Angular前端从我的Node服务器返回一个'undefined'响应对象 .

对于初学者,用户对餐馆名称发出GET请求,服务器返回一组可能的名称 . 单击某个名称时,将使用唯一ID从服务器发出另一个GET请求以获取更多信息 . 这是第一次在问题出现时提出第二次GET请求 .

响应对象已定义并且看起来很好(因为我有控制台 . 在每一步都记录它),直到返回到services.js中的getLocationResults函数,它突然未定义 .

所以services.js中的getLocationResults:

var getLocationResults = function(id){
    return $http({
      method: 'GET',
      url: '/api/location/' + id
    })
    .catch(function(err){
      console.log('Error in services: ', err, 'config(req): ', err.config);
         //logs “Error in services: Object {data: null, status: -1, config:
         //Object, statusText: ""} “
    })
    .then(function(resp){
      console.log('Response in getLocationResults: ', resp)
    //logs “Response in getLocationResults:  undefined”
      return resp.data;
    })
  };

通过以下路由向服务器发出$ http请求:

router.get('/location/:id', function(req, res){
  var results = Results.findByLocationId(req.params.id)
  .then(function(response){
    console.log('Response IN API: =========', response);
    res.send(response);
  })
});

到这个查询外部API的模型:

Results.findByLocationId = function(id){
  var baseUrl =  'https://data.austintexas.gov/resource/nguv-n54k.json?  
  facility_id=' + id
  var options = {
    url: baseUrl,
    'X-App-Token': appToken
  };
  return new Promise(function(resolve, reject){
    request.get(options,
    function(error, response, body){
      if(error) {
        console.log("Error!", error);
        return error
      } else {
        response.body = JSON.parse(body);
        console.log('LOCATION response-body-length: ', response.body.length)
        resolve(response.body);
      }
    });
  });
}

服务器端的响应很好,但在我的路由中获取 . ('/ location',function(req,res))和services.js中的getLocationResults之间不知何故 . res.send(响应)函数在其他路由中可以正常工作,所以我假设它可以在这里使用 .

其中一个奇怪的部分是,在我收到此错误后,如果我尝试为此facility_id发出请求或再次搜索另一个,则请求会像它应该的那样通过 . 我不知道为什么只有在我第一次提出请求时才会抛出此错误 .

第二个奇怪的部分是,对于此请求,服务器端模型或路由没有什么不同于之前必须首先搜索邮政编码结果或餐馆名称结果的请求 . 这就是我的服务文件中getNameResults的样子:

var getNameResults = function(name){
   return $http({
     method: 'GET',
     url: '/api/name/' + name
    })
    .catch(function(err){
  console.log('Error in services: ', err)
})
.then(function(resp){
  return resp.data
 });
};

我为什么第一次回复getLocationResults的想法是未定义的,但是接下来的请求/响应是否正常?谢谢!

编辑(包含XHR日志记录):

当导致错误的GET请求时,它会在控制台中登录:

angular.js:11756 
XHR failed loading: GET "http://localhost:8080/api/location/10835756".
v
(anonymous function) @ angular.js:11756
sendReq @ angular.js:11517
serverRequest @ angular.js:11227
processQueue @ angular.js:15961
(anonymous function) @ angular.js:15977
Scope.$eval @ angular.js:17229
Scope.$digest @ angular.js:17045
Scope.$apply @ angular.js:17337
(anonymous function) @ angular.js:25023
defaultHandlerWrapper @ angular.js:3456
eventHandler @ angular.js:3444

然后在Chrome开发工具中,在选择XHR的网络选项卡下:

唯一的请求是search.html,这是我的主页和Angular中的.otherwise路由 . 这是日志:

XHR

“响应”选项卡只显示“未能加载响应” .

error.config:Object {method:“GET”,transformRequest:Array [1],transformResponse:Array [1],url:“/ api / location / 10835756”,headers:Object}

是否有可能在searchCtrl中错误地使用$ location.path?

this.findByLocationId = function(id){
    console.log('ResultsCtrl in findByLocationId: ', id)
    $routeParams.id = id;
    Search.getLocationResults(id)
    .then(function(inspections){
      console.log('Funky Cold Medina') // doesn't log
      ResultService.inspections = inspections;

    })
    .then(function(){
      $location.path('/location');
    })
  }

1 回答

  • 0

    如果服务器的响应是未定义的响应,则需要在发生错误时发布Chrome收到的确切响应,以便我们可以看到发生了什么 .

    在chrome Dev工具中启用XHR日志记录,当您看到失败的请求时,通过单击该条目并在网络选项卡下再次向下钻取它 .

    您将在此处看到浏览器所具有的确切对话,请确保在响应选项卡下您的服务器没有任何有趣的内容 . 也发布给我们分析 .

    enter image description here

相关问题