Express JS 中的基本表单页面答案

【问题标题】：Basic form page in Express JSExpress JS 中的基本表单页面
【发布时间】：2014-12-19 07:08:05
【问题描述】：

我对 Node Js 和 Express Js 真的很陌生，我正在关注（书）[http://www.sitepoint.com/store/jump-start-node-js/] 来学习 Node Js。

在书中作者为简单的登录表单创建了一个简单的页面。我正在关注它，但得到 404 Not found。

Not Found

404

Error: Not Found
at Layer.app.use.res.render.message [as handle] (/Applications/MAMP/htdocs/resto/app.js:29:15)
at trim_prefix (/Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:240:15)
at /Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:208:9
at Function.proto.process_params (/Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:269:12)
at next (/Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:199:19)
at next (/Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:176:38)
at /Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:137:5
at /Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:250:10
at next (/Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:160:14)
at next (/Applications/MAMP/htdocs/resto/node_modules/express/lib/router/index.js:176:38)

我在 App.js

中添加了以下代码

var fs = require('fs');

app.get('/form', function(req, res){
fs.readFile('.views/form.html', function(error, content){
    if(error){
        res.writeHead(500);
        res.end();
    }
    else{
        res.writeHead(200, {'Content-Type': 'text/html'});
        res.end(content, 'utf-8');
    }
});

});

然后在 Views 文件夹中创建了一个文件 form.html，我在其中创建了一个简单的 html 表单。

这对我不起作用，所以按照默认 index.jade 的流程，我创建了一个文件 form.js 并在其中添加了以下代码

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

/* GET users listing. */
router.get('/form', function(req, res) {
res.render('form');
});

module.exports = router;

这也不起作用。我确定我做错了什么，但我不知道在哪里。

请帮忙，谢谢

【问题讨论】：

标签： javascript node.js express

【解决方案1】：

假设你有这些文件：

-- app.js

-- 路由（包含 root.js 的文件夹）

-- 视图（包含 form.jade 的文件夹）

然后，在你的 app.js 中：

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

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

app.use('/', require('./routes/root')); // Say that all the routes defined in root.js will start with http://yourdomain.com/

在 root.js 中：

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

/* GET http://yourdomain.com/form */
router.get('/form', function(req, res) {
    res.render('form'); // Render form.jade view
});

当然，这真的是极简的，你会有更多的事情要做......但我希望这能帮助你更好地理解 node.js 使用 Express

Express Router documentation

【讨论】：

你能告诉我如何使用简单的 HTML 代替玉吗？
也许你应该看看EJS模板引擎。它看起来真的只是带有一些动态内容的简单 HTML

【解决方案2】：

我也是 NodeJS 和 Express 的新手，但我认为问题在于您从未声明在哪里可以找到 form.html 文件。就在 app.get('/form',....) 之前，放 app.use(express.static(__dirname+'放置你的 form.html 所在的目录，如果不在目录中，就不要放任何东西') );这样 express 知道在哪里可以找到 form.html，你不应该再得到 404

【讨论】：

现在它给了我节点 www GET /form 500 7ms
确认你有 app.use(express.static(__dirname+"/Views"));这纯粹是为了测试，但删除了 get 方法的内容，所以删除 get 中的 readFile 并输入 res.writeHead(200, {'Content-Type': 'text/html'}); res.end(content, 'utf-8');

【解决方案3】：

Express 在响应对象中提供了一个sendFile 函数，它允许你这样做：

app.get('/form', function(req, res){
    res.sendFile('./views/form.html', {root: __dirname}, function(error, content){
      if(error){
        res.writeHead(500);
        res.end();
      }
    });
});

在这种情况下不使用翡翠渲染器。

【讨论】：