express学习笔记（一）

express

express包作为node的第三方模块，很好的解决了原生模块中存在的复杂问题，使用方便很多。
首先安装express包

npm i express

等待安装完成后就可以在项目中引入express 模块。

express = require('express')

不同于原生node创建服务的繁琐，express创建服务相当简单

const app = express()

app.listen(3000,()=>{console.log('3000 port open')})

即可完成对服务的创建和监听。
在app.js 的同级目录中创建public文件夹，并在文件夹内创建内容自定的html，css，js文件，并对其进行引入。
express可以自动为文件配置pathname,不必像原生node一样去对所有引入的js，css等文件进行逐一手动配置。只需要使用use属性即可

express = require('express');

const app = express();
//自动为public目录中的所有文件配置路由
app.use(express.static('public'));

app.listen(3000,()=>{
    console.log('3000 port open');
});

运行app.js后，页面中输入localhost:3000/index.html就可以查看效果，发现引入的css文件和js文件都已经生效。

动态接收数据

同时引入动态资源例如表单也很方便。

send（）

send（）是express提供的一个方法，可以替代res.end()去返回更多类型的数据，例如对象数组等。

get方式

<!--HTML-->
 <form action="/qiwei" method="get">
        用户名<input type="text" name="username">
        密码<input type="password" name="psd">
        <input type="submit">
 </form>

//app.js
app.get('/qiwei',function (req,res) {
    console.log(req.query);
    res.end();
});

运行代码并输入用户名密码后提交控制台就会输出以对象形式出现的账户密码信息

post方式

<!--HTML-->
 <form action="/qiwei" method="post">
        用户名<input type="text" name="username">
        密码<input type="password" name="psd">
        <input type="submit">
 </form>

//app.js
app.post('/qiwei',function (req,res) {
    
});

利用post方式获取数据就无法像get方式一样直接获取，需要安装新的包

npm i body-parser

并进行引入

const bodyParser = require('body-parser');

bodyParser 无法直接使用，需要写上一行特定的代码：

app.use(bodyParser.urlencoded({ extended: false }));

这样才可以开始使用。接下来 获取post的数据就很简单了

 console.log(req.body);

直接输出req.body就可以获取到post发送的数据

动态路由

不论是post还是get方式获取数据，我们都只能获取一个页面的路由。在实际代码编写中我们需要需要获取多个页面的路由，一个一个写太过麻烦，动态路由就是为了解决这个问题而存在的。
以csdn中的一些文章为例


可以看到除了打码的个人信息以外后面的路径都是跟着/article/details再加一串字符，如果挨个配置所花时间太长。

//引入express包
const express = require('express')

const app = express()

//前台的多个路径都可以匹配到后台的一个路径
app.get('/article/:id',function(req,res){
    // let {id} = req.params
    console.log(req.params)
    res.send(req.params)
})
app.listen(3002,()=>{
    console.log('3002端口成功运行');
})

这就是一个基础的动态路由分配，在get中会自动分配article开头的路径，可以是article/topic,也可以是article/adv等等。id就会存储且匹配article后的路径，且req.params会以对象形式输出后面的数据。也可以进行多个匹配

app.get('/article/:id/:xxx/:yyy',function(req,res){
    // let {id} = req.params
    console.log(req.params)
    res.send(req.params)
})

express洋葱模型

在路由配置中我们有可能会出现