Firebase更新时如何自动重新渲染ejs

Question

我正在使用Nodejs构建一个webapp，并通过EJS模板生成HTML页面。 我对初始页面加载/刷新没问题，它可以按预期工作，它从firebase获取数据并填充。 稍后在更新Firebase集合时，无法进行重新渲染，因此无法在网页中看到新添加的数据，但是在VSCode控制台中，我可以看到侦听器从Firebase发布整个集合。

app.get('/feedback', (request, response) => {
  var appRef = firebase.database().ref().child('ApplicationList');
  var appList = {}, appNames = {};
  appRef.on('value', function(snap) {
    appList = snap.val();
    console.log('appList', appList);
    let keys = Object.keys(appList);
    for(let i=0;i<keys.length;i++){
       appNames[keys[i]] = appList[keys[i]].longName;
    }
    console.log('Keys = ',keys);
    console.log('appNames = ',appNames);
    response.render('feedback.ejs', {
        pageTitle:'Feedback - Home',
        pageID: 'feedbackhome',
        pageName: 'Home',
        appNames
    });        
  });            
});

Answer 1

您要么必须在NodeJS服务器中使用websockets（例如Socket.io ）来订阅这些更改，要么将Firebase侦听器移至客户端逻辑（如果需要在NodeJS应用程序中执行某些操作，请在更改时调用NodeJS应用程序中的某些终结点服务器）。

Answer 2

谢谢。 我想在EJS中执行此操作，因为我不想使用createElement（）创建具有复杂JavaScript代码的Webapp。 因此，决定通过把手使用客户端模板。

function getAppNames(){
var appRef = firebase.database().ref().child('ApplicationList');
var allApps = {}, appNames =[];
let temp = {};
    appRef.on('value', function(snap) {
        allApps = {};
        appNames = [];
        allApps = snap.val();
        console.log('allApps', allApps);
        let keys = Object.keys(allApps);
        console.log('Keys = ',keys);
        for(let i=0;i<keys.length;i++){
            temp = {};
            temp['shortName'] = allApps[keys[i]].shortName;
            temp['longName'] = allApps[keys[i]].longName;            
            appNames[i] = temp;
        }        
        appNames['appNames'] = appNames;
        console.log('appNames = ',JSON.stringify(appNames));        

        var source   = document.getElementById("sidebar-template").innerHTML;
        var template = Handlebars.compile(source);    
        $('.content-placeholder').html(template(appNames));
    });

}