Arhn - архитектура программирования

Ответ от сервера Node к клиенту Angular undefined в первый раз (только) выполняется конкретный запрос

У меня возникла проблема, когда мой интерфейс Angular возвращает «неопределенный» объект ответа с моего сервера Node.

Для начала пользователь делает запрос GET на название ресторана, сервер возвращает массив возможных названий. При нажатии на имя и использовании уникального идентификатора для выполнения другого запроса GET для получения дополнительной информации с сервера. Это первый раз, когда второй запрос GET делается там, где возникает проблема.

Объект ответа определен и выглядит нормально (поскольку я записал его в console.log на каждом этапе пути), пока он не вернется к функции getLocationResults в services.js, где он внезапно становится неопределенным.

Итак, getLocationResults в services.js:

  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);
      }
    });
  });
}

Ответ в порядке на стороне сервера, но каким-то образом теряется между get.(‘/location’, function(req, res){…}) в моих маршрутах и ​​getLocationResults в services.js. Функция res.send(response) безотказно работает на других маршрутах, поэтому я предполагаю, что ее можно использовать здесь.

Одна из странных частей заключается в том, что после получения этой ошибки, если я попытаюсь сделать запрос для этого объекта_идентификатора или снова выполнить поиск другого, запрос будет выполнен так, как должен. Я понятия не имею, почему эта ошибка возникает только при первом запросе.

Вторая странная часть заключается в том, что модель на стороне сервера или маршрутизация для этого запроса ничем не отличаются от предыдущего запроса, который необходимо сначала выполнить для поиска результатов либо по почтовому индексу, либо по названию ресторана. Вот как выглядит 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 Dev на вкладке «Сеть» с выбранным XHR:

Единственный существующий запрос — это запрос к search.html, который является моей домашней страницей и маршрутом .otherwise в Angular. Вот журнал:

XHR

На вкладке «Ответ» просто написано «не удалось загрузить ответ».

error.config: Object {метод: «GET», transformRequest: Array[1], transformResponse: Array[1], url: «/api/location/10835756», заголовки: Object}

Возможно ли, что я неправильно использую $location.path в моем searchCtrl?

  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');
    })
  }

  • Просто говорю, что вы должны не return error, а reject(error) в этом обратном вызове 18.05.2016
  • Когда ошибка регистрируется в .catch(function(err){ console.log('Error in services: ', err, 'config(req): ', err.config); }), этот обработчик ошибок действительно возвращает undefined, что является значением, которое вы получаете дальше по цепочке. 18.05.2016

Ответы:


1

Если ответ от вашего сервера — это источник неопределенного, вам необходимо опубликовать точный ответ, полученный Chrome, когда произойдет ошибка, чтобы мы могли видеть, что там происходит.

В инструментах Chrome Dev включите ведение журнала XHR, и когда вы увидите неудачный запрос, разверните его, щелкнув запись и снова на вкладке сети.

Здесь вы увидите точный разговор, который был в браузере, убедитесь на вкладке ответа, что ваш сервер не выдает ничего смешного. Также опубликуйте это для нас, чтобы проанализировать.

введите здесь описание изображения

18.05.2016
  • Я думаю, что добавил все, что вы упомянули (и теперь у меня есть регистратор XHR в моем наборе инструментов, спасибо за это). Я не уверен, почему эта ошибка вызывает загрузку представления search.html. URL-адрес 'localhost:8080/location#' после ошибки. 18.05.2016
  • Спасибо за дополнительную информацию, не могли бы вы опубликовать содержимое вкладки "Ответ" или щелкнуть ссылку на источник рядом с заголовками ответа. 18.05.2016
  • Сделанный! Содержимое ответа — это HTML-код для представления поиска (содержащийся в файле search.html). 18.05.2016
  • Вы уверены, что разместили правильный ответ? ранее в вашем сообщении конечная точка была: localhost:8080/api/location/10835756. Запрос XHR Я ясно вижу, что запрос направлен на: localhost:8080/views/search.html Также мы не ожидаем данных JSON от веб-сервиса для вашего приложения Angular, потому что вы выполняете JSON.parse(body); 18.05.2016
  • Также метод $http ожидает данные JSON или Object. Если вы хотите анализировать другие данные, вам необходимо перезаписать метод transformResponse $http: https://docs.angularjs.org/api/ng/service/$http 18.05.2016
  • Не могли бы вы обновить информацию в своем ответе, указав конечную точку localhost:8080/api/location/10835756. 18.05.2016
  • Добавлен правильный журнал XHR, вкладка «Ответ» пуста и просто говорит «Не удалось загрузить ответ». 18.05.2016
  • Итак, мы знаем, что нет ответа от сервера. Какой веб-сервер вы используете.? У вас есть правильные правила перезаписи для этого URL-адреса? Можешь посмотреть логи, а также попробовать включить отображение ошибок 18.05.2016
  • Давайте продолжим это обсуждение в чате. 18.05.2016
  • Новые материалы

    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..