NodeJs快速开发应用（五）-express基本使用

一杯温水2023-12-01 16:01

本文旨在学习搭建express框架，如想快速搭建实现敏捷开发直接参考:express快速应用程序生成器。

1.使用nodemon 第三方依赖来自动监听文件的变化并重新启动

1.1 使用npm下载nodemon

css 复制代码 
$ npm i nodemon

1.2 修改npm包配置

css 复制代码 
---package.json
{
  "name": "acquaintance",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "nodemon app.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "koa": "^2.13.1"
  },
  "devDependencies": {
    "nodemon": "^2.0.7"
  }
}

2.配置express测试程序

2.1 使用npm安装express

ruby 复制代码 
$ npm install express

2.2 编写express测试程序

javascript 复制代码 
---index.js
const express = require("express");
const app = express();
​
// 添加根路由，返回 "hello world!"
app.get("/", (req, res) => {
    res.send("hello world!");
});
​
// 添加测试路由，用于测试 GET 请求
app.get("/test", (req, res) => {
    res.send("This is a test route for GET request.");
});
​
// 添加测试路由，用于测试 POST 请求
app.post("/test", (req, res) => {
    res.send("This is a test route for POST request.");
});
​
// 添加测试路由，用于测试 OPTIONS 请求
app.options("/test", (req, res) => {
    res.send("This is a test route for OPTIONS request.");
});
​
// 添加测试路由，用于测试 DELETE 请求
app.delete("/test", (req, res) => {
    res.send("This is a test route for DELETE request.");
});
​
// 添加测试路由，用于测试 PUT 请求
app.put("/test", (req, res) => {
    res.send("This is a test route for PUT request.");
});
​
app.listen("9999", (error) => {
    if (error) {
        console.log("服务器启动失败!");
        return;
    }
    console.log("服务器启动成功!");
});
​

2.3 通过浏览器测试接口

此应用程序启动服务器并侦听端口 9999 上的连接。该应用程序响应"Hello World！" 用于请求根 URL( /) 或路由。对于所有其他路径，它将响应404 Not Found。

2.3.1 启动应用 npm run dev
2.3.2 浏览器输入链接并展示

测试其他get链接：localhost:9999/test

3.路由配置

3.1 创建routes文件夹，按模块管理route
js 复制代码 
-routes/test.js
/**
 * @fileoverview 路由文件，包含用于测试不同请求方法的路由。
 * @module routes/test
 */

const express = require("express");
const router = express.Router()

/**
 * GET请求测试路由
 * @name GET /test
 * @function
 * @memberof module:routes/test
 * @param {Object} req - 请求对象
 * @param {Object} res - 响应对象
 */
router.get("/test", (req, res) => {
    res.send("This is a test route for GET request.");
});

/**
 * POST请求测试路由
 * @name POST /test
 * @function
 * @memberof module:routes/test
 * @param {Object} req - 请求对象
 * @param {Object} res - 响应对象
 */
router.post("/test", (req, res) => {
    res.send("This is a test route for POST request.");
});

/**
 * OPTIONS请求测试路由
 * @name OPTIONS /test
 * @function
 * @memberof module:routes/test
 * @param {Object} req - 请求对象
 * @param {Object} res - 响应对象
 */
router.options("/test", (req, res) => {
    res.send("This is a test route for OPTIONS request.");
});

/**
 * DELETE请求测试路由
 * @name DELETE /test
 * @function
 * @memberof module:routes/test
 * @param {Object} req - 请求对象
 * @param {Object} res - 响应对象
 */
router.delete("/test", (req, res) => {
    res.send("This is a test route for DELETE request.");
});

/**
 * PUT请求测试路由
 * @name PUT /test
 * @function
 * @memberof module:routes/test
 * @param {Object} req - 请求对象
 * @param {Object} res - 响应对象
 */
router.put("/test", (req, res) => {
    res.send("This is a test route for PUT request.");
});

module.exports = router
js 复制代码 
-routes/user.js
/**
 * @fileoverview 该文件包含了用于处理 GET 请求的用户路由。
 * @module routes/user
 */

const express = require("express");
const router = express.Router()

/**
 * GET /user
 * 这是一个用于处理 GET 请求的用户路由。
 * @param {Object} req - 请求对象。
 * @param {Object} res - 响应对象。
 */
router.get("/user", (req, res) => {
    res.send("这是一个用于处理 GET 请求的用户路由");
})

router.get("/userInfo", (req, res) => {
    const {id,name}=req.query
    res.send("用户id"+id+"\r用户姓名"+name);
})

module.exports = router

安装http-errors

ruby 复制代码 
$ npm install  http-errors
js 复制代码 
-index.js

/**
 * Express应用程序的入口文件
 * @module index
 */

const express = require("express");
const httpErrors = require("http-errors");
const testRouter = require("./routes/test");
const userRouter = require("./routes/user");

const app = express();

// 添加根路由，返回 "hello world!"
app.get("/", (req, res) => {
    res.send("hello world!");
});

app.use(testRouter);
app.use(userRouter);

// 处理404错误
app.use(function (req, res, next) {
    next(httpErrors(404));
});

// 处理异常错误
app.use(function (err, req, res, next) {
    // 设置局部变量，仅提供开发中的错误
    res.locals.message = err.message;
    res.locals.error = req.app.get('env') === 'development' ? err : {};

    // 渲染错误页面
    res.status(err.status || 500);
    res.render('error');
});

/**
 * 启动Express应用程序的服务器
 * @param {string} port - 服务器监听的端口号
 * @param {function} callback - 服务器启动成功后的回调函数
 */
app.listen("9999", (error) => {
    if (error) {
        console.log("服务器启动失败!");
        return;
    }
    console.log("服务器启动成功!");
});
3.2 页面测试

基础功能测试

localhost:9999/

localhost:9999/userinfo?id=10&name=hhh

localhost:9999/test

错误测试 localhost:9999/test/hhh

4.使用模板引擎

可以使用模板引擎渲染页面

下载pug模板引擎

css 复制代码 
$ npm install pug --save

在 Express 可以呈现模板文件之前，必须设置以下应用程序设置：

  • views：模板文件所在目录。例如：app.set('views', './views')
  • view engine：要使用的模板引擎。例如：app.set('view engine', 'pug')

在设置视图引擎之后，不必指定该引擎或者在应用程序中装入模板引擎模块；Express 在内部装入此模块.

在 views 目录中创建名为 index.pug 的 Pug 模板文件

-views/index.pug

css 复制代码 
​
extends layout
​
block content
  h1= title
  p Welcome to #{title}

-views/error.pug

ini 复制代码 
extends layout
​
block content
  h1= message
  h2= error.status
  pre #{error.stack}

-views/layout.pug

ini 复制代码 
doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content

随后创建路由以呈现 index.pug 文件。如果未设置 view engine 属性，必须指定 view 文件的扩展名。

使用模板引擎

-index.js

javascript 复制代码 
​
/**
 * Express应用程序的入口文件
 * @module index
 */
​
const express = require("express");
const httpErrors = require("http-errors");
const path=require("path")
const testRouter = require("./routes/test");
const userRouter = require("./routes/user");
​
const app = express();
​
//使用模板引擎
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
​
// 添加根路由，返回 "hello world!"
app.get("/", (req, res) => {
    res.send("hello world!");
});
​
app.use(testRouter);
app.use(userRouter);
​
// 处理404错误
app.use(function (req, res, next) {
    next(httpErrors(404));
});
​
// 处理异常错误
app.use(function (err, req, res, next) {
    // 设置局部变量，仅提供开发中的错误
    res.locals.message = err.message;
    res.locals.error = req.app.get('env') === 'development' ? err : {};
​
    // 渲染错误页面
    res.status(err.status || 500);
    res.render('error');
});
​
/**
 * 启动Express应用程序的服务器
 * @param {string} port - 服务器监听的端口号
 * @param {function} callback - 服务器启动成功后的回调函数
 */
app.listen("9999", (error) => {
    if (error) {
        console.log("服务器启动失败!");
        return;
    }
    console.log("服务器启动成功!");
});
​
查看页面效果

5.使用morgan日志服务中间件

5.1 下载morgan

console 复制代码 
$ npm install morgan

5.2 使用

--index.js

js 复制代码 
/**
 * Express应用程序的入口文件
 * @module index
 */

const express = require("express");
const httpErrors = require("http-errors");
const path=require("path")
const logger = require('morgan');
const testRouter = require("./routes/test");
const userRouter = require("./routes/user");

const app = express();

//使用模板引擎
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

//日志服务中间件
app.use(logger('dev'));

// 添加根路由，返回 "hello world!"
app.get("/", (req, res) => {
    res.send("hello world!");
});

app.use(testRouter);
app.use(userRouter);


// 处理404错误
app.use(function (req, res, next) {
    next(httpErrors(404));
});

// 处理异常错误
app.use(function (err, req, res, next) {
    // 设置局部变量，仅提供开发中的错误
    res.locals.message = err.message;
    res.locals.error = req.app.get('env') === 'development' ? err : {};

    // 渲染错误页面
    res.status(err.status || 500);
    res.render('error');
});

/**
 * 启动Express应用程序的服务器
 * @param {string} port - 服务器监听的端口号
 * @param {function} callback - 服务器启动成功后的回调函数
 */
app.listen("9999", (error) => {
    if (error) {
        console.log("服务器启动失败!");
        return;
    }
    console.log("服务器启动成功!");
});

5.3 测试

6.express 快速应用程序生成器

以上对于学习的朋友来说可以练习，对于快速开发的同学可以直接生成程序，

可以使用应用程序生成工具express-generator快速创建应用程序框架。

使用以下命令运行应用程序生成器npx（Node.js 8.2.0 中提供）。

ruby 复制代码 
$ npx express-generator

Pug：视图引擎作为编程术语它主要意思是指"进行视图渲染的模块"。而 Express 框架中最常用的两个视图引擎是 Pug 和 EJS 。需要注意的是，Pug 早期的名称是 Jade 由于某些原因不得已改名 。

另外，Express 并没有指定必须使用何种引擎。只要该视图引擎的设计符合 Express API 规范，你就可以将其应用到工程中。

ini 复制代码 
$ express --view=pug myapp

然后安装依赖项：

shell 复制代码 
$ cd myapp
$ npm install

启动程序

arduino 复制代码 
$ npm run start
相关推荐
AskHarries1 小时前
文件上传系统
后端
止语Lab2 小时前
好的 DX 不等于少写代码——三种语言的摩擦力设计课
后端
吃饱了得干活2 小时前
别再手动解析 LLM 输出了！LangChain 四种结构化输出方案对比
后端·python·langchain
程序员天天困2 小时前
Arthas trace 命令怎么用？一行定位最慢那行代码
jvm·后端
Huiturn2 小时前
GPT 5.6 连续编码 10 小时，纯 Python 啃下 Word 二进制格式——doc2docx 实现拆解
后端
用户298698530142 小时前
Python 实现 Excel 与 Markdown 互转的实用指南
后端·python·excel
用户77283104908402 小时前
krono-job：零侵入、单二进制交付的分布式任务调度平台（开源）
后端
Conan在掘金2 小时前
鸿蒙报错速查：Function lacks ending return statement，返回路径漏 return 就炸，根因 + 真解法
后端
人间凡尔赛3 小时前
AI-Native 云原生架构：2026 年从容器编排到智能体编排的范式革命
后端·云原生·架构
IT_陈寒3 小时前
Vue的响应式让我加班到凌晨3点，原来问题出在这
前端·人工智能·后端
热门推荐
012026年7月AI圈大地震：GPT-5.6被政府限制、Claude入驻Slack、Anthropic自研芯片02GitHub 镜像站点03如何新建文件夹？ 电脑新建文件夹的4种方法04AI科技热点日报 | 2026年07月01日05幻兽帕鲁 - 服务器管理员权限与 GM 命令完全指南06国内可直接用、免费额度/永久免费的大模型API清单（含 SiliconFlow、火山、阿里、智谱、百度、Kimi、DeepSeek、DMXAPI 等）07AI 编程 IDE 全景解析 2026：Agent 全面接管开发链路082026 国产 AI 大模型横评：DeepSeek、通义千问、Kimi、文心一言、星火、豆包谁更能打？092026 年 AI 大模型 & AI 编程工具实战全总结10微信历史版本含下载地址（ Windows PC | 安卓 | MAC ）及设置微信不更新