当我从客户端 js 调用服务器端 js 方法时，ejs 文件未使用 res.render 呈现

Question

我是 node.js 的新手，并试图从服务器端 js 调用 ejs 文件。 我正在从客户端 js 文件中调用 post 和 get 方法。 下面是我的代码。

客户端js：

function playerlist(){
const button = document.getElementById('playerselection');
//const data={selectedplayers:window.players};
button.addEventListener('click', function() {
  
  console.log(players);
  fetch('/FantasyTeam', {method: 'POST',
    body: JSON.stringify(players),
    headers: {'Content-Type':'application/json'},
    })
    .then(function(response) {
      if(response.ok) {
        CallGetMethod();
        return;
      }
      throw new Error('Request failed.');
    })
    .catch(function(error) {
      console.log(error);
    });
});
}
function CallGetMethod(){

  console.log('Inside CallGetMethod');
  fetch('/FantasyTeam', {method: 'GET'})
    .then(function(response) {
      if(response.ok) {
          console.log('Inside response');
          return ;
      }
      
      throw new Error('Request failed.');
    })
    .catch(function(error) {
      console.log(error);
    });
  
}


**Server-side js:**
app.post('/FantasyTeam', (req, res) => {
  
  const playerlist = req.body;
  console.log(playerlist);
    
    sql.connect(dbConfig, {
            useNewUrlParser: true
        }).then(() => {
             // create Request object
         console.log("Connected!");  
         
        var request = new sql.Request();
        
        //Insert query to FantasyTeam Table with selected players.         
        request.query("INSERT Query").then(function (err, result)
        {
            console.log('record added to db');  
            
         }).catch(err => {
            console.log('Could not insert the record to DB. Exiting now...', err);
            process.exit();
        });
        }
        res.sendStatus(201);
        
        }).catch(err => {
            console.log('Could not connect to the database. Exiting now...', err);
            process.exit();
        });
         
});

app.get('/FantasyTeam', (req, res) => {
  // connect to your database
    sql.connect(dbConfig, {
            useNewUrlParser: true
        }).then(() => {
             // create Request object
        var request = new sql.Request();
        request.query("select query"), function (err, result) 
        {    
            console.log('records fetched from DB'); 
            //res.send(result);
            //res.render(path.resolve(__dirname + "/views/FantasyTeam"),{result});
            res.render('FantasyTeam.ejs', { result });
            //res.render('FantasyTeam.ejs', { result });
            console.log(result.recordset.length);
         });
        }).catch(err => {
            console.log('Could not connect to the database. Exiting now...', err);
            process.exit();
        });
  
})  ;

我尝试了多种方法来呈现 FantasyTeam.ejs 文件。 但是不能成功。代码没有错误，只是没有重新编写ejs文件。 感谢这方面的任何帮助。

Answer 1

首先，您在节点应用程序上设置了视图引擎。 然后第二步在应用程序根目录上创建一个视图文件夹，然后在视图文件夹中创建一个页面文件夹，然后在页面文件夹中创建所有模板。 视图文件夹需要是静态的。 最后，您可以从视图目录中的 pages 文件夹渲染模板。 看我的例子。 有关更多信息，请访问 ejs 文档： https ://ejs.co/#docs

const express = require('express');
const app = express()

const router = express.Router()

// Setup View Engine and set static folder

app.use(express.static('public'))
app.set('view engine','ejs')
app.set('views','views')

//Controller
router.get('/example',(req,res,next)=>{
  res.render('pages/index.ejs',{You Data})
})