Как обрабатывать XML-службы в AngularJS?


моя компания имеет тысячи существующих xml-веб-сервисов и начинает принимать AngularJs для новых проектов.

учебник закончился в http://angularjs.org/ использует исключительно службы json. Похоже, что они делают вызов службы в контроллере, анализируют полученный JSON и передают полученный объект непосредственно в представление.

Что мне делать с XML? Я вижу четыре варианта:

  1. проанализируйте его и передайте объект DOM напрямую в пользовательский интерфейс (представление).

  2. поместите оболочку JSON вокруг моих XML-служб на стороне сервера.

  3. преобразуйте объект DOM в JSON с некоторой библиотекой на стороне клиента и преобразуйте его обратно, когда я делаю запросы post/put.

  4. преобразование объекта DOM в объект JavaScript вручную на стороне клиента.

какой правильный подход и почему?

5 52

5 ответов:

Если вариант 2 относительно прост для вас (например, добавление однострочных преобразований JSON в ваших внутренних контроллерах, например), то это, вероятно, хорошая инвестиция, поскольку JSON более склонился над проводом, гораздо меньше работает на стороне клиента и обычно предпочитается потребителями RESTful API (в случае, если есть другие потребители).

недавно делал такую работу, я бы сказал, что следующий лучший путь (если Вариант 2 сложно) будет использовать ответ и запрос трансформаторы для выполнения преобразований между вашими объектами XML и JavaScript, что является вариацией где-то между вашими вариантами 3 и 4. Объект DOMParser-это собственный код, поэтому он анализирует XML достаточно быстро. Преобразование XML DOM в объекты JavaScript и создание XML из объектов JavaScript-это довольно простые рекурсивные алгоритмы. Этот подход отделяет весь остальной код на стороне клиента от внутреннего представления, что было бы не так, если бы вы пошли с вашим вариантом 1. Такая развязка позволит вам напрямую использовать интерфейс RESTful на основе JSON, если такая возможность возникнет.

выбор любого параметра, который включает объекты JSON / JavaScript, часто будет связан с проблемами несоответствия импеданса, такими как атрибуты XML, коллекции XML и массивы JS и представление смешанного содержимого XML. Если ваши модели данных достаточно просты, или вы не возражаете жить с решениями, предоставляемыми готовыми трансформаторами между XML и JSON (например, избыточное содержание объекта, нумерованные текстовые свойства для представления непересекающегося текста, смешанного с элементами), то это может не быть проблемой для вас. В противном случае есть возможности для настройки поведения преобразования на любом конце запроса императивно (хотя, к сожалению, не декларативно, насколько я видел).

Я бы рекомендовал вам иметь xml в json конвертер. Вот один из них.

https://code.google.com/p/jquery-xml2json-plugin/

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

У меня была та же проблема. В конечном итоге сделал небольшой модуль, чтобы превратить все мои ответы XML в ng.элемент объекта.

https://github.com/johngeorgewright/angular-xml

Я нахожу x2js работает довольно хорошо:https://code.google.com/p/x2js/

клиент принимает в XML, не нужно возиться с угловыми службами. Простое быстрое преобразование и, вуаля, у вас есть JSON API, который имитирует XML-документ. Кажется, я позаботился обо всех случаях использования, с которыми столкнулся.

Я создал сервис под названием HttpService имея функцию с именем getRequestedContent в котором я использую угловой http-вызов на мой сервис"http://localhost:8080/showserverstartupinfo", который возвращает XML следующим образом:

<SERVERSTARTUPINFO>
<SERVERNAME>########</SERVERNAME>
<SERVERSTARTUPTIME>##########</SERVERSTARTUPTIME>
</SERVERSTARTUPINFO>

...и я разбираю выше xml и заполнить мой div с содержанием xml-элемента.

HttpService.getRequestedContent('/showserverstartupinfo').then(
  function(content) {
    //successCallback
    var xml = content.data;
    document.getElementById('serverName').innerHTML = 
          xml.getElementsByTagName("SERVERNAME")[0].childNodes[0].nodeValue;
  }, function(data) {
    //errorCallback
});

getRequestedContent функция в HttpService (Angularjs) следующим образом:

getRequestedContent : function(request) {
  var url = this.getRootContextPath() + request;
  return $http({
    method : 'GET',
    url : url,
    transformResponse : function(data) {
      return $.parseXML(data);
    }
  });
}