Express内置中间件的使用

1.express.static()：

express.static是用来处理静态资源文件的。
node中有一个内置模块path，path中的join()方法就是用来处理路径的，__dirname指的是当前项目文件夹的根目录。

// 推荐使用绝对路径
app.use(express.static(path.join(__dirname, 'public')));

• 代码示例：
  先自行创建一个public文件，里面内容可以放一些静态资源
  图1.png

// 中间件
const express = require('express');
const path = require('path');
const app = express();

app.use(express.static(path.join(__dirname, './public')));

app.listen(3000, () => console.log('Server port 3000 at start....'));

这样响应回来的网页会是public下的内容。

我们也可以给静态资源目录制定一个虚拟路径。

app.use('/static', express.static(path.join(__dirname, 'public')))

• 代码示例：

// 中间件
const express = require('express');
const path = require('path');
const app = express();

// app.use(express.static(path.join(__dirname, './public')));

// 给静态资源目录制定一个虚拟路径
app.use('/static', express.static(path.join(__dirname, './public')));

app.listen(3000, () => console.log('Server port 3000 at start....'));

使用虚拟路径的情况下，网页访问的话就不能使用/，而必须加上/static了，否则访问不了。

其次，这种带虚拟路径的中间件也可以玩成/api的接口模式

• 访问带有虚拟路径的接口数据：
  创建一个json静态资源文件

{
    "name":"张三",
    "age": 23
}

我们可以创建一个不带api的为执行public静态资源的中间件，api接口数据则去创建一个虚拟路径去处理。

// 中间件
const express = require('express');
const path = require('path');
const app = express();

// 不带api的执行public下的资源文件
app.use(express.static(path.join(__dirname, './public')));

// 获取json数据
app.use('/api', express.static(path.join(__dirname, './data')));

app.listen(3000, () => console.log('Server port 3000 at start....'));

写一段script脚本去测试接口：

    <script>
        fetch('/api/data.json').then(res => res.json()).then(data => {
            console.log(data);
        })
    </script>

图2.png

2.express.json()

处理json方式的传参，内置的json中间负责把带有JSON的请求中（Content-Type='application/json'）的数据提取出来，它基于body-parser

app.use(express.json());

// 中间件
const express = require('express');
const path = require('path');
const app = express();

// 处理json数据
app.use(express.json());

app.post('/qryTable', (req, res, next) => {
    console.log(req.body);
})


app.listen(3000, () => console.log('Server port 3000 at start....'));

图3.png
图4.png

3. express.urlencoded()

用于处理表单的传参方式
urlencoded负责将发送请求的数据提取出来，经过中间件之后，req.body为解析后的json字符串.

// 中间件
const express = require('express');
const path = require('path');
const app = express();

// 处理表单数据
app.use(express.urlencoded());

app.post('/qryTable', (req, res, next) => {
    console.log(req.body);
})


app.listen(3000, () => console.log('Server port 3000 at start....'));

图5.png
图6.png