[Node.js] Get to know express and create a basic web server:


1. First introduction to Express

【1】Express Introduction

【1-1】什么是 Express
Express’s Chinese official website: http://www.expressjs.com.cn/
Insert image description here

【1-2】进一步理解 Express
Insert image description here

【1-3】Express 能做什么
Insert image description here

【2】Basic use of Express

Insert image description here
Insert image description here
Insert image description here

Insert image description here
Insert image description here
Insert image description here
Insert image description here

【3】Host static resources

【3-1】express.static()
Insert image description here

【3-2】托管多个静态资源目录
Insert image description here

【3-3】挂载路径前缀
Insert image description here

[Case] Insert image description here
默认显示没有前缀的静态资源目录​​If there are multiple static resource directories without prefixes, load the first one
(if the previous directory is not available, then load the later directory)Insert image description hereInsert image description here

[4] nodemon

【4-1】为什么要使用 nodemon( https://www.npmjs.com/package/nodemon )
But if vs code turns on automatic saving, nodemon will keep restarting the project, and an error will occur. Solution: ctrl+c=》 Start the project (or turn off autosave)
Insert image description here

【4-2】安装 nodemon与使用
Insert image description here
Insert image description here

2. Express routing

【1】The concept of routing

Insert image description here
Insert image description here

【2】Use of routing

【2-1】最简单的用法
Insert image description here

【2-2】模块化路由
Insert image description here
【Case】
(1) Create routing module
Insert image description here
(2) Register routing module
Insert image description here

3. Express middleware

【1】The concept of middleware

【1-1】什么是中间件
Insert image description here

【1-2】Express 中间件的调用流程
Insert image description here

【1-3】Express 中间件的格式
Insert image description here

【1-4】next 函数的作用
Insert image description here

【2】First experience with Express middleware

【2-1】定义中间件函数
Insert image description here

【2-2】全局生效的中间件
Insert image description here
Insert image description here
Insert image description here

【2-3】中间件的作用
Insert image description here

【2-4】局部生效的中间件
Insert image description here
Insert image description here

【2-5】了解中间件的5个使用注意事项
Insert image description here

【3】Classification of middleware

Insert image description here

【3-1】应用级别的中间件
Insert image description here

【3-2】路由级别的中间件
Insert image description here

【3-3】错误级别的中间件
Insert image description here

【3-4】Express内置的中间件
Insert image description here

【3-5】路由级别的中间件
Insert image description here

【4】Customized middleware

[4-1] Requirement description and implementation steps Insert image description hereInsert image description here
[4-2] Encapsulate custom middleware into modules
Insert image description here
Insert image description here
Insert image description here

4. Use Express writing interface

【1】Create a basic server

Insert image description here

【2】Create API routing module

Insert image description here

【3】Write GET interface

Insert image description here

【4】Write POST interface

Insert image description here

【5】CORS cross-domain resource sharing

Insert image description here

Insert image description here

【5-1】使用 cors 中间件解决跨域问题
Insert image description here

【5-2】什么是 CORS
Insert image description here
Insert image description here

【5-3】CORS 响应头部 - Access-Control-Allow-Origin
Insert image description here
Insert image description here

【5-4】CORS 响应头部 - Access-Control-Allow-Headers
Insert image description here

【5-5】CORS 响应头部 - Access-Control-Allow-Methods
Insert image description here

【5-6】CORS请求的分类
Insert image description here
Insert image description here
Insert image description here
Insert image description here
Insert image description here

【6】JSONP interface

Insert image description here
Insert image description here
Insert image description here
Insert image description here
Insert image description here

【Case】
Insert image description here
Insert image description here
Insert image description here

Guess you like

Origin blog.csdn.net/weixin_53791978/article/details/132888817