初识express（简介，安装和基本使用），路由（express处理路由）

最新推荐文章于 2024-06-19 18:01:31 发布

歪大梨

最新推荐文章于 2024-06-19 18:01:31 发布

阅读量905

点赞数

分类专栏：前端文章标签： express javascript 前端

本文链接：https://blog.csdn.net/weixin_64037609/article/details/127434810

版权

前端专栏收录该内容

82 篇文章 0 订阅

订阅专栏

express的简介

express的安装和基本使用（不能全局安装）

express的简介

Express是基于 Nodejs平台，快速、开放、极简的 Web 开发框架
官网地址：Express - 基于 Node.js 平台的 web 应用开发框架 - Express 中文文档 | Express 中文网
作用：使用 Express，我们可以方便、快速的创建 Web 网站的服务器或 API 接口(纯json数据)的服务器。
本质上：express是一个第三方模块存在于npm社区中。

express的安装和基本使用（不能全局安装）

express是用来搭建web网站服务器或 API接口服务器的因此在安装express之前应该先生成 package.js
安装步骤如下
- npm init 生成package.json
- npm i express

express的简单使用

//1.引入 express模块
let express = require("express");
//2.使用express 创建 服务器对象
let app = express();//我们引入的express 是一个函数 函数的返回值 就是服务器对象



//3.调用listen方法 监听端口
app.listen(3000,()=>{
    console.log("服务器正在运行...")
})

注意：我们编写的express项目包名不能命名为 express 否则会和 express模块包产生冲突

express生成的服务器对象

express是使用服务器对象来单独进行路由配置的
服务器对象拥有一些方法分别是 get、post、put、delete等

用法：

服务器对象.get/post/put/delete("路由",(req,res)=>{
    //这个回调函数 会在指定路由触发
})

实例代码

//1.引入 express模块
let express = require("express");
//2.使用express 创建 服务器对象
let app = express();//我们引入的express 是一个函数 函数的返回值 就是服务器对象

app.get("/index",(req,res)=>{
    cosnole.log("我是首页");
    res.end("index")
})//当客户端通过get请求 访问 index路由的时候 就会执行这个回调函数

app.post("/login",(req,res)=>{
    res.end("login")
})//当客户端通过post请求 访问 login路由的时候 就会执行这个回调函数

//3.调用listen方法 监听端口
app.listen(3000,()=>{
    console.log("服务器正在运行...")
})

req和res

在express创建的服务器对象的路由配置中回调函数里存在两个形参 req 和 res
res：主要用来进行响应
- 响应
  - res.send(要响应的数据)
    - 作用：给客户端响应指定数据
  - res.sendFile("文件绝对路径")
    - 作用：响应指定路径的文件
  - res.json(要响应的js数据)
    - 作用：先将指定js数据压缩为 json字符串之后再进行响应
- 设置响应头
  - res.set("键名","键值")
- 设置MIME类型
  - res.type("响应文件的后缀名")
  - 例如：res.type(".html")
req：主要用来处理请求相关的问题
- req.query：可以接收到请求报文中提交的数据（只能接收get请求提交的数据）
- 通过动态路由提交数据
  - 我们之前写路由都是写作：/index /lodin
  - 其实我们的路由还可以继续向后写称为多级路由：/index/banner /index/list/xxx
  - req形参具备一个属性 params 可以通过设置动态路由来接收一级路由后面的路由内容
- params的用法
  - ```
  app.get("/一级路由/:键名",(req,res)=>{
      console.log(req.params);//{键名：一级路由后续的路由}
  })
```
- 注意：如上述代码所示，我们在一级路由后面添加了动态路由的键名那么就只能接收到二级路由至于后续的三级四级路由则无法接到

工具的使用

nodemon
- 自动更新js文件的运行，热更新
- npm 下载下载之后我们可以使用
- 执行命令：nodemon 要运行的js文件
- 来运行nodejs文件从而实现热更新
rest client
- 接口测试
- vscode带的插件
- 用法：
  - 安装完这个插件之后我们就可以编写.http文件
  - .http文件的内容为请求报文
- 语法
  - 注释：
    - ```
    #注释内容
```
- 声明变量
  - ```
  @变量名 = 变量值
```
  - 使用变量
    - ```
    {{变量名}}
```
- 一个http文件中可以写入多个请求报文但是各个请求报文之间要使用### 隔开
- 实例代码
  - ```
  # 这是注释内容
  # 下面 我们可以先声明一些 统一要用到的变量
  @url = http://127.0.0.1:3000
  
  # 下面 我们就可以使用变量 来进行相关操作了
  GET {{url}}/index HTTP/1.1
  
  # 各个请求报文之间 应该使用###隔开
  ###
  POST {{url}}/login HTTP/1.1
```
- 注意：在声明http变量的时候注意赋值不要加引号

路由

路由的概念

广义上来讲，路由就是映射关系。对于我们网络请求中的路由是：每一次请求对应的一个请求处理的函数。
包括：请求方式和路径

express处理路由

在express中我们编写路由的语法规则如下

服务器对象.请求方式（"路由路径",(req.res)=>{}）

app.get("/index",(req.res)=>{
    
})

express中处理路由的优点是可以很直观的将路由的路径和请求方式都快捷的设置好

路由的匹配机制

express中路由的匹配机制是从上到下的
路由的匹配就会从上到下进行注意匹配如果前面的路由匹配成功了后续的相同路由就不会再检测了，只有第一个/index路由可以匹配成功并执行其后的回调函数后续所有/index路由都无法匹配

express的模块化路由

所谓的模块化路由就是将 express搭建的服务器代码中路由部分单独提取为一个js模块文件
之后如果想使用路由则通过引入并使用
因此模块化路由至少需要两个文件——服务器js文件和路由模块js文件

下面我们一起来看一看两个文件该怎样编写

路由模块js文件

//1.引入express
let express = require("express");
//2.调用express的Router方法  生成 路由对象
let router = express.Router();//返回值 就是 路由对象

//3.使用路由对象 配置路由 配置路由的写法 和 普通的express配置路由 相同
//路由对象.请求方式("路径",(req,res)=>{})
router.get("/index",(req,res)=>{});
...

//4.将配置好路由的 路由对象  暴露出去
module.exports = router;

服务器js文件

//1.引入 express模块
let express = require("express");
//1.1 引入路由模块文件
let router = require("路由模块文件的路径")
//2.使用express 创建 服务器对象
let app = express();//我们引入的express 是一个函数 函数的返回值 就是服务器对象

//2.1使用路由模块 用法1：服务器对象.use(路由模块对象)
app.use(router);
//用法2：服务器对象.use("一级路由路径",路由模块对象)
app.use("/index",router)
//这种写法 表示 一级路由为 /index  router路由模块中 配置的 都是 /index一级路由的 二级路由
//因此 我们如果想访问 路由配置的页面 需要写作：/index/xxx

//3.调用listen方法 监听端口
app.listen(3000,()=>{
    console.log("服务器正在运行...")
})