Node【八】Express框架【二】

news2024/9/28 7:28:16

文章目录

  • 🌟前言
  • 🌟中间件
  • 🌟中间件函数
    • 🌟什么是中间件函数
    • 🌟中间件函数可以做什么
  • 🌟Express中间件的类型
    • 🌟应用级中间件
    • 🌟路由器级中间件
    • 🌟错误处理中间件
    • 🌟内置中间件
    • 🌟静态资源托管 express.static 中间件
    • 🌟第三方中间件
      • 🌟cookie-parser
      • 🌟express-session
  • 🌟Express应用生成器
    • 🌟安装应用生成器
    • 🌟基本使用
    • 🌟目录结构
  • 🌟写在最后

在这里插入图片描述

🌟前言

哈喽小伙伴们,新的专栏 Node 已开启;这个专栏里边会收录一些Node的基础知识和项目实战;今天我们开始这个专栏的第七篇文章,带领大家初识一下 Express框架 ;让我们一起来看看吧🤘

🌟中间件

Express 是一个路由和中间件组成的Web框架。

中间件是排列到管道中的处理程序,用于处理请求和响应。

在这里插入图片描述

🌟中间件函数

🌟什么是中间件函数

Express 应用程序本质上是一系列中间件函数调用。

中间件函数是可以访问请求对象 (req)、响应对象(res) 和next应用程序请求-响应周期中的函数的函数。该next函数是 Express 路由器中的一个函数,当被调用时,它会在当前中间件之后执行中间件。

function (req, res, next) {
    // 通过req操作请求对象
    // 通过res操作响应对象
    next() // 调用next()函数,可以调用下一个中间件
}

🌟中间件函数可以做什么

中间件函数可以执行以下任务:

  • 执行任何代码。
  • 更改请求和响应对象。
  • 结束请求-响应周期。
  • 调用堆栈中的下一个中间件。

中间件就是处理HTTP请求的函数,用来完成各种特定的任务,比如:

  • 检查用户是否登录
  • 添加公共方法。

🌟Express中间件的类型

如果当前中间件函数没有结束请求-响应循环,它必须调用next()以将控制权传递给下一个中间件函数。否则,请求将被挂起。

Express 应用程序可以使用以下类型的中间件:

  • 应用级中间件
  • 路由器级中间件
  • 错误处理中间件
  • 内置中间件
  • 第三方中间件

🌟应用级中间件

在Express程序中,使用 app.use()app.METHOD() 方法将中间件绑定到应用程序对象(app)。
在 Express 程序中,通过调用 app.use() 向管道中插入中间件。

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

app.use(function (req, res, next) {
    console.log('Time:', Date.now())
    next()
})

在 Express 程序中,通过调用 app.METHOD(PATH,MiddleWare,…,HANDLER) 向管道中插入中间件。

app.get('/user', function (req, res, next) {
    console.log('Request URL:', req.originalUrl)
    next()
}, function (req, res, next) {
    res.send('USER')
})

🌟路由器级中间件

**路由器级中间件的工作方式与应用级中间件相同,只是它绑定到 express.Router() **

var router = express.Router()

使用router.use()和router.METHOD()函数绑定路由器级中间件。

var express = require('express')
var app = express()
var router = express.Router()

router.use(function (req, res, next) {
    console.log('Time:', Date.now())
    next()
})

router.get('/user/:id', function (req, res, next) {
    console.log('Request URL:', req.originalUrl)
    next()
}, function (req, res, next) {
    console.log('Request Type:', req.method)
    next()
})

🌟错误处理中间件

与其他中间件函数相同的方式定义错误处理中间件函数,但是使用四个参数(err, req, res, next):

app.use(function (err, req, res, next) {
  console.error(err.stack)
  res.status(500).send('Something broke!')
})

🌟内置中间件

Express 具有以下内置中间件功能:

  • express.static提供静态资源,例如 HTML 文件、图像等。
  • express.json使用 JSON 有效负载解析传入请求。注意:可用于 Express 4.16.0+
  • express.urlencoded解析带有 URL 编码负载的传入请求。 注意:可用于 Express 4.16.0+

🌟静态资源托管 express.static 中间件

express.static 是 Express 内置的一个中间件,负责托管 Express 应用内的静态资源。如果要在网页中加载静态文件(css、js、img),就需要另外指定一个存放静态文件的目录

  • 项目目录下添加一个存放静态文件的目录为 public
  • 在public目录下在添加三个存放 js 、 css 、 img 的目录,把相关文件放到相应的目录下
  • 当浏览器发出文件请求时,服务器端就会到这个目录下去寻找相关文件
app.use(express.static(require('path').join(__dirname, 'public')));

🌟第三方中间件

🌟cookie-parser

npm install --save cookie-parser
app.use(require(cookie-parser)(秘钥放在这里);)

提供对 cookie 的支持。

🌟express-session

npm install --save express-session
app.use(require(express-session)());)

提供会话 ID(存在 cookie 里)的会话支持。默认存在内存里,不适用于生产环境,并且可以配置为使用数据库存储

🌟Express应用生成器

通过应用生成器工具 express-generator 可以快速创建一个应用的骨架。

🌟安装应用生成器

你可以通过 npx (包含在 Node.js 8.2.0 及更高版本中)命令来运行 Express 应用程序生成器(无需安装)。

$ npx express-generator

对于较老的 Node 版本,请通过 npm 将 Express 应用程序生成器安装到全局环境中并使用:

$ npm install express-generator -g

-h 选项可以列出所有可用的命令行选项:

$ express -h

  Usage: express [options] [dir]


  Options:

        --version        output the version number
    -e, --ejs            add ejs engine support
        --pug            add pug engine support
        --hbs            add handlebars engine support
    -H, --hogan          add hogan.js engine support
    -v, --view <engine>  add view <engine> support (dust|ejs|hbs|hjs|jade|pug|twig|vash) (defaults to jade)
        --no-view        use static html instead of view engine
    -c, --css <engine>   add stylesheet <engine> support (less|stylus|compass|sass) (defaults to plain css)
        --git            add .gitignore
    -f, --force          force on non-empty directory
    -h, --help           output usage information

🌟基本使用

例如,如下命令创建了一个名称为 myapp 的 Express 应用。此应用将在当前目录下的 myapp 目录中创建,并且设置为使用 ejs 模板引擎(view engine):

$ express --view=ejs myapp       
**或者简写**
$ express -e myapp
  warning: option `--ejs' has been renamed to `--view=ejs'

   create : myapp/
   create : myapp/public/
   create : myapp/public/javascripts/
   create : myapp/public/images/
   create : myapp/public/stylesheets/
   create : myapp/public/stylesheets/style.css
   create : myapp/routes/
   create : myapp/routes/index.js
   create : myapp/routes/users.js
   create : myapp/views/
   create : myapp/views/error.ejs
   create : myapp/views/index.ejs
   create : myapp/app.js
   create : myapp/package.json
   create : myapp/bin/
   create : myapp/bin/www

   change directory:
     $ cd myapp

   install dependencies:
     $ npm install

   run the app:
     $ DEBUG=myapp:* npm start

然后安装所有依赖包:

$ cd myapp
$ npm install

启动这个应用(MacOS 或 Linux 平台):

$ DEBUG=myapp:* npm start

Windows 平台使用如下命令:

set DEBUG=myapp:* & npm start

然后在浏览器中打开 http://localhost:3000/ 网址就可以看到这个应用了。

🌟目录结构

/
├── app.js                              入口文件
│
├── bin
│   └── www
│  
├── views                               # 存放视图文件 如jade,ejs,html等
│   ├── admin                           # 后台视图文件
│   │   ├── login.html
│   │   └── reg.html              
│   └── index                           # 前台视图文件
│       ├── index.html
│       ├── header.html
│       └── footer.html
│
├── controllers/                        # 控制器文件
│   
├── models/                             # 模型文件
│     
├── routes                              # 存放路由文件
│   ├── index.js                       
│   └── user.js                       
│
├── public                              # 存放image , css , js 等静态文件
│   ├── images/
│   ├── css/
│   └── js/
│
├── node_modules                        # 存放npm包  
│
└── package.json                        # npm包配置文件,工程信息以及模块依赖

🌟写在最后

更多Node知识以及API请大家持续关注,尽请期待。各位小伙伴让我们 let’s be prepared at all times!

✨原创不易,还希望各位大佬支持一下!
👍 点赞,你的认可是我创作的动力!
⭐️ 收藏,你的青睐是我努力的方向!
✏️ 评论,你的意见是我进步的财富!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/438774.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Pycharm设置.py文件模版和设置活动模版(代码自动补全)

一、设置.py文件模版 有时候我们想新建.py文件的时候&#xff0c;让这个文件里面默认有一些内容&#xff0c;比如utf-8编码修改&#xff0c;我们应该怎么在PyCharm中设置呢&#xff1f; 依次点击 File -> Settings -> Editor -> File and Code Template&#xff0c;进…

基于亚马逊云科技无服务器架构,开发者可以有效实现快速上线

开发一个“爆款”游戏总共需要几步&#xff1f;Marvel Snap可能会告诉你&#xff1a;第一步&#xff0c;专心致志把游戏做好、提高可玩性&#xff1b;第二步&#xff0c;把其他工作交给亚马逊云科技。 相关数据显示&#xff0c;自2022年10月18日正式发行以来&#xff0c;在不到…

Vue 条件语句

文章目录 Vue 条件语句条件判断v-ifv-elsev-else-ifv-show Vue 条件语句 条件判断 v-if 条件判断使用 v-if 指令&#xff1a; v-if 指令 在元素 和 template 中使用 v-if 指令&#xff1a; <div id"app"><p v-if"seen">现在你看到我了<…

Stereo-Detection:适合新手的双目测距开源项目

简介&#xff1a;Stereo-Detection 是一个传统的SGBM深度测距yolov5目标检测&#xff0c;并部署在Jeston nano的开源教程。它致力于让更多的大四学生毕业&#xff0c;以及让研一学生入门 开源链接&#xff1a;yzfzzz/Stereo-Detection: Conventional SGBM depth ranging yolov…

重要公告 | 关于88号公投和近期Moonbeam区块生产中断的根本原因分析

2023年4月5日&#xff0c;Moonbeam网络经历了短暂的区块生产暂停问题&#xff0c;这是已批准的88号公投带来的意外结果。该问题源于链上公投的批准结果先于runtime升级发布&#xff0c;然而对这次公投的调用顺序却被安排在了runtime升级之后的区块。本文提供了对该事件的详细事…

16、CycriptLogos

一、Cycript Cycript是由Cydia创始人Saurik推出的一款脚本语言,Cycript混合了OC、JavaScript语法的解释器,这意味着我们能够在一个命令中使用OC或者JavaScript,甚至两者并用.它能够挂钩正在运行的进程,能够在运行时修改很多东西. 官网下载/ MonkeyDev自动配置下载是一种脚本语…

浅析EasyCVR平台基于B/S架构的技术特点与应用

EasyCVR基于云边端协同&#xff0c;可支持海量视频的轻量化接入与汇聚管理。平台兼容性强、拓展度高&#xff0c;可提供视频监控直播、视频轮播、视频录像、云存储、回放与检索、智能告警、服务器集群、语音对讲、云台控制、电子地图、平台级联等功能。 EasyCVR视频融合平台采用…

手把手教你针对层级时间轮(TimingWheel)延时队列的实战落地

承接上文 承接上文&#xff0c;让我们基本上已经知道了「时间轮算法」原理和核心算法机制&#xff0c;接下来我们需要面向于实战开发以及落地角度进行分析如何实现时间轮的算法机制体系。 前言回顾 什么是时间轮 调度模型&#xff1a;时间轮是为解决高效调度任务而产生的调…

Delphi大师弗兰克·宝兰德(Frank Borland)回来了!

弗兰克宝兰德&#xff08;Frank Borland&#xff09; begin 弗兰克宝兰德&#xff08;Frank Borland&#xff09;的名字其实代表的是我们这些长期坚守Delphi的老程序员。但并非所有Delphi新开发人员都熟悉Borland。 弗兰克宝兰德是谁&#xff1f;他来自哪里&#xff1f;他的主…

动力节点Springsecurity笔记01-05认证入门

1 问题 如何保护我们的程序&#xff1f; 1.1 创建code目录 目的&#xff1a;后面的security工程均在此目录下学习 创建code目录&#xff0c;并使用idea打开 1.2 不使用安全框架的springboot web程序 1.2.1 新建子模块springboot-01-hello [外链图片转存失败,源站可能有防盗…

全志V85x MPP模块概述以及编译sample步骤

本文转载自&#xff1a;https://bbs.aw-ol.com/topic/3286/ 1. MPP 模块概述 MPP 系统控制模块&#xff0c;根据芯片特性&#xff0c;完成硬件各个部件的复位、基本初始化工作&#xff0c;同时负责完成 MPP&#xff08;Media Process Platform 媒体处理平台&#xff09;系统各…

索引失效了?看看这几个常见的原因!

索引是 MySQL 数据库中优化查询性能的重要工具&#xff0c;通过对查询条件和表数据的索引&#xff0c;MySQL可以快速定位数据&#xff0c;提高查询效率。但是&#xff0c;在实际的数据库开发和维护中&#xff0c;我们经常会遇到一些情况&#xff0c;导致索引失效&#xff0c;从…

2、八个JS中你见过的类型

1、前言 为一个变量指定类型的语法是使用"变量: 类型"的形式&#xff0c;如下&#xff1a; let num: number 123如果你没有为这个变量指定类型&#xff0c;编译器会自动根据你赋给这个变量的值来推断这个变量的类型&#xff1a; let num 123 num abc // error 不…

最简洁快速的kaggle注册(无需翻墙)

目录 1.打开浏览器&#xff0c;点击搜索栏最后3个点点 2.点击扩展&#xff0c;会到一个新页面 3.搜索获取&#xff08;安装插件&#xff09; 4.获取之后&#xff0c;网页搜索栏右边会出现该插件&#xff1a; 5.点击管理&#xff1a; 6.在下载规则中&#xff0c;填入下面的地…

SpringBoot整合JWT

一、What is JWT&#xff1f; Json web token (JWT)&#xff0c;是为了在网络应用环境间传递声明而执行的一种基于 JSON 的开放标准&#xff08;(RFC 7519)&#xff0c;该 token 被设计为紧凑且安全的&#xff0c;特别适用于分布式站点的单点登录&#xff08;SSO&#xff09;场…

认识Spring 和 IoC

目录 何为Spring 1. 何为容器 2. 何为 IoC 2.1 传统的程序开发&#xff1a;耦合性太高 2.2 解决传统开发中的缺陷 2.3 对比总结&#xff1a;IoC的实现思想 3. 理解Spring IoC 4. 理解 DI 5. 总结 何为Spring Spring是一个包含了众多工具方法的 IoC 容器&#xff1…

【Scala入门】Scala下载及安装(Windows)以及Idea创建第一个scala项目

目录 一、安装准备 二、Scala下载安装 三、Idea 创建Scala项目 一、安装准备 在安装之前&#xff0c;确保你的电脑上装有Jdk 8&#xff08;Jdk 1.8&#xff09;&#xff0c;且环境变量配置正确。如果没有安装Jdk&#xff0c;请参照其他文章先安装Jdk 8&#xff08;Jdk 1.8&a…

vue3之Teleport传送组件

一、前言 Teleport 是 Vue3.x 新推出的功能&#xff0c; 没听过这个词的小伙伴可能会感到陌生&#xff1b;翻译过来是传送的意思&#xff0c;可能还是觉得不知所以&#xff0c;没事下边我就给大家形象的描述一下。 二、Teleport 是什么呢&#xff1f;干嘛用的&#xff1f; T…

【PMP】敏捷项目月报模板

敏捷项目月报怎么写呢&#xff1f;和普通项目周报有什么不同呢&#xff1f;不知道大家思考过没有&#xff1f; 为此咱们把敏捷项目月报和普通项目月报进行了对比&#xff0c;并且给出了一个参考月报模板和实例&#xff0c;供大家参考。 敏捷项目月报模板 [项目名称]敏捷月报 …

大屏如何打造智慧城市?30张大屏模板送你,零代码基础也会用

超500个智慧城市在路上了 根据国际数据公司&#xff08;IDC&#xff09;最新发布的《全球半年度智慧城市支出指南》显示&#xff0c;2023年全球智慧城市支出预计将达到1895亿美元。中国智慧城市市场在2023年规模将达到389.2亿美元&#xff0c;超过全球平均水平 德勤咨询发布的一…