express.js 中筛选路径和创建 html 页面
我们添加了 express 路由器来处理路由。单个路由器文件处理多个路由。
在 App.js 中为路由器添加路径 −
const http = require('http');
const express = require('express');
const bodyParser = require('body-parser');
const route = require('./routes');
const app = express();
app.use(bodyParser.urlencoded({extended: false}));
app.use('/test',route);
app.use((req, res,next)=>{
res.status(404).send('<h1> Page not found </h1>');
});
const server = http.createServer(app);
server.listen(3000);在路由器中间件中,我们使用路径 −/p>
app.use('/test',route);路由器将处理以 /test 开头的所有路径,例如 /test/add-username
我们必须更改 routes.js 文件中表单中的操作 −
router.get('/add-username', (req, res,next)=>{
res.send('<form action="/test/post-username" method="POST"> <input type="text" name="username"> <button type="submit"> Send </button> </form>');
});Routes.js 文件 −
const express = require('express');
const router = express.Router();
router.get('/add-username', (req, res,next)=>{
res.send('<form action="/test/post-username" method="POST"> <input type="text" name="username"> <button type="submit"> Send </button> </form>');
});
router.post('/post-username', (req, res, next)=>{
console.log('data: ', req.body.username);
res.send('<h1>'+req.body.username+'</h1>');
});
module.exports = router;这种添加路由器过滤机制有助于将常见的 URL 处理程序放在一个部分中。
在 vs 代码编辑器中创建 html5 页面−
创建新文件夹来存储 html 页面,例如 views 文件夹。创建一个新文件 add-user.html。
在 add-user.html 文件中,如果我们键入 html 并按下 ctrl + 空格,我们将获得一个为 html5 创建默认框架的选项。选择它后,我们将得到以下 html5 页面 −
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> </html>
我们可以在 html 主体中复制 routes.js 文件中的表单。
<form action="/test/post-username" method="POST"> <input type="text" name="username"> <button type="submit"> Send </button> </form>
广告
数据结构
网络
RDBMS
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP