Node.js之express框架

最新推荐文章于 2025-02-19 23:16:37 发布

weixin_41466434

最新推荐文章于 2025-02-19 23:16:37 发布

阅读量149

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_41466434/article/details/88651611

本文介绍Express框架的核心特性，包括中间件设置、路由管理、模板渲染等。演示如何安装Express及配套模块，通过实例展示GET和POST请求处理、文件上传及Cookie管理。

Express简介

使用 Express 可以快速地搭建一个完整功能的网站。
Express 框架核心特性：
可以设置中间件来响应 HTTP 请求。
定义了路由表用于执行不同的 HTTP 请求动作。
可以通过向模板传递参数来动态渲染 HTML 页面。

一、安装 Express

安装 Express 并将其保存到依赖列表中：

npm install express --save

以下几个重要的模块是需要与 express 框架一起安装的：

body-parser ：node.js 中间件，用于处理 JSON, Raw, Text 和 URL 编码的数据。
cookie-parser ：一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie，并把它们转成对象。
multer ： node.js 中间件，用于处理 enctype=“multipart/form-data”（设置表单的MIME编码）的表单数据。

二、第一个 Express 框架实例

var express = require('express');
var app = express();
 
app.get('/', function (req, res) {
   res.send('Hello World');
});
 
var server = app.listen(8081);

三、路由

路由决定了由谁(指定脚本)去响应客户端请求。在HTTP请求中，我们可以通过路由提取出请求的URL以及GET/POST参数。

案例

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

app.get('/', function (req, res) {
   console.log("主页 GET 请求");
   res.send('Hello GET');
})
 

app.get('/del_user', function (req, res) {
   console.log("/del_user 响应 DELETE 请求");
   res.send('删除页面');
})
 

app.get('/list_user', function (req, res) {
   console.log("/list_user GET 请求");
   res.send('用户列表页面');
})
 
 
var server = app.listen(8081)

四、静态文件

Express 提供了内置的中间件 express.static 来设置静态文件路径，如：图片， CSS, JavaScript 等。

app.use(express.static('public'));

注：此时已引入public文件夹

五、GET 方法

案例：表单中通过 GET 方法提交两个参数，使用 server.js 文件内的 process_get 路由器来处理输入。

<html>
<body>
<form action="http://127.0.0.1:8081/process_get" method="GET">
Username: <input type="text" name="username">  <br>
 
Password: <input type="password" name="password">
<input type="submit" value="Submit">
</form>
</body>
</html>

var express = require('express');
var app = express();
app.use(express.static('public'));
 
app.get('/index_get.html', function (req, res) {
   res.sendFile( __dirname + "/" + "index_get.html" );
})
 
app.get('/process_get', function (req, res) {
 
   // 输出 JSON 格式
   var response = {
       "username":req.query.username,
       "password":req.query.password
   };
   console.log(response);
   res.end(JSON.stringify(response));
});
 
var server = app.listen(8081);

六、POST 方法

案例：表单中通过 POST 方法提交两个参数，使用 server.js 文件内的 process_post 路由器来处理输入。

<html>
<body>
<form action="http://127.0.0.1:8081/process_post" method="POST">
Username: <input type="text" name="username">  <br>
 
Password: <input type="password" name="password">
<input type="submit" value="Submit">
</form>
</body>
</html>

var express = require('express');
var app = express();
var bodyParser = require('body-parser');
 
// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false })
 
app.use(express.static('public'));
 
app.get('/index_post.html', function (req, res) {
   res.sendFile( __dirname + "/" + "index_post.html" );
})
 
app.post('/process_post', urlencodedParser, function (req, res) {
 
   // 输出 JSON 格式
   var response = {
       "username":req.body.username,
       "password":req.body.password
   };
   console.log(response);
   res.end(JSON.stringify(response));
})
 
var server = app.listen(8081);

七、文件上传

以下我们创建一个用于上传文件的表单，使用 POST 方法，表单 enctype 属性设置为 multipart/form-data。
index.htm 文件代码：

<html>
<head>
<title>文件上传表单</title>
</head>
<body>
	<h3>文件上传：</h3>
	选择一个文件上传: <br />
	<form action="/file_upload" method="post" enctype="multipart/form-data">
	<input type="file" name="image" size="50" />
	<br />
	<input type="submit" value="上传文件" />
</form>
</body>
</html>

server.js 文件代码：

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

var bodyParser = require('body-parser');
var multer = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));//加载解析urlencoded请求体的中间件
app.use(multer({ dest: '/tmp/' }).array('image'));
//'/tmp'，是在系统根目录下创建tmp；要改为'./tmp'，才是在当前目录下创建tmp目录。

app.get('/file_upload.html', function (req, res) {
   res.sendFile(__dirname + "/" + "file_upload.html");
})

app.post('/file_upload', function (req, res) {

   console.log(req.files[0]);  // 上传的文件信息

   var des_file = __dirname + "/" + req.files[0].originalname;
   fs.readFile(req.files[0].path, function (err, data) {
      fs.writeFile(des_file, data, function (err) {
         if (err) {
            console.log(err);
         } else {
            response = {
               message: 'File uploaded successfully',
               filename: req.files[0].originalname
            };
         }
         console.log(response);
         res.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });//防中文乱码
         res.end(JSON.stringify(response));
      });
   });
})

var server = app.listen(8081)

八、Cookie 管理

使用中间件cookie-parser向 Node.js 服务器发送 cookie 信息

var express = require('express')
var cookieParser = require('cookie-parser')
var util = require('util');
var app = express()
app.use(cookieParser())
app.get('/', function(req, res) {
console.log("Cookies: " + util.inspect(req.cookies));
})
app.listen(8081)