用Express重写之前的留言本案例
Posted So istes immer
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了用Express重写之前的留言本案例相关的知识，希望对你有一定的参考价值。
在Express中获取表单GET请求参数
req.query
获取表单POST请求体数据
由于Express中没有内置获取表单POST请求体的API，这里需要使用一个第三方包body-parser
有了这样一个中间件，就可以通过req.body来获取表单POST请求体数据了
安装：npm i -S body-parser
配置可参考Express官网
关于案例，我们修改两个地方
app.js
const express = require('express')
const app = express()
var sd = require('silly-datetime')
var bodyParser = require('body-parser')
// 配置body-parser中间件
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json
app.use(bodyParser.json())
app.use('/public/', express.static('./public/'))
app.engine('html', require('express-art-template'))
var comments = [
{
name: '宙斯',
message: '我是众神之王',
dateTime: '2021-01-20'
},
{
name: '波塞冬',
message: '我是海神',
dateTime: '2021-02-21'
},
{
name: '雅典娜',
message: '我是智慧之神',
dateTime: '2021-03-22'
},
]
app.get('/', function (req, res) {
res.render('index.html', {
comments: comments
})
})
app.get('/post', function (req, res) {
res.render('post.html')
})
app.post('/post', function (req, res) {
var comment = req.body
comment.dateTime = sd.format(new Date(), 'YYYY-MM-DD HH:mm')
comments.unshift(comment)
res.redirect('/')
})
app.listen(3000, function () {
console.log('The server is running at port 3000...')
})views/post.html(表单提交改成post请求)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>发表留言</title>
<link rel="stylesheet" href="/public/lib/bootstrap/dist/css/bootstrap.css">
</head>
<body>
<div class="header container">
<div class="page-header">
<h1>Home<small> Leave a comment</small></h1>
</div>
<div class="comments container">
<form action="/post" method="get">
... //原代码不变
</form>
</div>
</div>
</body>
</html>这是我们要安装的依赖
"dependencies": {
"art-template": "^4.13.2",
"body-parser": "^1.19.0",
"bootstrap": "^5.1.3",
"express": "^4.17.1",
"express-art-template": "^1.0.1",
"jquery": "^3.6.0",
"silly-datetime": "^0.1.2"
}
以上是关于用Express重写之前的留言本案例的主要内容，如果未能解决你的问题，请参考以下文章
nodejs中利用expresss脚手架和bootstrap,数据库mongodb搭建的留言板案例
jQuery插件版无缝轮播，重写了之前的代码，显得更高大上一点
使用express4.x版Jade模板以及mysql重写《nodejs开发指南》微博实例