Express/Node.js：レスポンスとしてカスタムjavascriptをレンダリングする

Question

私のアプリケーションでは、いくつかのセッションと関連情報を要求するカスタムJavaScriptを送ることができるAPI（Googleマップのjavascript APIのようなもの）を提供する必要があります。 ）を応答として使用します。 javascriptを使用して、いくつかのグラフをUIにプロットします。私はテンプレートエンジンとしてJadeとExpressを使用しています。私は現在使用しているコードは次のとおりです。

app.use('/graph',function(req, res){ 
    //send out graph data 
    var var_name = req.session.var_name //fetch something from session 
    var graphData = fetchGraphData(req.query.graph); //function that fetches graph data 
    res.contentType("text/javascript"); 
    res.render(__dirname + '/views/graph.jade', { 
    title: "Title", queryStr: JSON.stringify({var_name: var_name, graphData: graphData }) 
    }); 
}); 

そしてヒスイのファイル：ヒスイが解析されるように回避策として

| some_var_name = { 
|  initGraph : function(divId){ 
|  //some code here 
|  var graphData = !{graphData} 
|  // do something        

、私は、|とヒスイファイルの各行を開始しましたテキストをプレーンテキストとして表示し、HTMLタグを追加しません！それは正常に動作しますが、これを行うクリーナーの方法はありますか？このソリューションは、Jade！を使用する場合と使用しない場合があります。

Answer 1

underscore templatesを調べる必要があります。私は、任意のテキスト出力を生成するために、それはいくらか清潔であると思う。 JadeはHTMLをレンダリングする目的で作られています。

また、MustacheまたはHandlebarsを試すこともできます。

あなたのコメントに基づいて、テンプレートのレンダリングにはres.renderを引き続き使用したいと思っています。 consolodate.jsは、すべての主要なテンプレートエンジンをExpressに追加します。 @TheHippoで言及されているアンダースコアテンプレート、ハンドルバー、口ひげ、ダストを含む。

Answer 2

ブラウザに送信する必要があるJavaScript関数を、テンプレートの外部にある別のモジュールで定義しようとする場合があります。これはおそらく「懸念の分離」の観点から正しい方法です。また、関数が別のモジュールで定義されている場合、関数はサーバーとブラウザーの両方で使用できます。

次に、テンプレートを呼び出す関数か、テンプレート内の右のtoString（）メソッドを使用して、関数を文字列に変換できます。これは、アンダースコア、EJS、およびdoTテンプレート試したの両方がアンダーとEJSだけでなく、最速のが、非常に汎用性のあるドットを使用して終了 - ）それをチェックアウト：

JSコード：

// if you send the same functions you may want to convert them to strings in advance 
var data = { 
    funcStr: func.toString(); 
}; 
res.render(view, data); 

テンプレート（DOT）：

<script type="text/javascript"> 
    func = {{= it.funcStr }}; 

    // now you can call it here if you want but I would use 
    // separate JavaScript files 
    func(); 
</script> 

を

私はそれを使用して、最初のページの読み込み時にページとともにブラウザにプリコンパイル済みのテンプレートを送信しますが、あなたのケースでも使用できると思います。

なぜ、別のJavaScriptモジュールにこれらの機能をすべてバンドルして通常のスクリプトファイルとしてロードできないのですか？