Node.js开发-express框架

express框架

  • 1) 介绍
  • 2) express 路由
  • 3) express 响应设置
  • 4) express 其他响应
  • 5) express中间件
  • 6) 静态资源中间件
  • 7) 获取请求体数据 body-parser
  • 8) Router 路由模块化
  • 9) EJS 模板引擎

1) 介绍

express 是一个基于 Node.js 平台的极简、灵活的 WEB 应用开发框架,官方网址:https://www.expressjs.com.cn/

简单来说,express 是一个封装好的工具包,封装了很多功能,便于我们开发 WEB 应用(HTTP 服务)

npm init
npm i express
const express= require("express");// 2.创建应用对象
const app = express();// 3.创建路由
app.get("/home", (request, response) => {response.end("hello express");
});// 4.监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

2) express 路由

官方定义: 路由确定了应用程序如何响应客户端对特定端点的请求

一个路由的组成有 请求方法路径回调函数 组成

express 中提供了一系列方法,可以很方便的使用路由,使用格式如下:

app.<method>(path,callback)

代码示例:

const express= require("express");// 2.创建应用对象
const app = express();// 3.创建路由
app.get("/home", (request, response) => {response.end("hello express");
});app.get("/", (request, response) => {response.end("home");
});app.post("/login", (request, response) => {response.end("login login");
});app.all("/test", (request, response) => {response.end("test test");
});app.all("*", (request, response) => {response.end("404 Not found");
});// 4.监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

获取请求参数

express 框架封装了一些 API 来方便获取请求报文中的数据,并且兼容原生 HTTP 模块的获取方式

const express= require("express");// 创建应用对象
const app = express();// 创建路由
app.get("/request", (request, response) => {// 原生操作console.log(request.method);console.log(request.url);console.log(request.httpVersion);console.log(request.headers);// express 操作console.log(request.path);console.log(request.query);// 获取ipconsole.log(request.ip);// 获取请求头console.log(request.get("host"));response.end("hello express");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

获取路由参数

路由参数指的是 URL 路径中的参数(数据)

const express= require("express");// 创建应用对象
const app = express();// 创建路由
app.get("/:id.html", (request, response) => {// 获取路由参数console.log(request.params.id);response.setHeader("content-type", "text/html;charset=utf-8");response.end("商品详情");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

3) express 响应设置

express 框架封装了一些 API 来方便给客户端响应数据,并且兼容原生 HTTP 模块的获取方式

// 导包
const express= require("express");// 创建应用对象
const app = express();// 创建路由
app.get("/response", (request, response) => {// 原生响应
//     response.statusCode = 404;
//     response.statusMessage = "Love";
//     response.setHeader("xxx", "yyy");
//     response.write("hello express ");
//     response.end("response");// express 响应// response.status(500);// response.set("aaa", "bbb");// response.send("你好 express");response.status(404).set("xxx", "yyy").send("链式编程");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

4) express 其他响应

  • 跳转响应
  • 下载响应
  • JSON响应
  • 文件响应
// 导包
const express= require("express");// 创建应用对象
const app = express();// 创建路由
app.get("/other", (request, response) => {   // 跳转响应// response.redirect("https://www.baidu.com");// 下载响应// response.download(__dirname + "/package.json");// JSON响应// response.json({//     name: "XXX",//     slogon: "天下"// });// 响应文件内容response.sendFile(__dirname + '/2_form.html');
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动, 端口3000正在监听中");
});

5) express中间件

什么是中间件

中间件(Middleware)本质是一个回调函数

中间件函数 可以像路由回调一样访问 请求对象(request) , 响应对象(response)

中间件的作用

中间件的作用 就是 使用函数封装公共操作,简化代码

中间件的类型

  • 全局中间件
  • 路由中间件

定义全局中间件

每一个请求 到达服务端之后 都会执行全局中间件函数

在这里插入图片描述

/*** 记录每个请求的 url 与 IP地址*/
const express= require("express");
const fs = require("fs");
const path = require("path");// 创建应用对象
const app = express();// 声明中间件函数
function recordMiddleware(request, response, next) {// 获取 url 和 iplet {url,ip} = request;// 将信息那批次早文件中 access.logfs.appendFileSync(path.resolve(__dirname, "./access.log"), `${url} ${ip}\r\n`);// 调用nextnext();
}// 使用中间件函数
app.use(recordMiddleware);// 创建路由
app.get("/home", (request, response) => {response.send("前台首页");
});app.get("/admin", (request, response) => {response.send("后台首页");
});app.get("*", (request, response) => {response.send("<h1>404 Not Found</h1>");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

调用格式如下:

app.use(recordMiddleware);

定义路由中间件

如果 只需要对某一些路由进行功能封装 ,则就需要路由中间件

/*** 针对 /admin /setting 的请求,要求 URL 携带 code=521 参数,如未携带提示”“*/
const e = require("express");
const express= require("express");// 创建应用对象
const app = express();// 创建路由
app.get("/home", (request, response) => {response.send("前台首页");
});// 声明中间件
let checkCodeMiddleware = (request, response, next) => {// 判断 url 中是否 code=521if (request.query.code === "521") {next();} else {response.send("暗号错误");}
};app.get("/admin", checkCodeMiddleware, (request, response) => {response.send("后台首页");
});app.get("/setting", checkCodeMiddleware, (request, response) => {response.send("设置页面");
});app.get("*", (request, response) => {response.send("<h1>404 Not Found</h1>");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

调用格式如下:

app.get('/路径',`中间件函数`,(request,response)=>{});
app.get('/路径',`中间件函数1`,`中间件函数2`,(request,response)=>{});

6) 静态资源中间件

express 内置处理静态资源的中间件

const express= require("express");// 创建应用对象
const app = express();// 静态资源中间件设置
app.use(express.static(__dirname + '/public'));// 创建路由
app.get("/home", (request, response) => {response.end("hello express");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

注意事项:

  • index.html 文件为默认打开的资源
  • 如果静态资源与路由规则同时匹配,谁先匹配谁就响应
  • 路由响应动态资源,静态资源中间件响应静态资源

7) 获取请求体数据 body-parser

express 可以使用 body-parser 包处理请求体

第一步:安装

npm i body-parser

第二步:导入 body-parser 包

const bodyParser = require('body-parser');

第三步:获取中间件函数

//处理 querystring 格式的请求体
let urlParser = bodyParser.urlencoded({extended:false}));
//处理 JSON 格式的请求体
let jsonParser = bodyParser.json();

第四步:设置路由中间件,然后使用 request.body 来获取请求体数据

app.post('/login', urlParser, (request,response)=>{//获取请求体数据//console.log(request.body);//用户名console.log(request.body.username);//密码console.log(request.body.userpass);response.send('获取请求体数据');
});

获取到的请求体数据:

[Object: null prototype] { username: 'admin', userpass: '123456' }

完整代码

/*** GET  /login 显示表单网页* POST /login 获取表单中的“用户名”和“密码”*/
const express= require("express");
const bodyParser = require('body-parser');// 创建应用对象
const app = express();// 解析json格式的请求体的中间件
const jsonParse = bodyParser.json();// 解析querystring格式的请求体的中间件
const urlencodeParser = bodyParser.urlencoded({extended: false});// 创建路由规则
app.get("/login", (request, response) => {// response.send("表单页面");response.sendFile(__dirname + "/11_form.html");
});app.post("/login", urlencodeParser, (request, response) => {// 获取用户名和密码console.log(request.body);console.log(request.body.username);console.log(request.body.password);response.send("获取用户的数据");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动, 端口3000正在监听中");
});

8) Router 路由模块化

什么是 Router

express 中的 Router 是一个完整的中间件和路由系统,可以看做是一个小型的 app 对象。

Router 作用

对路由进行模块化,更好的管理路由

Router 使用

创建独立的 JS 文件(router/homeRouter.js)(router/adminRouter.js)

// router/homeRouter.js
const express = require("express");// 创建路由对象
const router = express.Router();// 创建路由规则
router.get("/home", (request, response) => {response.send("前台首页");
});router.get("/search", (request, response) => {response.send("内容搜索");
});// 暴露 router
module.exports = router;
// router/adminRouter.js
const express = require("express");// 创建路由对象
const router = express.Router();// 创建路由规则
router.get("/admin", (request, response) => {response.send("后台首页");
});router.get("/setting", (request, response) => {response.send("设置页面");
});// 暴露 router
module.exports = router;

主文件

const express= require("express");
const homeRouter = require("./routes/homeRouter");
const adminRouter = require("./routes/adminRouter");// 创建应用对象
const app = express();// 设置
app.use(homeRouter);
app.use(adminRouter);app.get("*", (request, response) => {response.send("<h1>404 Not Found</h1>");
});// 监听端口,启动服务
app.listen(3000, () => {console.log("服务已经启动,端口3000正在监听中");
});

9) EJS 模板引擎

什么是模板引擎

模板引擎是分离 用户界面和业务数据 的一种技术

什么是 EJS

EJS 是一个高效的 Javascript 的模板引擎

官网: https://ejs.co/

中文站:https://ejs.bootcss.com/

EJS 初体验

下载安装EJS

npm i ejs --save

代码示例

// 导入ejs
const ejs = require("ejs");// 字符串
let china = "中国";
let str = "我爱你";// 使用 ejs 渲染let result = ejs.render("我爱你 <%= china %>", {china: china});console.log(result);

命令行下运行

EJS 常用语法

执行JS代码

<% code %>

输出转义的数据到模板上

<%= code %>

输出非转义的数据到模板上

<%- code %>

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

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

相关文章

Docker安装nginx和基本配置

Docker安装nginx和基本配置 一、拉取镜像&#xff0c;创建容器二、修改展示页面三、基本配置四、配置反向代理 一、拉取镜像&#xff0c;创建容器 &#x1f340;1、拉取 nginx 镜像 docker pull nginx:1.17.8&#x1f340;2、查看所有镜像 docker images&#x1f340;3、根据…

FL Studio 21.2.3.4004 All Plugins Edition Win/Mac音乐软件

FL Studio 21.2.3.4004 All Plugins Edition 是一款功能强大的音乐制作软件&#xff0c;提供了丰富的音频处理工具和插件&#xff0c;适用于专业音乐制作人和爱好者。该软件具有直观的用户界面&#xff0c;支持多轨道录音、混音和编辑&#xff0c;以及各种音频效果和虚拟乐器。…

2.15学习总结

2.15 1.聪明的质监员&#xff08;二分前缀和&#xff09; 2.村村通&#xff08;并查集&#xff09; 3.玉蟾宫(悬线法DP) 4.随机排列&#xff08;树状数组逆序对问题&#xff09; 5.增进感情&#xff08;DFS&#xff09; 6.医院设置&#xff08;floyd&#xff09; 聪明的质监员…

代码随想录算法训练营29期|day52 任务以及具体安排

第九章 动态规划part09 198.打家劫舍 // 动态规划 class Solution {public int rob(int[] nums) {if (nums null || nums.length 0) return 0;if (nums.length 1) return nums[0];int[] dp new int[nums.length];dp[0] nums[0];dp[1] Math.max(dp[0], nums[1]);for (int …

SPI控制8_8点阵屏

协议与硬件概述 SPI SPI是串行外设接口&#xff08;Serial Peripheral Interface&#xff09;的缩写。是一种高速的&#xff08;10Mbps&#xff09;的&#xff0c;全双工&#xff0c;同步的通信总线&#xff0c;并且在芯片的管脚上只占用四根线。 引脚介绍 SCLK&#xff1a;…

推荐在线图像处理程序源码

对于喜爱图像编辑的朋友们来说&#xff0c;Photoshop无疑是处理照片的利器。然而&#xff0c;传统的Photoshop软件不仅需要下载安装&#xff0c;还对电脑配置有一定的要求&#xff0c;这无疑增加了使用的门槛。 现在&#xff0c;我们为您带来一款革命性的在线PS修图工具——基…

面试突击1

1.当线程没有拿到资源时&#xff0c;用户态和内核态的一个切换 在操作系统中&#xff0c;进程和线程是执行程序的基本单位。为了管理这些单位&#xff0c;操作系统使用了一种称为“进程状态”的机制&#xff0c;其中包括用户态和内核态两种状态。这两种状态代表了进程或线程在…

Python爬虫学习

1.1搭建爬虫程序开发环境 爬取未来七天天气预报 from bs4 import BeautifulSoup from bs4 import UnicodeDammit import urllib.request url"http://www.weather.com.cn/weather/101120901.shtml" try:headers{"User-Agent":"Mozilla/5.0 (Windows …

猫头虎分享已解决Bug ‍ || Go Error: no Go files in /path/to/directory

博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》 — 面试准备的宝典&#xff01;《IDEA开发秘籍》 — 提升你的IDEA技能&#xff01;《100天精通鸿蒙》 …

Fluke ADPT 连接器新增对福禄克万用 Fluke 15B Max 的支持

所需设备&#xff1a; 1、Fluke ADPT连接器&#xff1b; 2、Fluke 15B Max&#xff1b; Fluke 15B Max拆机图&#xff1a; 显示界面如下图&#xff1a; 并且可以将波形导出到EXCEL: 福禄克万用表需要自己动手改造&#xff01;&#xff01;&#xff01;

【JAVA-Day81】 线程休眠: Java 中暂停线程执行的方法 ⏸️

线程休眠&#xff1a; Java 中暂停线程执行的方法 ⏸️&#x1f4a4; 线程休眠&#xff1a; Java 中暂停线程执行的方法 ⏸️&#x1f4a4;摘要 &#x1f4dd;引言 &#x1f680;正文 &#x1f4da;一、什么是线程休眠 ⏸️二、线程什么情况下会休眠 ❓三、模拟线程休眠 &#…

电脑重装系统之Windows 10 企业版 LTSC 2021

简介 Windows 10 22H2对于我来说太不简洁&#xff0c;最受不了的一点是微软强行硬塞给我一些并没有什么luan用的应用和功能&#xff0c;比如&#xff1a;天气&#xff0c;Onedrive......以及臃肿的ui设计。而且强行进行自动更新&#xff0c;我是真的受不了这个&#xff0c;看着…