在Node/Express中找不到视图

Question

在Node/Express中找不到视图

5

正如我的用户名所示，我是新手Node.js。我正在尝试学习它。作为这个过程的一部分，我正在设置一个基本的网站。这个网站将显示几个基本的网页并公开一个REST端点。我的项目结构如下:

config.js
home.html
start.js
routes.js
server.js
resources
  css
    style.css
  images
    up.png
    down.png
  javascript
    home.html.js

start.js 包含了我的主服务器代码。该文件通过命令行使用 'node start.js' 执行。一旦启动，我的服务器开始监听端口3000。start.js 中的代码如下：

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

var UserProfileHandler = require('./app/handlers/UserProfileHandler');

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

  app.set('views', __dirname + '/');

  app.use(express.logger({ stream: expressLogFile }));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(express.static(__dirname + '/public'));
});

var routes = {
    userProfiles: new UserProfileHandler()
};

function start() {
    routeConfig.setup(app, routes);
    var port = process.env.PORT || 3000;
    app.listen(port);
    console.log("SUCCESS: Server listening on port %d in %s mode", port, app.settings.env);
}

exports.start = start;
exports.app = app;

我的routes.js文件如下：

function setup(app, routes) {
  viewSetup(app);
  apiSetup(app, routes);
}

function viewSetup(app) {
  app.get('/', function (req, res) {
    res.render("/home.html");
  });

  app.get('/home.html', function (req, res) {
    res.render("/home.html");
  });
}

function apiSetup(app, routes) {
  app.get('/api/userProfiles/:username', routes.userProfiles.getUserProfiles);
}

我试图在浏览器窗口中加载home.html文件。我尝试通过访问 http://localhost:3000，http://localhost:3000/ 和 http://localhost:3000/home.html 来完成此操作。不幸的是，这些都不起作用。实际上，我收到一个错误，内容如下：

Express 500 Error: Failed to lookup view "/home.html"

我知道我已经接近成功了。如果我访问http://localhost:3000/api/userProfiles/me，我将会像预期一样收到JSON格式的响应。但出现某些问题时，似乎无法返回HTML。我的home.html文件如下所示。

<html>
  <head>
    <script type='text/javascript' src='/resources/javascript/home.html.js'></script>
  </head>
  <body>
    We're up and running! <img src='/resources/images/up.png' />
  </body>
</html>

这是一个相当基础的 HTML 文件。即使 HTML 文件顺利返回，我还担心 JavaScript 文件和其引用的图片可能无法访问。我之所以如此担心，是因为我不太了解 Node 中路径等工作方式。

如何使 home.html 在我的 Node 设置中正常工作呢？

谢谢！

- Node Newbie

你尝试过使用 app.use(express.static(__dirname)); 吗？ - Jeroen Ingelbrecht

2个回答

0

在我的情况下，我遇到了类似的问题： app.set('./views'); 要注意点号，不知道为什么，但是点号会搞砸它。我一开始是这样写的： app.set('/views')，无论我怎么做都找不到文件夹，直到加上点号。

- user3709120

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mithun Satheesh · Accepted Answer

作为您的视图文件与主文件位于同一文件夹中，以下更改应该可以使其正常工作

1.更改视图文件夹配置行

从

app.set('views', __dirname + '/');//wont work

to

app.set('views', __dirname);//will work

2.更改视图渲染行

从

res.render("/home.html");//wont work

为了

res.render("home.html");//will work

做了这两个更改后，视图应该可以正常工作。

以下是对评论的更新。

你提到的关于图片、CSS和JS的问题，是由于静态文件夹的配置不正确造成的，需要进行修改。

app.use(express.static(__dirname + '/public'));

to

app.use(express.static(__dirname + '/resources'));

如果您的静态文件夹名为resources，请确保在视图中引用CSS/JS/Image文件的方式如下：

例如：

/css/style.css 
/images/up.png
/images/down.png
/javascript/home.html.js

从您的视图文件中

如果上述步骤无效，请检查您是否正确给出了路径，您也可以尝试采用以下方法：将

app.use(express.static(__dirname + '/resources'));

之前的

app.use(express.methodOverride());
app.use(app.router);

类似这样的行

app.configure(function () {
  app.engine('html', require('ejs').renderFile);
  app.set('views', __dirname + '/');
  app.use(express.static(__dirname + '/public'));
  //try changing the position of above line in app.configure and resatrt node app
  app.use(express.logger({ stream: expressLogFile }));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);          
});