Duplizierung von Daten beim Aktualisieren des Browsers - Nodejs

Question

Ich benutze Mustache und Nodejs, um eine Liste von Optionen in eine Dropdown-Box auf meiner Website zu laden. Jedes Mal, wenn die Seite aktualisiert wird, erhalte ich eine Duplizierung der Daten in der Dropdown-Box. Wie kann dies verhindert werden? Ich hoffe meine Frage ist klar.

Sie können sehen, wie ich Moustache im HTML-Codeausschnitt unten verwende;

<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> 

Und das ist der Nodejs-Code;

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

Jedes Mal listBranches() auf dem Server aufgerufen wird, werden Sie weitere Elemente in die filelist Array hinzugefügt, so werden die Punkte in dieser Variablen ansammeln und da listBranches() kehrt diese Variable, jedes Mal aufgerufen wird, wird es eine längere Rück und längeres Array.

Es ist nicht ganz klar zu mir, was Ihr Code versucht zu tun, aber Sie das dieses Problem zumindest beheben, indem Sie:

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; 
} 

dazu:

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; 
} 

dieses Modul Denken Sie daran, Die Level- oder globalen Variablen auf Ihrem Server bleiben von einer Anfrage zur nächsten bestehen und werden von allen Anfragen geteilt. Verwenden Sie daher keine Variablen auf Modulebene, es sei denn, dies ist das beabsichtigte Verhalten.