Как обрабатывать XML-услуги в AngularJS?
Моя компания имеет тысячи существующих веб-сервисов xml и начинает принимать AngularJs для новых проектов.
В учебном пособии http://angularjs.org/ используются исключительно сервисы json. Похоже, они выполняют вызов службы в контроллере, анализируют полученный JSON и передают результирующий объект непосредственно в представление.
Что мне делать с XML? Я вижу четыре варианта:
-
Разберите его и передайте объект DOM непосредственно в пользовательский интерфейс (view).
-
Поместите JSON-обертку вокруг моих XML-сервисов на стороне сервера.
-
конвертировать объект DOM в JSON с некоторой библиотекой на стороне клиента и преобразовывать его обратно, когда я делаю запросы post/put.
-
Преобразуйте объект DOM в объект JavaScript вручную на стороне клиента.
Какой правильный подход и почему?
Ответы
Ответ 1
Если вариант 2 относительно прост для вас (например, добавление однострочных конверсий JSON в ваших back-end контроллерах, например), то это, вероятно, хорошая инвестиция, поскольку JSON более гибкий по отношению к проводу, гораздо меньше работает на клиентской стороне и обычно предпочитают потребители API RESTful (в случае, если есть другие потребители).
Недавно проделав такую работу, я бы сказал, что следующий лучший путь (если вариант 2 сложный) будет заключаться в использовании ответа и запроса transformers для выполнения преобразований между вашими XML-объектами и объектами JavaScript, что является вариантом где-то между вашими вариантами 3 и 4. Объект DOMParser - это собственный код, поэтому он быстро анализирует XML. Преобразование XML DOM в объекты JavaScript и генерация XML из объектов JavaScript - это довольно простые рекурсивные алгоритмы. Этот подход отделяет весь остальной код вашего клиентского кода от внутреннего представления, чего не было бы, если бы вы пошли с вашим вариантом 1. Такая развязка позволит вам напрямую использовать интерфейс RESTful на основе JSON, если такая возможность возникнет.
Выбор любой опции, которая включает объекты JSON/JavaScript, часто будет включать проблемы несоответствия импеданса, такие как атрибуты XML, коллекции XML и массивы JS и смешанное представление XML. Если ваши модели данных достаточно просты или вы не против жить с решениями, поставляемыми из готовых трансформаторов между XML и JSON (например, избыточное размещение объектов, нумерованные текстовые свойства для представления непересекающегося текста, смешанного с элементами), то это не может быть проблемой для вас. В противном случае есть возможности для настройки поведения трансформации в любом конце запроса императивно (хотя, к сожалению, не декларативно, насколько я видел).
Ответ 2
Я бы порекомендовал вам конвертер xml to json. Вот один из них.
https://code.google.com/p/jquery-xml2json-plugin/
После преобразования у вас есть обычный объект JS, в котором вы можете использовать ваши обычные директивы angular для их анализа и использовать их по своему усмотрению.
Ответ 3
У меня была та же проблема. Закончилось создание небольшого модуля, чтобы превратить все мои ответы XML в объект ng.element.
https://github.com/johngeorgewright/angular-xml
Ответ 4
Я нахожу, что x2js работает достаточно хорошо: https://code.google.com/p/x2js/
Клиент берет XML, не нужно возиться со службами angular. Простое быстрое преобразование и, вола, у вас есть JSON API, который имитирует XML-документ. Кажется, нужно заботиться обо всех случаях использования, с которыми я столкнулся.
Ответ 5
Я создал службу с именем HttpService
, имеющую функцию под названием getRequestedContent
, в которой я использую angular 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);
}
});
}