Jos*_*rmo 6 javascript post express
我最近关于如何构建Express服务器的简单教程(https://codeforgeek.com/2014/06/express-nodejs-tutorial/).
我正在尝试扩展本教程中的代码,以便我可以响应发布请求.我想通过更新一个json文件(恰好填充'用户注释',然后在'/'处重新渲染)来做到这一点
./server.js:
var express = require('express');
var app = express();
// routing configuration
require('./router/main')(app);
// ejs configuration
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);
// run the server
var server = app.listen(8080, function(){
console.log('Express server listening on port 8080');
});
Run Code Online (Sandbox Code Playgroud)
./router/main.js(路由器):
var fs = require('fs');
var ejs = require('ejs')
module.exports = function(app){
app.get('/', function(req, res){
var comments = JSON.parse(fs.readFileSync(__dirname + '/../comments.json'));
res.render('index.ejs', comments);
});
app.post('/', function(req, res){
console.log('here in post');
var name = req.body.name;
var message = req.body.message;
var newComment = {"name": name, "message": message};
var comments = JSON.parse(fs.readFileSync(__dirname + '/../comments.json'));
comments.push(newComment);
fs.writeFileSync(__dirname + '/../comments.json', comments, 'utf8');
//redirect to a 'get' on '/'
res.redirect('/');
});
app.get('/about', function(req, res){
res.render('about.html')
});
}
Run Code Online (Sandbox Code Playgroud)
./views/index.ejs:
<div>
<div>
<h1> Joe's Forum </h1>
<a href='/about'> (about) </a>
</div>
<div>
<ul>
<% comments.forEach( function(comment){ %>
<li>
<%= comment.name %> : <%= comment.message %>
</li>
<% }); %>
</ul>
</div>
<h2> Enter a new comment </h2>
<form action='/' method="post">
Enter your name: <input type='text' name='name'> <br><br>
Enter your message: <input type='textarea' name='message'> <br><br>
<input type='submit' value='Submit'>
<form>
</div>
Run Code Online (Sandbox Code Playgroud)
./comments.json:
{
"comments": [
{"name":"Joe", "message" : "What advantages does Node.js afford the web developer?"},
{"name": "John", "message": "Asynchronous IO helps us to keep our pages responsive even if the server is fetching data"}
]
}
Run Code Online (Sandbox Code Playgroud)
当我尝试从表单中提交新评论时,我看到的是:
"不能POST /"
有人可以解释为什么我可能会收到此错误吗?谢谢
实际上存在一些问题,但主要问题是您没有正文解析器 - 将 POST 中的节点流转换为req.body
. 我目前只熟悉bodyParser
,你可能应该研究一下。尽管它显示在 Express 4.x 文档中,但在运行服务器时会收到一条弃用消息。
另一个问题是comments.push
. 那应该是comments.comments.push
。以下工作:
路由器.js:
var fs = require('fs');
var ejs = require('ejs')
module.exports = function(app){
app.get('/', function(req, res){
var comments = JSON.parse(fs.readFileSync(__dirname + '/../comments.json'));
res.render('index.ejs', comments);
});
app.post('/', function(req, res){
console.log('here in post');
console.log(req.body)
var name = req.body.name;
var message = req.body.message;
var newComment = {"name": name, "message": message};
var comments = JSON.parse(fs.readFileSync(__dirname + '/../comments.json'));
comments.comments.push(newComment);
fs.writeFileSync(__dirname + '/../comments.json', JSON.stringify(comments), 'utf8');
//redirect to a 'get' on '/'
res.redirect('/');
});
app.get('/about', function(req, res){
res.render('about.html')
});
}
Run Code Online (Sandbox Code Playgroud)
和 server.js:
var express = require('express');
var bodyParser = require('body-parser');
var app = express();
app.use(bodyParser.urlencoded())
// routing configuration
require('./router/main')(app);
// ejs configuration
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);
// run the server
var server = app.listen(8080, function(){
console.log('Express server listening on port 8080');
})
Run Code Online (Sandbox Code Playgroud)