首秀 Express 框架

文章目录

    • 框架特性
    • express的使用
        • 初始化项目:
        • 下载框架模块:
        • 测试代码:
        • 总结以上代码:
    • 请求处理的中间件
        • 概念:
        • 中间件——app.use
        • 基本用法:
        • next的用法
    • app.use中间件的应用
        • 路由的保护
        • 网站维护公告
        • 自定义404(当用户输入与路由不匹配网址时)
    • 错误处理中间件
        • 同步错误处理
          • 总结上面代码:
        • 异步错误
        • 在回调函数中使用next
    • 写在最后

框架特性

  1. 提供了方便简洁的路由定义方式
  2. 获取HTTP请求参数进行了简化处理
  3. 对模板引擎支持程度高,方便渲染动态HTML
  4. 提供了中间件机制有效控制HTTP请求
  5. 拥有大量第三方中间件对功能进行扩展

express的使用

初始化项目:

npm init -y

下载框架模块:

npm i express

测试代码:

const express = require('express')
const app = express()
app.get('/', (req, res) => {// res.send('你好,Express!')//输出文本res.send({name:'zss'})//输出json格式对象
})
app.listen(3000, () => {console.log('Server is running at http://127.0.0.1:3000')
})

总结以上代码:

  • 引入express框架模块
  • send 方法相较于 nodejs 原生的 end 方法更加强大 不同设置相应有的 content-tye
  • 此方法会自动根据返回的数据设置相应的响应头

请求处理的中间件

  • 中间件就是以对方法,可以接受客户端发来的请求,可以对请求作出响应,
  • 也可以将请求继续交给下一 个中间件继续处理
  • 登录就可以使用中间件进行拦截处理

在这里插入图片描述

概念:

  • 中间件主要由两部分组成:中间件方法以及请求处理函数
  • 中间件方法由express提供,负责拦截请求,请求处理函数由开发人员提供,负责处理请求
  • 其实路由就是中间件
app.get('/', (req, res) => {res.send('<h1>hello,express</h1>') // 输出html文本})//匹配以get方式请求的/路由

中间件——app.use

这里以 app.use 中间件为例,讲解中间件的用法

  1. app.use 匹配所有请求方式和请求路径,可以直接传入请求处理函数
  2. app.use 第一个参数可以传入请求地址,代表无论什么请求方式,只要请求的是这个地址就接收这 个请求

基本用法:

const express = require('express')
const app = express()
app.use((req, res) => {res.send('你不错!')
})
app.get('/', (req, res) => {res.send('我是主页')
})
app.get('/new', (req, res) => {res.send('我是添加')
})
app.listen(3000, () => {console.log('Server is running at http://127.0.0.1:3000')
})
  • app.use会接收所有传递方式中的所有路由 导致后面的路由不会继续匹配
    在这里插入图片描述
    在这里插入图片描述

next的用法

默认情况下,如果前面的路由已经匹配上,如果后面还有中间件,则不会执行,需要使用 next ,才会 向后执行
在这里插入图片描述
在这里插入图片描述

app.use中间件的应用

路由的保护

客户端在访问需要登录的页面时,可以先使用中间件判断用户登录状态,用户如果未登 录,则拦截请求,直接响应,禁止用户访问需要登录的页面

  1. 如果用户未登录
    在这里插入图片描述
    在这里插入图片描述
  2. 如果用户已经登录
    在这里插入图片描述
    在这里插入图片描述

网站维护公告

在所有路由的最上面定义接收所有请求的中间件,直接为客户端作出响应,网站正 在维护中
在这里插入图片描述
在这里插入图片描述

自定义404(当用户输入与路由不匹配网址时)

const express = require('express')
const app = express()app.get('/', (req, res) => {res.send('我是主页')
})
app.get('/new', (req, res) => {res.send('我是添加')
})//当用户访问地址与以上路由均不匹配时 进入下面的路由 因为下面会匹配任何路由
app.use((req, res, next) => {res.status(404).send('你访问的地址不存在')
})app.listen(3000, () => {console.log('Server is running at http://127.0.0.1:3000')
})

在这里插入图片描述

错误处理中间件

程序中有两类错误

  1. 代码错误,这个在开发调试阶段就可以解决掉
  2. 运行时错误:程序运行时才可能出现的错误,如读取的文件不存在,连接数据库时数据库服务没有 启动,这类错误的发生与我们的代码没有关系

同步错误处理

同步错误发生后,错误处理能够自动捕捉
下面手动的制造一个错误并抛出,错误处理能够获取错误信息

在这里插入图片描述
在这里插入图片描述

总结上面代码:

不仅仅局限于手动抛出的错误 错误中间件才能够捕获 还包括同步中的调用未定义的方法 含有语法错误的对象 解析json字符串的错误

异步错误

异步错误发生后,错误处理中间件无法自动捕捉:使用next执行错误处理

例如:读取不存在的文件错误
在这里插入图片描述

在回调函数中使用next

在这里插入图片描述
在这里插入图片描述

写在最后

原创不易,还希望各位大佬支持一下\textcolor{blue}{原创不易,还希望各位大佬支持一下}

👍 点赞,你的认可是我创作的动力!\textcolor{green}{点赞,你的认可是我创作的动力!}

⭐️ 收藏,你的青睐是我努力的方向!\textcolor{green}{收藏,你的青睐是我努力的方向!}

✏️ 评论,你的意见是我进步的财富!\textcolor{green}{评论,你的意见是我进步的财富!}

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

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

相关文章

云原生技能树测评

前言 利用午休后的10多分钟时间&#xff0c;看了看APP的技能树板块&#xff0c;简单的提出几个看法&#xff01; 答题过程 可以设置为闯关类型&#xff0c;答对一道后可以进入下一关&#xff0c;或者是一个章节为一关&#xff0c;让大家一直有一种期待 回答错误数量 可以…

原型和闭包

原型和闭包 一切皆对象 一切皆对象&#xff08;类型值除外&#xff09; undefined, number, string, boolean属于简单的值类型 函数、数组、对象、new Number(10)都是对象。他们都是引用类型 Null是基本数据类型&#xff0c;不是引用数据类型 基本数据类型的值就是它本身的值&a…

一文教会你何为重绘、回流?

文章目录css图层图层创建的条件重绘(Repaint)回流触发重绘的属性触发回流的属性常见的触发回流的操作优化方案requestAnimationFrame----请求动画帧写在最后学习目标&#xff1a; 了解前端Dom代码、css样式、js逻辑代码到浏览器展现过程了解什么是图层了解重绘与回流了解前端层…

js函数、js对象的这些点你真的懂吗?

本篇学习目标 ✨了解函数&#xff08;高级&#xff09;原型原型链概念\textcolor{green}{了解函数&#xff08;高级&#xff09;原型原型链概念}了解函数&#xff08;高级&#xff09;原型原型链概念 ✨掌握函数作用域\textcolor{green}{掌握函数作用域}掌握函数作用域 ✨掌握…

前端处理跨域的几种方式

什么是跨域&#xff1f; 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源&#xff0c;这里跨域是广义的。 广义的跨域&#xff1a; 1、资源跳转&#xff1a;A链接、重定向、表单提交 2、资源嵌入&#xff1a; <link>、<script>、<img>、<frame&g…

程序员必知的缓存套图

文章目录1. 线程与进程1.1 进程:1.2. 线程:1.3. 关系2. 浏览器内核模块组成4. 事件循环机制5. 缓存5.1. 缓存理解5.2. 缓存分类5.3. 缓存使用示意图5.4. 缓存中的header参数1. 线程与进程 1.1 进程: 进程是计算机中的程序关于某数据集合上的一次运行活动&#xff0c;是系统进…

安装webpack及使用

前言 你是否也是只会运用框架中集成好的Webpack配置呢&#xff1f;你明白每一项的意义么&#xff1f;你懂多少Webpack的个性化配置项呢&#xff1f;本篇文章为你讲解Webpack中的各种配置项参数及作用&#xff01; 文章目录了解Webpack相关开启项目编译打包应用使用webpack配置…

php单例型(singleton pattern)

搞定&#xff0c;吃饭 <?php /* The purpose of singleton pattern is to restrict instantiation of class to a single object. It is implemented by creating a method within the class that creates a new instance of that class if one does not exist. If an obje…

助你提高效率的几个Vue指令

前言 很多使用Vue的同学往往最容易忽略的指令&#xff0c;由于在这里考虑到很多初学甚至还没有开始接触Vue的同学呢&#xff0c;在介绍v-clos之前呢就先以大家都熟知的v-model编写小demo v-model 相信大家对v-model并不陌生&#xff0c;简单来讲他就是用于在表单控件以及组建…

掌握Mock摆脱后端同学的束缚

文章目录前言Mock概述mock.js安装Mock规范Mock的使用总结前言 当下采用前后端分离模式开发Web应用已经成为气候&#xff0c;在开发阶段有一个不成文的规定则是 项目开发后端先行 但是作为前端开发工程师的我们&#xff0c;难道在搭建完页面后只能等待后端的接口么&#xff1f;…

Vue技能树上线啦

前言 前端现在越来越多样化&#xff0c;语言众多&#xff0c;大家使用的框架也比较杂&#xff0c;在广泛的前端技术栈面前我唯爱Vue&#xff08;仅代表个人观点勿喷小伙伴们&#xff09;可能很多人觉得我是因为简单&#xff0c;其实并不然&#xff0c;我尝试过很多框架&#x…

《SpringMVC从入门到放肆》一、概述

一、SpringMVC概述 ViewServiceDaoDBSpring MVCinterfaceinterfaceMysqlimplsimplsSpringMVC也叫Spring web mvc&#xff0c;属于表现层框架。SpringMVC是Spring框架的一部分&#xff0c;是在Spring3.0后发布的。 二、第一个SpringMVC程序功能描述&#xff1a;  用户提交一个…

手握流量密码,万粉不是梦

前言 可能大家来到CSDN的目的初衷都是不一样的&#xff0c;像我注册CSDN的时候完全是为了解决自己项目中的各种问题&#xff0c;能够有一个为我提供正确答案、正确解决方案的一个平台&#xff0c;简单的了解后我选择CSDN&#xff0c;直到成为现在的创作者也说明我的选择是对的…

秋季学期学习总结

转载于:https://www.cnblogs.com/zx666/p/10408950.html

一文带你了解React框架

前言 由于 React的设计思想极其独特&#xff0c;属于革命性创新&#xff0c;性能出众&#xff0c;代码逻辑却非常简单。所以&#xff0c;越来越多的人开始关注和使用&#xff0c;认为它可能是将来 Web 开发的主流工具。 这个项目本身也越滚越大&#xff0c;从最早的UI引擎变成…

Web前端JQuery面试题(一)

Web前端JQuery面试题&#xff08;一&#xff09; 一&#xff1a;选择器 基本选择器 什么是#id&#xff0c;element&#xff0c;.class&#xff0c;*&#xff0c;selector1, selector2, selectorN&#xff1f;答&#xff1a; 根据给定的id匹配一个元素&#xff0c;用于搜索&…

前端云原生——微信小程序云服务配置

前端同样涉及云原生前言创建使用云开发项目搭建云环境测试云服务1. 获取openid&#xff08;上传本地login云函数&#xff09;1.1 创建部署login文件时报错2. 自定义sum函数并创建部署3. 上传图片4. 前端操作数据库5. 即时通信demo面试法宝欢迎各位小伙伴们&#xff01; 为大家推…

45天带你玩转Node(第一天)初探Node.js

45天带你玩转Node 粉丝要求博主系统的写一篇关于Node.js的学习资料&#xff0c;但其实我们的Node.js知识点并不少&#xff0c;所以博主为大家搭建了一个专栏&#xff0c;为了方便大家系统的学习Node.js&#xff0c;大家记得订阅哦&#xff01;虽然我们的Node.js还很年轻&#…

【转载】 安卓版手机微信如何清理微信空间

在手机微信的使用过程中&#xff0c;随着手机微信使用的时间越长&#xff0c;手机微信占用的空间越大&#xff0c;其实手机微信存储了很多聊天记录包括图片、视频等大文件信息&#xff0c;此时如果手机存储空间比较紧张&#xff0c;可以使用微信自带的清理工具对手机微信空间进…

45天带你玩转Node(第二天)走进Node.js

45天带你玩转Node 粉丝要求博主系统的写一篇关于Node.js的学习资料&#xff0c;但其实我们的Node.js知识点并不少&#xff0c;所以博主为大家搭建了一个专栏&#xff0c;为了方便大家系统的学习Node.js&#xff0c;大家记得订阅哦&#xff01;虽然我们的Node.js还很年轻&#…