Express学习(一)

news2024/11/18 21:29:56

Express

Express简介

  • 什么是Express
    官方给出的概念:Express是基于Node.js平台,快速、开放、极简的web开发框架。
    通俗的理解:Express的作用和Node.js内置的http模块类似,是专门用来创建Web服务器的。
  • 进一步理解Express
    • 不使用Express能否创建Web服务器?
      答案是可以,就之前章节提到的使用 Node.js提供的http模块即可。
    • 那有了http模块为什么还用Express?
      因为http内置模块使用起来比较复杂,开发效率低;Express是基于内置的http模块进一步封装出来的,能够极大的提高开发效率。
    • http内置模块和Express是什么关系?
      类似于浏览器中Web API和 jQuery的关系。后者是基于前者进一步封装出来的。
  • Express可以做什么
    对于前端程序员来说,最常见的两种服务器,分别是:
    • Web网站服务器:专门对外提供Web网页资源的服务器。
    • API接口服务器:专门对外提供API接口的服务器。
      使用Express,我们可以方便、快速的创建Web网站的服务器或API接口的服务器。

Express的基本使用

  • 安装
    在项目所处的目录中打开终端,运行npm i express终端命令,即可将express安装到项目中使用,也可以自己指定版本号,之前讲过如何指定版本号。在安装完成后可以观察项目的配置文件,发现添加了express的相关信息。
  • 创建基本的Web服务器
    步骤跟之前章节学习的http模块创建Web服务器类似
  • 简单介绍get请求和post请求
    • GET请求具体含义如下:
      • 获取数据:GET请求被设计用来请求访问服务器上的资源。用户可以通过指定URL并附加查询参数的方式,来获取服务器上的数据。
      • 幂等性:GET请求具有幂等性,意味着无论请求多少次,服务器上的数据都不会发生变化。这是因为GET请求仅用于数据的检索,而不涉及任何数据的创建、修改或删除操作。
      • 缓存友好:由于GET请求的幂等性和安全性,它们可以被网络代理和浏览器缓存,从而提升效率和性能。
      • 不适合敏感信息:因为GET请求的参数直接暴露在URL中,所以它不适合传递敏感信息,如密码和个人身份信息等。
    • POST请求具体含义如下:
      • 提交数据:POST请求通常用于提交数据到服务器,比如在表单提交时使用。与GET请求不同,POST请求将数据包含在请求体中,而不是URL中。
      • 非幂等性:POST请求是非幂等的,可以用于更新资源,或者向服务器发送应该被处理的数据。每次POST请求可能会改变服务器的状态或产生不同的结果。
      • 隐私性更好:因为POST请求的数据不在URL中显示,所以相比GET请求更加适合传输敏感信息。
      • 编码灵活:POST请求支持多种数据编码方式,并且传送的数据量也没有像GET请求那样受到限制。
  • 监听GET请求
    通过app.get()方法,可以监听客户端的GET请求,具体的语法格式如下
//参数1:客户端请求的URL地址
//参数2:请求对应的处理函数
//      req:请求对象(包含了与请求相关的属性与方法)
//      res:响应对象(包含了与响应相关的属性与方法)
app.get('请求URL', function(req, res) {/*处理函数*/})
  • 监听POST请求
    通过app.post()方法,可以监听客户端的POST请求,具体的语法格式如下
//参数1:客户端请求的URL地址
//参数2:请求对应的处理函数
//      req:请求对象(包含了与请求相关的属性与方法)
//      res:响应对象(包含了与响应相关的属性与方法)
app.post('请求URL', function(req, res) {/*处理函数*/})
  • 把内容响应给客户端
    通过res.send()方法,可以把处理好的内容发送给客户端:
app.get('/user', (req, res) => {
//向客户端发送JSON对象
res.send({ name: 'zs', age: 20, gender: '男' })
})

app.post('/user', (req, res) => {
//向客户端发送文本内容
res.send('请求成功')
})
  • 获取URL中携带的查询参数
    通过req.query对象,可以访问到客户端通过查询字符串的形式,发送到服务器的参数:
app.get('/', (req, res) => {
//req.query默认是是一个空对象
//客户端使用 ?name=zs&age=20 这种查询字符串的形式,发送到服务器的参数
//可以通过 req.query 对象访问到,例如
//req.query.name  req.query.age
console.log(req.query)
})
  • 获取URL中的动态参数
    通过req.params对象,可以访问到URL中通过 :匹配到的动态参数:
//URL地址中,可以通过 : 参数名的形式,匹配动态参数值
app.get('/user/:id', (req, res)  => {
//req.params默认是一个空对象
//里面存放着通过 : 动态匹配到的参数值
console.log(req.params)
})
  • 示例
//导入express
const express = require('express')
//创建web服务器
const app = express()

//监听客户端的GET和POST请求,并向客户端响应具体的内容
//参数1:客户请求的URL地址
//参数2:请求对应的处理参数
//      req:请求对象(包含了与请求相关的属性与方法)
//      res:响应对象(包含了与相应相关的属性与方法)
app.get('/user', (req, res) => {
  //调用express提供的res.send()方法,向客户端响应一个JSON对象
  res.send({ name: 'zs', age: 20, gender: '男' })
})

app.post('/user', (req, res) => {
  //调用express提供的res.send()方法,向客户端响应一个文本字符串
  res.send('请求成功')
})

app.get('/', (req, res) => {
  //通过req.query可以获取到客户端发送过来的查询参数
  //注意:默认情况下,req.query是一个空对象
  console.log(req.query)
  res.send(req.query)
})

//注意:这里的 :id是一个动态的参数,:是固定的,但是id可以换成任意一个合法的名称
//如果有多个参数,可以继续添加,例如/user/:id/:name,网址就类似于http://127.0.0.1/user/6/zs
app.get('/user/:id', (req, res) => {
  //req.params是动态匹配到的URL参数,默认也是一个空对象
  console.log(req.params)
  res.send(req.params)
})

//调用app.listen(端口号,启动成功后的回调函数),启动服务器
app.listen(80, () => {
  console.log('express server running at http://127.0.0.1')
})

首先尝试获取URL中携带 的查询参数,首先需要启动服务器,然后 复制该 网址,后面输入?及参数,如下

然后获取URL中的动态参数,如下

在这里插入图片描述
###托管静态资源

  • express.static()
    express提供了一个非常好用的函数,叫做express.static(),通过它,我们可以非常方便的创建一个静态资源服务器,例如通过如下代码就可以 将public目录下的图片、css文件、javascript文件对外开放访问了:
    app.use(express.static('public'))
    然后就可以访问该目录中的所有文件了,例如http://localhost:3000/css/style.css
    注意:Express在指定的静态目录中查找文件,并对外提供资源的访问路径,因此,存放静态文件的目录名不会出现在URL中。
    例如在该文件下有test目录 ,里面存放了html、css和js文件,通过以下代码对外开放
const express = require('express');
const app = express()

//在这里调用express.static()方法,快速对外提供静态资源
app.use(express.static('./test'))

app.listen(80, () => {
  console.log('express server running at http://127.0.0.1')
})

运行后test.html文件调用如下,同样也可以调用该目录下的其它文件

  • 托管多个静态资源目录
    如果托管多个静态资源目录,直接多次调用express.static()函数,在访问静态资源文件时,express.static()函数会根据目录的添加 顺序查找所需的文件。注意是按照顺序查找,如果多个目录有重名的文件,那他会显示最先添加的目录里的文件。
  • 挂载路径前缀
    如果希望在托管的静态资源访问路径之前挂载路径前缀,可以使用如下方式,就可以使用目录名进行访问,避免出现重复文件而导致的问题
    app.use('/test', express.static('test'))

nodemon

  • 为什么要使用nodemon
    因为在编写调试Node.js项目的时候,如果 修改了项目的代码,需要频繁的保存然后重新启动才能应用新代码,很麻烦。
    现在我们可以使用nodemon这个工具,它能够监听项目文件的变动,当代码修改后,nodemon会自动帮我们重启项目,很方便开发和调试。
  • 安装nodemon
    在终端中运行如下命令,即可将nodemon安装为全局可用的工具
    npm install -g nodemon
  • 使用nodemon
    当基于Node.js编写一个网站应用的时候,传统的方式是运行node app.js命令来启动项目,这样做的坏处是代码被修改之后需要手动重启项目。
    现在我们可以将node命令替换为nodemon命令,使用nodemon app.js来启动项目,这样当代码被修改保存之后,会被nodemon监听到,从而时间自动重启项目的效果。如下
    在这里插入图片描述

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

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

相关文章

GIS之深度学习10:运行Faster RCNN算法

(未完成,待补充) 获取Faster RCNN源码 (开源的很多,论文里也有,在这里不多赘述) 替换自己的数据集(图片标签文件) (需要使用labeling生成标签文件&#xf…

Spring MVC 面试题及答案整理,最新面试题

Spring MVC中的DispatcherServlet是什么,它如何工作? DispatcherServlet是Spring MVC中的核心组件,负责协调不同的请求处理器。它的工作流程包括: 1、请求接收: 接收HTTP请求,并将其转发到相应的处理器。…

14:Hadoop数据分析|节点管理|搭建NFS网关服务

数据分析|节点管理|搭建NFS网关服务 HDFS文件系统的使用调用Hadoop集群分析数据Hadoop集群的维护增加修复节点删除节点 搭建NFS网关服务创建账户并授权在nfsgw上运行网关服务NFSGW测试 HDFS文件系统的使用 访问文件系统的两种方式: web页面…

Java Swing游戏开发学习8

内容来自RyiSnow视频讲解 上一节提到的bug,不知道有没有人发现? 在播放音乐和音效的时候使用的是同一个clip对象,播放背景音乐在前,后续播放音效,clip对象就被覆盖了,因此导致调用停止播放背景音乐的时候&a…

大厂大面积裁员,计算机专业还香吗?

对比大部分专业,计算机专业肯定还是香的啊 近些年,随着计算机行业薪资的提高,成为了热门专业。 还有不少人通过考研转向计算机类的专业,足见其还是很香的。 计算机类考研需要准备的内容很多,其中408是必考的科目&am…

PyTorch搭建LeNet神经网络

函数的参数 1、PyTorch Tensor的通道排序 [batch, channel, height, width] batch: 要处理的一批图像的个数 channel: 通道数(一般是R G B 三个通道) height: 图像的高度 width: 图像的宽度 2.Conv 2d 卷积层的参数 [in_channels, out_channels, ke…

从零开始学习PX4源码2(PX4姿态误差计算)

目录 文章目录 目录摘要1.源码1.1源码路径1.2源码程序1.3源码功能 2.源码分析 摘要 本节主要记录PX4姿态误差计算过程,欢迎批评指正。 1.源码 1.1源码路径 PX4-Autopilot/src/modules/mc_att_control/AttitudeControl/AttitudeControl.cpp1.2源码程序 matrix::…

JetBrains TeamCity 身份验证绕过漏洞(CVE-2024-27198)

免责声明:文章来源互联网收集整理,请勿利用文章内的相关技术从事非法测试,由于传播、利用此文所提供的信息或者工具而造成的任何直接或者间接的后果及损失,均由使用者本人负责,所产生的一切不良后果与文章作者无关。该…

从零开始在kitti数据集上训练yolov5

0.准备工作 0.1 在kitti官网下载kitti数据集 KITTI官网:https://www.cvlibs.net/datasets/kitti/eval_object.php?obj_benchmark2d 只需要下载图片和标签 解压后应该有一个training和和testing文件夹,training文件夹下应该有一个image_2文件夹和一个…

(vue)适合后台管理系统开发的前端框架

(vue)适合后台管理系统开发的前端框架 1、D2admin 开源地址:https://github.com/d2-projects/d2-admin 文档地址:https://d2.pub/zh/doc/d2-admin/ 效果预览:https://d2.pub/d2-admin/preview/#/index 开源协议:MIT 2、vue-el…

通过Apple Configurator 2导出iOS ipa包

通过Apple Configurator 2导出iOS ipa包 安装Apple Configurator 2 从Mac AppStore安装Apple Configurator 2 下载ipa 准备工作: 1、 电脑已经安装了Apple Configurator 2 2、 手机已经安装了目标软件 3、 Apple 账号已经下载过目标软件 打开后连接设备&#xf…

Node.js安装及环境配置详细教程

一、下载Node.js安装包 官网下载链接[点击跳转] 建议下载LTS版本(本教程不适用于苹果电脑) 二 、安装Node.js 2.1 下载好安装包后双击打开安装包,然后点击Next 2.2 勾选同意许可后点击Next 2.3 点击Change选择好安装路径后点击Next&#…

基于springboot实现在线考试系统项目【项目源码+论文说明】计算机毕业设计

基于springboot实现在线考试系统演示 摘要 时代在变化,科技技术以无法预测的速度在达到新的高度,并且被应用于社会生活的各个领域,随着生活的加快,也使很多潜在的点逐渐突显出来,社会对于人才的要总是非常迫切的&…

Claude 3 模型发布,压力来到OpenAI这边了~

Anthropic 发布了 Claude 3 系列,包含了三款模型 各具特色,旨在为用户提供更智能、更快速、更高效的选择,可以说是是迄今为止最快、最强大的人工模型! Anthropic 一度是 OpenAI 最强力的竞争对手! 随着 Claude3 的发…

优优嗨聚集团:美团代运营服务,商家增长的新引擎

在当今数字化时代,线上平台已成为商家拓展业务、提升品牌影响力的重要渠道。美团作为国内领先的本地生活服务平台,拥有庞大的用户群体和丰富的商业资源。然而,对于许多商家而言,如何在美团平台上进行有效运营,实现业务…

java核心面试题汇总

文章目录 1. Java1.1. TCP三次握手/四次挥手1.2 HashMap底层原理1.3 Java常见IO模型1.4 线程与线程池工作原理1.5 讲一讲ThreadLocal、Synchronized、volatile底层原理1.6 了解AQS底层原理吗 2. MySQL2.1 MySQL索引为何不采用红黑树,而选择B树2.2 MySQL索引为何不采…

【中国电信】光猫 PT632 使用超管权限修改 IP 地址租期时间

背景 由于光猫默认设置的动态 IP 租期是 24 小时,所以每天都会断网一次,严重影响用网体验,所以打算通过修改动态 IP 租期为 一周(最长就一周,没有永久的选项)来改善。 需求 一台电脑(已开启 …

Git保姆级使用教程

一、版本控制 1.1 团队开发问题 企业项目一般以团队形式实施开发,那团队开发中会出现哪些问题呢? 小明负责的模块就要完成了,就在即将Release之前的一瞬间,电脑突然蓝屏,硬盘光荣牺牲!几个月来的努力付之…

【OBS】obs-websocket实战技巧,让你更快的了解OBS

▒ 目录 ▒ 🛫 导读开发环境 1️⃣ 修改OBS-web源码2️⃣ 常用api汇总获取输入源类型列表获取输入源列表获取属性列表打开输入源属性设置框获取设置输入源静音状态获取特殊输入源设置(全局音频设备)打开输入源属性设置框 🛬 文章小…

vue3 ts setup 组合式API 使用教程

vue3中新增了组合式API,本文讲解组合式API setup 的使用 关于setup 的出现和 vue3 js setup 的使用,笔者已经在2022年的文章中说明,这里不再赘述,需要的朋友可以阅读:《vue3 setup 使用教程》 官网文档:h…