节点js res.render不起作用,但是res.send起作用

时间:2019-10-16 15:52:15

标签: javascript node.js express ejs

我正在为Node js应用程序设置环境。但是views / ejs文件没有被渲染。 如果我这样做:

app.get("/", function(req, res){

     res.send('Hello');
 });

有效。 但是如果我这样做:

app.get("/", function(req, res){

   res.render("welcome");
});

不是。

我的app.js

const express = require("express");
const app = express();
const mongoose = require("mongoose");
const indexRoutes = require("./routes/index");
const userRoutes = require("./routes/user");
const ejsLayouts = require("express-ejs-layouts");
const path = require("path");

 mongoose.connect("mongodb://localhost/userAuth", function(err, res) {
    if (err) throw err;
 console.log("Connected to database");
  });

 //EJS
 app.set('view engine','ejs');
 app.use(ejsLayouts); 
 app.use(express.static(__dirname + '/public'));

 app.set('views',path.join(__dirname+'/views'))

 //ROUTES
 app.use("/", indexRoutes);
 app.use("/user", userRoutes);

 app.listen(3000, function() {
      console.log("server started");
  });

我的index.js文件(userLogin / routes / index.js)

  const express=require("express");
  path = require('path');
  router= express.Router();

  router.get("/",function(req,res){
     res.render("welcome");

   });

  module.exports = router;

我的文件夹结构

userLogin

/ ..

/路线

   /index.js

/观看次数

   /welcome.ejs

在welcome.ejs文件中我有一个h1元素olny。

3 个答案:

答案 0 :(得分:0)

请看一下您提供的代码,在index.js中,您尝试渲染一个名为check的视图,而您仅有的视图称为welcome。您的路径和路线看起来正确,可以渲染正确的视图。

答案 1 :(得分:0)

app.engine('html', require('ejs').renderFile); 

如果您希望呈现.html文件

然后

fs.readFile(path.resolve(__dirname + '/../public/views/logs.html'), 'utf-8', (err, content) => {
    let renderedHtml = ejs.render(content, {'user': req.session.db}); //get redered HTML code
    res.end(renderedHtml);
})

答案 2 :(得分:0)

如果您使用express-ejs-layouts npm,则应该拥有views/layouts/layout.ejs文件

在app.js内部:

const ejs =require('ejs');
const ejsLayouts = require("express-ejs-layouts");

app.set('view engine','ejs');
app.use(ejsLayouts); 
app.set('layout', 'layouts/layout');  

layout.ejs文件的布局遵循所有文件

如果您正在使用引导程序,那么您的layout.ejs文件将类似于:

<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

    <title></title>
</head>

<body>

        <?- body ?>

</body>

</html>

所以现在其他ejs页面将只显示内容

类似welcome.ejs的文件是

<h1>Welcome Page</h1>