ブラウザの更新時にデータが複製される - Nodejs

Question

私はMustacheとNodejsを使用して、自分のサイトのドロップダウンボックスにオプションのリストを読み込みます。ページがリフレッシュされるたびに、ドロップダウンボックスにデータの重複が表示されます。どのようにこれを防ぐことができます。私の質問がはっきりしていることを願っています

以下のhtmlコードスニペットでMustacheの使い方を確認できます。

<div class="cd-filter-block"> 
       <h4>Branches</h4> 
       <div class="cd-filter-content"> 
        <div class="cd-select cd-filters"> 
         <select class="filter" name="selectThis" type="radio" id="branches"> 
          {{#branches}} 
           <option>{{name}}</option> 
          {{/branches}} 
         </select> 
        </div> 
       </div> 
      </div> 

これはNodejsコードです。

var express = require('express'); 
var app = express(); 
var fs = require('fs'); 
var glob = require('glob'); 
var mustache = require('Mustache'); 
var mustacheExpress = require('mustache-express'); 

// Register '.mustache' extension with The Mustache Express 
app.engine('mustache', mustacheExpress()); 
app.set('view engine', 'mustache'); 
app.set('views', __dirname + '/views'); 
app.use(express.static('public')); 

//mustache templates 
app.get('/', function(req, res){ 
    var view = { 
     'branches' : listBranches(), 
    'gdc' : listFiles('../branches/BR/Desktop/other/'), 
     'san' : listFiles('../branches/BR/other/'), 
     'gmc' : listFiles('../branches/BR/Mobile/other/'), 
     'filter' : listFiles1('../branches/BR/Mobile/other/') 
    } 
    res.render('index', view); 
}); 
3 
//listBranches 
var fs = require('fs'); 
var glob = require('glob'); 
var path = '../branches/other/' + '*'; 
var filelist = []; 

function listBranches() { 
    var files = glob.sync(path).filter(isFolder); 

    for (var i = files.length - 1; i >= 0; i--) { 
    filelist.push({ 
     name: files[i].split('/')[3], 
    }); 
    }; 

    return filelist; 
} 

function listFiles(path) { 

    var filelist2 = []; 
    var files = glob.sync(path + '**').filter(isFile); 

    for (var i = files.length -1; i >= 0; i--) { 
    filelist2.push({ 
     "filename" : getFilename(files[i]), 
       "path" : files[i] 
     }); 
    }; 

    return filelist2; 
} 

function getFilename(path) { 
    var parts = path.split('/'); 
    return parts[parts.length-1]; 
} 

function isFolder(path) { 
    return fs.lstatSync(path).isDirectory(); 
} 

function isFile(path) { 
    return fs.lstatSync(path).isFile(); 
} 

//filters 
function listFiles1(path) { 
    var filelist = []; 
    var files = glob 
     .sync(path + '**') 
     .filter(isFile); 

    for (var i = files.length - 1; i >= 0; i--) { 
     filelist.push(
      {"filename" : createURL('test1','brand','test3','test4',getFilename(files[i])), 
      "path" : files[i] 
      }); 
      console.log(createURL('test1','brand','test3','test4',getFilename(files[i]))); 
    }; 

    return filelist; 
} 

function isFile(path) { 
    return fs.lstatSync(path).isFile(); 
} 

function getFilename(path) { 
    var parts = path.split('/'); 
    return parts[parts.length-1]; 
} 

function splitFile(file,part) { 
    var parts2 = file.split('.'); 
    return parts2[part]; 

} 



function createURL(filter1, filter2, filter3, section, file) { 


    var branch = filter1; 
    var brand = filter2; 
    var channel = filter3; 


    return 'http://' + '--' + channel + '.' + brand + '.' + 'local:8085' + '/' + '/' + file 


} 

//run app 
app.listen(3000, function(){ 
    console.log('App running on port 3000!') 
}); 

Answer 1

listBranches()がサーバーで呼び出されるたびに、あなたはfilelist配列に複数の項目を追加している項目は、その変数に蓄積するようにlistBranches()返すので変数は、それが呼び出されるたびに、それは長いを返すことより長い配列。

それはあなたのコードがやろうとしているものを私に完全には明らかではないですが、あなたは、少なくともこれを変更することで、その問題を解決することができます。これに

var filelist = []; 

function listBranches() { 
    var files = glob.sync(path).filter(isFolder); 

    for (var i = files.length - 1; i >= 0; i--) { 
    filelist.push({ 
     name: files[i].split('/')[3], 
    }); 
    }; 

    return filelist; 
} 

：

function listBranches() { 
    var filelist = []; 
    var files = glob.sync(path).filter(isFolder); 

    for (var i = files.length - 1; i >= 0; i--) { 
    filelist.push({ 
     name: files[i].split('/')[3], 
    }); 
    }; 

    return filelist; 
} 

は、そのモジュールを忘れないでくださいサーバー上のレベルまたはグローバル変数は、1つの要求から次の要求まで保持され、すべての要求によって共有されます。したがって、意図した動作でない限り、モジュールレベル変数を使用しないでください。