0

自分のサイトでのユーザー アクティビティに基づいて、自分のページのセクションの HTML を取得するために、サーバーへの jQuery Ajax 呼び出しがあります。サーバーからレンダリングされた HTML に加えて、いくつかの JSON データが必要であることがわかりました。クライアントがレンダリングした HTML および JSON データに戻る最善の方法は何ですか? 私は3つの異なるオプションがあると考えています：

  1. JSON データのサーバーに 2 回目の呼び出しを行います。これには 2 回目の往復が含まれます。次を使用して、複数の ajax 呼び出しを文字列化できます。

    $when(call_1, call_2).done(function(results_1, results_2){...}))

  2. レンダリングされた html が dom に追加されると呼び出されるレンダリングされた html にスクリプト ブロックを含めます。

    ... rendered html output ...
$(document).ready(function ()
{
    alert('data here');
});

  3. 何らかの方法でレンダリングされたhtmlを呼び出しから返されたjsonに埋め込み、JS関数を呼び出してレンダリングされたhtmlをJSONから分離し、それに応じてDOMを更新します。このオプションはただ臭いです。

より良いアプローチのように思われるため、追加のサーバーヒットですが、オプション1に傾いています。あなたの意見では、どちらのアプローチが優れていますか? 私が考えていない別の方法はありますか？

ありがとう

4

2 に答える 2

1

まず、サーバー側で HTML をエンコードします。次のようにします。

function HTMLEscape(str) {   //Javascript code, adjust as per your server-side lang
    return String(str)
        .replace(/&/g, '&')
        .replace(/"/g, '"')
        .replace(/'/g, ''')
        .replace(/</g, '&lt;')
        .replace(/>/g, '&gt;');
}

ここで、クライアント側で次の JSON 応答を受け取ったとします。

data = {
     html: "&lt;div&gt;Text goes here&lt;/div&gt;&lt;script type=&#39;text/javascript&#39;&gt;alert(&#39;text goes here too&#39;)&lt;/script&gt;",
     status: 1,
     some: 'stuff'
};

Ajax が完了したら、JSON の展開を開始します。

ResultJSON = data;

$("div#destination").html(HTMLUnescape(ResultJSON.html));
$("input#status").val(ResultJSON.status)

最後に、この Javascript 関数を .js ファイルのどこかに隠します。

function HTMLUnescape(str) {
    return String(str)
        .replace(/&amp;/g, '&')
        .replace(/&quot;/g, '"')
        .replace(/&#39;/g, "'")
        .replace(/&lt;/g, '<')
        .replace(/&gt;/g, '>');
}

それが役に立てば幸い。(-:

于 2012-10-16T06:25:58.533 に答える
0

オプション 1 の方が優れています。こんなことも考えられますが、

html に送信された json ディクショナリに、すべてのデータと html コンテンツを含めます。このようなもの、

{
'html':"<div>this is new html</div>",
'var1':'var1 value',
'var2':'var2 value'
}
于 2012-10-16T06:05:11.933 に答える