node.jsに複数のファイルを同期的にロードする

Question

私はnode.jsを学習しており、MVCアーキテクチャを中心にマイクロアプリケーションを構築しています。

URIに基づいてコントローラをロードするrouter.jsファイルがあります。これは、ほとんどの場合、「fs」モジュールを使用してビューをロードします。ビューは、Webページ（基本的にhead、body、&フッター）を構成するHTML要素で、という3つのファイルとして表示されます。ここで

は、コントローラのコードです：

var load_view = 'test.html'; 

function data(response, request, fs){ 

    response.writeHead(200, {"Content-Type": "text/html"}); 

    var count = 0; 
    var handler = function(error, content){ 

     count++; 
     if(error) console.log(error); 
     else  response.write(content); 

     if(count==3) response.end(); 

    } 

    fs.readFile('view/elements/head.html', handler); // should load 1st 
    fs.readFile('view/'+load_view, handler);   // should load 2nd 
    fs.readFile('view/elements/footer.html', handler);// should load 3rd 

} 

exports.data = data; 

あなたはHTML要素が（head.html、このコントローラの後、特定のビューの順序でロードするようになっている見ることができるように - test.htmlという、その後、 footer.html）。しかし、時にはそうではありません。

ほとんどの場合、頭、体、フッターの順番で読み込まれます。

「ヘッド、フッタ、ボディ」としてロードされることがあります。

「ボディ、ヘッド、フッタ」

他の設定ではロードされません。

添付のスクリーンショットをご覧ください。

イムここで何が起こっているのかわかりません。これらのファイルは、順番どおりに読み込まれますが、読み込まれるのはなぜですか？

• 私はintentiallyあなたが非同期要求に対する応答の順序についての仮定をすることはできません目的

Answer 1

を学ぶためExpress.jsのようなフレームワークを使用しておりませんのでご注意ください。この順序付けに影響を及ぼす可能性のある様々な要因が存在する（例えば、ファイルシステム要求の場合のOSスレッドスケジューリング）。

だから、これを解決するには、コールバックをネストや約束を連鎖するかasyncのようなモジュールを使用してシリアルにそれらを呼び出すか、あなたは自分のコールバックにロードされてしまったファイルを知っているので、関連するコンテキスト情報を含めるようにコールバックをバインドするかのいずれかです。後者の例のようなものかもしれません：

関連ノートで

function data(res, req, fs) { 
    // Files to be loaded, in the order to be written to the response 
    var files = [ 
    'view/elements/head.html', 
    'view/' + load_view, 
    'view/elements/footer.html' 
    ]; 

    // Start read requests, each with a callback that has an extra 
    // argument bound to it so it will be unshifted onto the callback's 
    // parameter list 
    for (var i = 0; i < files.length; ++i) 
    fs.readFile(files[i], handler.bind(null, i)); 

    var count = 0; 
    function handler(index, err, content) { 
    // Make sure we don't send more than one response on error 
    if (count < 0) 
     return; 

    if (err) { 
     count = -1; 
     console.log('Error for file: ' + files[index]); 
     console.log(err); 
     res.writeHead(500); 
     return res.end(); 
    } 

    // Reuse our `files` array by simply replacing filenames with 
    // their respective content 
    files[index] = content; 

    // Check if we've read all the files and write them in order if 
    // we are finished 
    if (++count === files.length) { 
     res.writeHead(200, { 'Content-Type': 'text/html' }); 
     for (var i = 0; i < files.length; ++i) 
     res.write(files[i]); 
     res.end(); 
    } 
    } 
} 

、あなたがやって回避するために、いくつかの種類のテンプレートシステムを（つまり、ヘッダーとフッターのようなパーシャル（）やレイアウトなどのサポート）を使用してに見えるかもしれませんこの種の手動作業。