53

私の会社には何千もの既存のxmlWebサービスがあり、新しいプロジェクトにAngularJsを採用し始めています。

http://angularjs.org/にあるチュートリアルでは、 jsonサービスのみを使用しています。彼らはコントローラーでサービス呼び出しを行い、結果のJSONを解析し、結果のオブジェクトをビューに直接渡すようです。

XMLで何をしますか？4つのオプションがあります。

  1. それを解析し、DOMオブジェクトをUI（ビュー）に直接渡します。

  2. サーバー側のXMLサービスの周りにJSONラッパーを配置します。

  3. DOMオブジェクトをクライアント側のライブラリを使用してJSONに変換し、post/putリクエストを行ったときに元に戻します。

  4. クライアント側でDOMオブジェクトをJavaScriptオブジェクトに手動で変換します。

正しいアプローチとその理由は何ですか？

4

5 に答える 5

34

オプション2が比較的簡単な場合（たとえば、バックエンドコントローラーに1行のJSON変換を追加するなど）、JSONはネットワーク上でよりスリムになり、クライアント側での作業がはるかに少なくなるため、おそらく良い投資です。そして一般的にRESTfulAPIコンシューマーによって好まれます（他のコンシューマーがいる場合）。

最近この種の作業を行ったので、次善の方法（オプション2が難しい場合）は、応答と要求のトランスフォーマーを使用してXMLオブジェクトとJavaScriptオブジェクト間の変換を実行することです。これは、オプション3のどこかでのバリエーションです。 4. DOMParserオブジェクトはネイティブコードであるため、XMLを非常に高速に解析します。XML DOMをJavaScriptオブジェクトに変換することと、JavaScriptオブジェクトからXMLを生成することは、どちらもかなり単純な再帰アルゴリズムです。このアプローチでは、クライアント側の残りのすべてのコードをバックエンド表現から切り離します。これは、オプション1を使用した場合には当てはまりません。このような切り離しにより、JSONベースのRESTfulインターフェイスを直接使用できるようになります。 、そのような機会が発生した場合。

JSON / JavaScriptオブジェクトを含むオプションを選択すると、多くの場合、XML属性、XMLコレクションとJS配列、XML混合コンテンツ表現などのインピーダンス不一致の問題に対処する必要があります。データモデルが十分に単純な場合、またはXMLとJSONの間のすぐに使用可能なトランスフォーマーによって提供されるソリューションを使用してもかまわない場合（たとえば、冗長オブジェクトの包含、要素と混合されたばらばらのテキストを表す番号付きテキストプロパティ） 、それならこれはあなたにとって問題ではないかもしれません。それ以外の場合は、リクエストの両端で変換動作をカスタマイズする機会があります（ただし、私が見た限りでは、残念ながら宣言型ではありません）。

于 2013-03-19T05:39:58.783 に答える
16

xmlからjsonへのコンバーターを用意することをお勧めします。これが1つです。

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

変換後、通常のJSオブジェクトが作成され、通常の角度ディレクティブを使用してそれらを解析し、必要に応じて使用できます。

于 2013-03-19T10:15:49.833 に答える
16

私も同じ問題を抱えていました。最終的に、すべてのXML応答をng.elementオブジェクトに変換するための小さなモジュールを作成しました。

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

于 2013-05-03T22:52:43.587 に答える
11

x2jsが非常にうまく機能していることがわかりました：https ：//code.google.com/p/x2js/

クライアントはXMLを取り込み、Angularサービスをいじる必要はありません。簡単なクイック変換と、出来上がり、XMLドキュメントを模倣するJSONAPIがあります。私が遭遇したすべてのユースケースの世話をしているようです。

于 2014-03-03T20:07:10.433 に答える
0

次のようにxmlを返すサービス「 http：// localhost：8080/showserverstartupinfo 」への角度http呼び出しを使用してHttpServiceいるという関数を持つという名前のサービスを作成しました。getRequestedContent

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

HttpService（Angularjs）のgetRequestedContent関数は次のとおりです。

getRequestedContent : function(request) {
  var url = this.getRootContextPath() + request;
  return $http({
    method : 'GET',
    url : url,
    transformResponse : function(data) {
      return $.parseXML(data);
    }
  });
}
于 2016-08-03T05:25:41.340 に答える