Node.jsとHTML間でのcsv読み込みの互換性

Question

htmlファイルでできていたjavascriptの操作をjade内で同様に行いたいのですが、node.jsの設定の問題なのか同じようにできないでいます。
htmlファイルでは、

function change2(){
    change();
    var chane=document.formA.test1.selectedIndex;
    var x=document.getElementById("lay_ser");
    x.style.display="";
    /*この2行はz-index制御関係*/
    var num=[0,50,100,150,200,250,300,350,400,450,500];

/* ここからcsv読み込み */

function getCSVFile() {
    var xhr = new XMLHttpRequest();
    xhr.onload = function() {
    createArray(xhr.responseText);
    };
 
    xhr.open("get", "main.csv", true);
    xhr.send(null);
}
getCSVFile();

function createXMLHttpRequest() {
    var XMLhttpObject = null;
    XMLhttpObject = new XMLHttpRequest();
    return XMLhttpObject;
}

/* csv読み込みはここまで。ここからデータ制御 */

function createArray(csvData) {
    var tempArray = csvData.split("\n");
    var csvArray = new Array();
    for(var i = num[chane]; i<num[chane+1]-1;i++){
    csvArray[i] = tempArray[i].split(",");
    if(csvArray[i][0]>num[chane]){
    var ele = document.createElement('div');
    ele.className='ids';
    ele.id='id'+i;
    ele.name='id'+i;
    ele.innerHTML = '<p>貴団体はID:<a id="id_id_'+i+'">'+csvArray[i][1]+'</a> 団体名:<a id="id_kikaku_'+i+'">'+csvArray[i][2]+'</a>で、区分は'+csvArray[i][3]+'となります。 <input type="button" class="btn_ids" id="btn_id_'+i+'"  value="選択"></p>';
    var p_obj = document.getElementById("kikakubox1");
    p_obj.appendChild(ele);
    eval("function addition"+i+"(){var number=document.getElementById('id_id_"+i+"'); /*console.log(number.innerHTML);*/ var title=document.getElementById('id_kikaku_"+i+"'); /*console.log(title.innerHTML);*/ var el_1= document.createElement('div'); el_1.className='selected'; el_1.id='kikaku_id_1_"+i+"'; el_1.innerHTML = '<p>ID:'+number.innerHTML+' 団体名:'+title.innerHTML+'</p>';var d_obj = document.getElementById('checkbox1'); d_obj.appendChild(el_1);  var el_2= document.createElement('div'); el_2.className='selected'; el_2.id='kikaku_id_2_"+i+"'; el_2.innerHTML = '<p>ID:'+number.innerHTML+' 団体名:'+title.innerHTML+'</p>'; var e_obj = document.getElementById('checkbox2'); e_obj.appendChild(el_2); var el_3= document.createElement('div'); el_3.className='selected'; el_3.id='kikaku_id_3_"+i+"'; el_3.innerHTML = '<p>ID:'+number.innerHTML+' 団体名:'+title.innerHTML+'</p>'; var f_obj = document.getElementById('checkbox3'); f_obj.appendChild(el_3); var Array"+i+"=[number.innerHTML,title.innerHTML]; vote.push(Array"+i+"); var box=document.getElementById('Arraybox'); box.innerHTML=vote; console.log(vote.length);}");
    eval('var Btn_id_'+i+' = document.getElementById("btn_id_'+i+'")');
    eval('Btn_id_'+i+'.addEventListener("click",addition'+i+')');
    }
    }
}
}

というコードで(これはネット上でよく落ちてるやつですが…)読み込み+csvデータの出力を実行していたのですが、node.js内でやろうとするとcsvファイルが読み込まれないのです。
どなたか解決方法を教えていただけないでしょうか。宜しくお願いします。

Answer 1

「scriptタグ作ってベタ書きしていたJavaScriptを含む」HTMLをJadeにコンパイルしようとしたがうまくいかない
…という質問内容ですか？

script.
  function change2(){
  // ...以下略

こんな風にタグ名の後に.をつけてあげると、
以下インデントされた内容は全てただの文字列として内包されます。

Comments

[KF_sys67_n]

いえ、スクリプトそのものは別のファイルに入ってますし、読み込まれていることも確認済みです。ただその過程でcsvファイルが読み込まれないというところが問題なのです。

[miyabi-sun]

上記のJavaScriptをNode.jsにペタッと貼り付けたけど動かないってことなのですか？
それだとJadeはどこで使われるのでしょうか？

[KF_sys67_n]

jadeファイル(layout.jade)でjsの読み込みを書いているということです。紛らわしい書き方ですいません。

[miyabi-sun]

うーん、なんとなくわかってきました。
HTML版：HTML生成→ブラウザ読み込む→Ajax通信でCSVを受け取る→「解析」
Jade版：node.jsでHTML出力中→Jadeテンプレートの箇所→どうせ鯖で動いてるんだからCSVここで動かしちゃえ→HTMLとして加工→ブラウザで解析した時に値がないよ？

…こんな感じの流れですか？
だとすればAjax(XMLHttpRequest)はブラウザに依存しているので、
Node.jsで動作させた時に動きません。
サーバーにあるならfs、httpリクエストを飛ばすならhttpモジュールがあるので、require("fs");などとして呼び出しましょう。

こんな感じでどうでしょう？

[KF_sys67_n]

だいたいそんな感じの流れです！
fsとかhttpモジュールについては殆ど知識がないので、差し支えなければ教えていただけると幸いです。取りあえずそれで試してみます！
ありがとうございます！