4

私は現在、メディア ファイルの URL に基づいて埋め込み可能なメディアを簡単に作成し、Javascript メソッドとイベントを使用して制御できる Javascript ライブラリを構築しています (Flash / Silverlight JW プレーヤーのようなものを考えてください)。

もちろん、Javascript ライブラリからすべての html タグを単純に cat して、それをブラウザーに送信することもできます。

function player(url) {
    document.write('<object type="foo"><param name="something" value="bar">' + 
    <param name="source" value=" + url + '/></object>');
}

しかし、これは非常に醜いやり方であり、数週間後に見直したときに判読不能な管理不能なコードを作成する傾向があると思います。

そのため、テンプレート ソリューションが適しているようです。EJS は AJAX を使用してテンプレートをロードするため、 EJSを探していました。これにより、テンプレートを HTML ページで直接管理するのではなく、別のファイルで管理できます。

それには 1 つの「落とし穴」があります: 私のライブラリは完全にクロスドメインである必要があります: ライブラリ自体は foo.com に配置でき、提供サイトは bar.com に配置できます。そのため、bar.com がライブラリを使用してメディア プレーヤーを追加したい場合、foo.com にあるテンプレートに対して AJAX 呼び出しを行う必要がありますが、これはブラウザーの同一生成元ポリシーのために機能しません。

私の知る限り、この問題を回避するために JSONP のようなものを使用してテンプレートを読み書きするライブラリはありません。

誰でもこの問題の解決策を教えてもらえますか?

4

2 に答える 2

3

私自身の質問に答えます。この問題を解決するには、JSONP を提供するサーバー側のソリューションが必要です。サーバー foo.com にテンプレートがあるとします。次のような要求に応答するサーバー側スクリプトを作成できます。

http://foo.com/template/bar.html?callback=cb

どちらが返されますか:

cb({
    "html" : "<p>i'm a template!</p>"
});

次に、任意のテンプレート言語を使用して、アプリでテンプレートを解析できます。

于 2011-02-09T23:54:21.993 に答える
0

この質問には非常に遅れていますが、KnockOut JS がサードパーティのテンプレート レンダリングに最適なソリューションであると信じるようになりました。JS をサードパーティの Web ページにロードする場合、Knockout を使用すると、HTML のセクション全体を「レンダリング」するテンプレートとして保持する必要なく、非常に簡単にデータを DOM に挿入できます (これは、口ひげを生やしたパラダイムです)。および同様の用途)。

コードは単純です。テンプレート化するサード パーティの Web ページ領域は次のとおりです。

<p>First name: <strong data-bind="text: firstName"></strong></p>
<p>Last name: <strong data-bind="text: lastName"></strong></p>

ノックアウト js ライブラリ自体をロードした後、いくつかのデータを javascript の「データ モデル オブジェクト」としてノックアウトに提示するだけで、残りの処理はノックアウトによって行われます。

// This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI
function AppViewModel() {
    this.firstName = "Bert";
    this.lastName = "Bertington";
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());

参考文献:

于 2014-10-19T22:31:02.693 に答える