web-dev-qa-db-ja.com

JSON応答にHTMLマークアップを含める必要がありますか?

Eコマースサイトで、カートにアイテムを追加するときに、選択可能なオプションを含むポップアップウィンドウを表示したいと思います。あなたがiPod Shuffleを注文していて、刻印する色とテキストを選択する必要があるとします。

ウィンドウをモーダルにしたいので、Ajax呼び出しによって入力された lightbox を使用しています。今私は2つのオプションがあります:

オプション1:データのみを送信し、JavaScriptを使用してHTMLマークアップを生成する

これの良い点は、Ajaxリクエストをベアミニマムに削減し、データとマークアップを混合しないことです。

これについてそれほど優れていないのは、サーバー側にテンプレートエンジンを配置する代わりに、JavaScriptを使用してレンダリングを実行する必要があることです。 クライアント側のテンプレートソリューション を使用して、アプローチを少しクリーンアップできるかもしれません。

オプション2:HTMLマークアップを送信する

これの良い点は、残りのレンダリングタスク(Django)で使用しているのと同じサーバー側テンプレートエンジンを使用して、ライトボックスのレンダリングを実行できることです。 JavaScriptは、HTMLフラグメントをページに挿入するためにのみ使用されます。したがって、レンダリングはレンダリングエンジンに委ねられます。私には理にかなっています。

しかし、何らかの理由で、Ajax呼び出しでデータとマークアップを混在させることに抵抗があります。何が私を不安に感じさせるのか分かりません。つまり、すべてのWebページが提供されるのと同じ方法です(データとマークアップ)。

13
Mike M. Lin

JSONにはデータのみが含まれ、マークアップは含まれません。長期的には、サイトの他の部分でJSONデータを使用する可能性があるため、このアプローチはより拡張可能です。マークアップを含めると、同じデータを使用して別のテンプレートにデータを入力することが非常に難しくなります。

10
davidk01

リクエストでデータを送信し、jsでマークアップを構築します。もう1つの利点は、帯域幅の使用量が少なくなることです。これは個人的な好みの一種ですが、クライアント側のマークアップをサーバー側から遠ざけることはおそらくより良いアイデアです。私はDjango=ウェブサイトも持っています。私はいくつかのjson変数をページに配置するためにテンプレートシステムを使用し(1つ少ないajax要求を作成する)、マシンで開発するときにsrcファイルを使用します。すべてのクライアント側はExtJSで行われます。

3
pllee

あなたは両方の長所と短所について話したと思います。 DjangoビューからライトボックスのJavaScriptを生成する3番目のオプションを見てください。次に、JSONにデータを含めて、ビューごとに更新しますか?

すべてのテンプレートコードをJavaScript変数にラップし、クライアント側でJSONリクエストを受け取った後、JavaScriptでそれらを出力することができるはずです。

1
Ryan Gibbons

マークアップにはテンプレートエンジンを使用し、値を格納するために隠しフィールドをどこかに保持する必要があります。値はセレクターを使用してドキュメントで見つけることができます。

0
Alex