文件不会在服务器上呈现 .get() 请求答案

【问题标题】：File will not render .get() request on the server文件不会在服务器上呈现 .get() 请求
【发布时间】：2019-03-30 15:32:15
【问题描述】：

我正在尝试简单的 Express 路由，但遇到了问题。我希望服务器在我输入 '/1' 时将文件 'layout2.hbs' 呈现到服务器中 - 但控制台返回 304

我的错误信息：

GET / 304 30.902 ms - -
GET /style.css 304 3.370 ms - -
GET /print2.css 304 0.553 ms - -
GET /1 304 9.213 ms - -

我的 index.js 文件有路由：

var express = require('express');
var router = express.Router();
var db = require('monk')('localhost:27017/');
var userData = db.get('user-data');
var app = require('express')();

router.get('/', function(req,res,next){
    res.render('layout');
});

router.get('/1', function(req,res,next){
    res.render('layout2');
});

router.use(express.static("public"));

module.exports = router;

我的显示车把的 app.js 确实设置好了：

var express = require('express');
var app = require('express')();
var path = require('path');
var port = require('port');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var hbs = require('express-handlebars');
const queryString = require('query-string');

var routes = require('./routes/index');

var app = express();

// view engine setup
app.engine('hbs', hbs({extname: 'hbs', defaultLayout: 'layout', layoutsDir: __dirname + '/views'}));
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'hbs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', routes);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});


module.exports = app;

我的文件目录：

Bloodborne Backend (project folder)
      │
      |
      |   
    public------print2.css
      |         style.css     
      |           
      | 
      |   
    routes-------index.js
      |
      |
      |
    views-------layout.hbs
      |         layout2.hbs
      |
      |
    app.js
  package.json

对不起，如果目录树看起来很糟糕 - 这是我可以输入它的最佳方式。

我希望当我在本地主机中输入“/1”时，会呈现文件“layout2.hbs”。但是，我反而得到一个 304 暗示服务器没有改变。我被困了一段时间，无法找到解决方案！

【问题讨论】：

标签： javascript node.js express routing handlebars.js

【解决方案1】：

不完全确定为什么您的代码无法正常工作，但是有一些事情需要纠正。

express 应用在 app.js 文件中生成了两次，一次就足够了。

静态文件夹只需要在主app.js文件中注册一次。

我提取了相关的代码片段，并围绕您的目录结构创建了一个简单的工作示例。

projectFolder
  node_modules
    ...
  public
    image.jpg
    style.css
    ...
  routes
    routes.js
    ...
  views
    layout.hbs
    one.hbs
    two.hbs
    ...
  package.json
  app.js

app.js：

const path = require('path');
const express = require('express');
const bodyParser = require('body-parser');
const hbs = require('express-handlebars');

const router = require('./routes/routes.js' );

const app = express();

app.engine('hbs', hbs({ extname: 'hbs', defaultLayout: 'layout', layoutsDir: __dirname + '/views' }));
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'hbs');

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

app.use( express.static(path.join(__dirname, 'public')) );

app.use('/', router );

app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: err
  });
});

app.listen( 4444 );

routes.js：

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

router.get('/', function(req,res,next){
  res.render('one' );
});

router.get('/1', function(req,res,next){
  res.render('two');
});

module.exports = router;

layout.hbs：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Default Layout</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    {{{body}}}
    <img src="image.jpg" width="200px">
</body>
</html>

一个.hbs

<p> Fragment added from one.hbs </p>

两个.hbs

<p> Fragment added from two.hbs </p>

编码愉快！！

【讨论】：

【解决方案2】：

@Hitesh Lala 解决了这个问题！我所做的是将我的app.js 文件中的defaultLayout 更改为一个名为index.hbs 的hbs 文件。从那里我的index.js 文件将正确路由正确的hbs 文件——在我的情况下为layout.hbs 和layout2.hbs。

【讨论】：