【Node.js实战】一文带你开发博客项目之初识Express(安装Express,处理路由,中间件机制)

简介: 【Node.js实战】一文带你开发博客项目之初识Express(安装Express,处理路由,中间件机制)

一、前言

前面我们已经使用原生的 node.js 完成了 myblog 博客项目。


接下来,我们使用 express 框架来重构我们的 myblog 项目…


二、express

1、安装 express

使用脚手架(express-generator)


首先,我们全局安装脚手架

npm install express-generator -g

使用脚手架生成名为 blog-express 的项目

express blog-express

bbadc894d86140ffa10efe8f3f480d96.png

之后我们安装依赖

npm install

再之后,我们就可以启动它了

npm start

我们访问 localhost:3000 端口

6826501d5a194344af001b8c60c3ecce.png

下面我们安装一下 nodemon

npm i nodemon cross-env --save-dev

给 package.json 添加一行(实时监听,不用再次启动)

  "scripts": {
    ...
    "dev": "cross-env NODE_ENV=dev nodemon ./bin/www"
  },

那么我们便可以使用 npm run dev 来启动项目了


2、express 处理路由

express 已经为我们封装好了路由,我们直接拿来简单配置一下就可以

04f583f7b6124a5c8460e4cba9df1db2.png

我们可以参照 index.js 的代码,稍加修改即可

blog.js

我们首先配置一下博客列表和博客详情的路由(GET请求)

var express = require('express');
var router = express.Router();
// 博客列表
router.get('/list', function(req, res, next) {
  res.json({
    errno: 0,
    data: [1, 2, 3]
  })
});
// 博客详情
router.get('/detail', function(req, res, next) {
  res.json({
    errno: 0,
    data: 'OK'
  })
});
module.exports = router;

user.js

我们再来配置一下登录的路由(POST请求)

var express = require('express');
var router = express.Router();
// 登录
router.post('/login', function (req, res, next) {
    const { username, password } = req.body
    res.json({
        errno: 0,
        data: {
            username,
            password
        }
    })
});
module.exports = router;

app.js

在 app.js 文件中添加刚刚配置的路由

const blogRouter = require('./routes/blog')
const userRouter = require('./routes/user')
...
app.use('/api/blog', blogRouter);
app.use('/api/user', userRouter);

接下来,我们来进行一下 GET 和 POST 请求的测试

8b7b41c4bef84f39842971e71f729ca5.png

6d6ed26cebf941a9a12865f1ed39c749.png

c91b73443d1b43e3b4c78283ac597992.png

3、中间件机制

中间件主要是指封装所有Http请求细节处理的方法


express 中间件函数,帮助拆解主程序的业务逻辑,并且每一个的中间件函数处理的结果都会传递给下一个中间件函数


首先,我们来做一个小 demo


我们在根目录创建 express-test 文件,在当前目录下初始化

npm init -y

修改 package.json 文件下的主文件

"main": "app.js",

之后创建 app.js 文件,并安装 express(注意:没有使用到脚手架,因为此处仅做测试介绍中间件)

npm i express

af395533b3e1465388f8f1397a753242.png

app.js

我们编写一些 http 请求,理解一下 next() 的作用(根据请求方式和路径进行匹配执行)

const express = require('express')
// 本次 http 请求的实例
const app = express()
app.use((req, res, next) => {
    console.log('请求开始...', req.method, req.url)
    next()
})
app.use((req, res, next) => {
    // 假设在处理 cookie
    req.cookie = {
        userId: 'abc123'
    }
    next()
})
app.use((req, res, next) => {
    // 假设处理 post data
    // 异步
    setTimeout(() => {
        req.body = {
            a: 100,
            b: 200
        }
        next()
    })
})
app.use('/api', (req, res, next) => {
    console.log('处理 /api 路由')
    next()
})
app.get('/api', (req, res, next) => {
    console.log('get /api 路由')
    next()
})
app.post('/api', (req, res, next) => {
    console.log('post /api 路由');
    next()
})
app.get('/api/get-cookie', (req, res, next) => {
    console.log('get /api/get-cookie');
    res.json({
        errno: 0,
        data: req.cookie
    })
})
app.post('/api/get-post-data', (req, res, next) => {
    console.log('post /api/get-post-data');
    res.json({
        errno: 0,
        data: req.body
    })
})
app.use((req, res, next) => {
    console.log('处理 404');
    res.json({
        errno: -1,
        msg: '404 not found'
    })
})
app.listen(3000, () => {
    console.log('server is running on port 3000');
})

3c283e63328849efbcbd223943e005de.png

b9e30e97a9ea44b58f76c9b8d6429c58.png

f64a72f586ef485b8d6a30e6c72035b0.png

三、写在最后

至此,我们明白了 如何安装Express,如何处理路由以及什么是中间件机制 继续跟进学习吧!


后续会对该项目进行多次重构【多种框架(express,koa)和数据库(mysql,sequelize,mongodb)】


如果你需要该项目的 源码,请通过本篇文章最下面的方式 加入 进来~~


45fc82a82c6542bdb2ff4986377d8db3.png

相关文章
|
数据采集 自然语言处理 NoSQL
利用中间件实现任务去重与分发精细化:股吧舆情数据采集与分析实战
本项目针对东方财富股吧设计精细化采集方案,解决重复采集、调度混乱与反爬等问题,构建舆情分析数据模型。通过采集帖子内容、用户行为与情绪信号,实现情绪趋势可视化、热点识别与个股预警,助力把握市场风向。
868 0
利用中间件实现任务去重与分发精细化:股吧舆情数据采集与分析实战
|
JavaScript 前端开发 中间件
探索后端技术:Node.js与Express框架的完美融合
【10月更文挑战第7天】 在当今数字化时代,Web应用已成为日常生活不可或缺的一部分。本文将深入探讨后端技术的两大重要角色——Node.js和Express框架,分析它们如何通过其独特的特性和优势,为现代Web开发提供强大支持。我们将从Node.js的非阻塞I/O和事件驱动机制,到Express框架的简洁路由和中间件特性,全面解析它们的工作原理及应用场景。此外,本文还将分享一些实际开发中的小技巧,帮助你更有效地利用这些技术构建高效、可扩展的Web应用。无论你是刚入门的新手,还是经验丰富的开发者,相信这篇文章都能为你带来新的启发和思考。
|
缓存 监控 中间件
Django中间件自定义开发指南:从原理到实战的深度解析
Django中间件是Web应用的“交通警察”,在请求与响应过程中进行全局处理,适用于身份验证、日志记录、性能监控等功能。本文详解中间件的工作原理、开发步骤及实战案例,帮助开发者掌握自定义中间件的构建方法,提升Django应用的可维护性与扩展性。
664 0
|
JavaScript 中间件 关系型数据库
构建高效的后端服务:Node.js 与 Express 的实践指南
在后端开发领域,Node.js 与 Express 的组合因其轻量级和高效性而广受欢迎。本文将深入探讨如何利用这一组合构建高性能的后端服务。我们将从 Node.js 的事件驱动和非阻塞 I/O 模型出发,解释其如何优化网络请求处理。接着,通过 Express 框架的简洁 API,展示如何快速搭建 RESTful API。文章还将涉及中间件的使用,以及如何结合 MySQL 数据库进行数据操作。最后,我们将讨论性能优化技巧,包括异步编程模式和缓存策略,以确保服务的稳定性和扩展性。
|
Web App开发 JSON JavaScript
Node.js 中的中间件机制与 Express 应用
Node.js 中的中间件机制与 Express 应用
|
JavaScript
使用node.js搭建一个express后端服务器
Express 是 Node.js 的一个库,用于搭建后端服务器。本文将指导你从零开始构建一个简易的 Express 服务器,包括项目初始化、代码编写、服务启动与项目结构优化。通过创建 handler 和 router 文件夹分离路由和处理逻辑,使项目更清晰易维护。最后,通过 Postman 测试确保服务正常运行。
1235 1
|
JavaScript 安全 中间件
深入浅出Node.js中间件机制
【10月更文挑战第36天】在探索Node.js的奥秘之旅中,中间件的概念如同魔法一般,它让复杂的请求处理变得优雅而高效。本文将带你领略这一机制的魅力,从概念到实践,一步步揭示如何利用中间件简化和增强你的应用。
|
消息中间件 JavaScript 中间件
深入浅出Node.js中间件机制
【10月更文挑战第24天】在Node.js的世界里,中间件如同厨房中的调料,为后端服务增添风味。本文将带你走进Node.js的中间件机制,从基础概念到实际应用,一探究竟。通过生动的比喻和直观的代码示例,我们将一起解锁中间件的奥秘,让你轻松成为后端料理高手。
320 1
|
Web App开发 JavaScript 中间件
构建高效后端服务:Node.js与Express框架的完美结合
【10月更文挑战第21天】本文将引导你走进Node.js和Express框架的世界,探索它们如何共同打造一个高效、可扩展的后端服务。通过深入浅出的解释和实际代码示例,我们将一起理解这一组合的魅力所在,并学习如何利用它们来构建现代Web应用。
602 1
|
SQL JavaScript 关系型数据库
node博客小项目:接口开发、连接mysql数据库
【10月更文挑战第14天】node博客小项目:接口开发、连接mysql数据库