node（中）

Express 框架入门教程

1. 简介

Express 是一个基于 Node.js 的轻量级、灵活的 Web 应用框架。它提供了丰富的 HTTP 工具和中间件支持，非常适合快速开发 Web 应用程序和 RESTful API。

2. 安装环境

在开始之前，请确保你已经安装了以下工具：

Node.js（建议版本 >= 14）
npm（Node.js 包管理器）

可以通过以下命令检查是否已安装：

node -v
npm -v

3. 创建 Express 项目

3.1 初始化项目

在终端中执行以下命令，创建一个新的项目文件夹并初始化 npm 项目：

mkdir my-express-app
cd my-express-app
npm init -y

3.2 安装 Express

在项目目录下运行以下命令，安装 Express：

npm install express

4. 创建基本的 Express 应用

在项目根目录下创建一个名为 app.js 的文件，并添加以下代码：

const express = require('express');
const app = express();
const port = 3000;

// 定义路由
app.get('/', (req, res) => {
  res.send('Hello World!');
});

// 启动服务器
app.listen(port, () => {
  console.log(`Server is running at http://localhost:${port}`);
});

4.1 启动应用

在终端中运行以下命令启动应用：

node app.js

打开浏览器访问 http://localhost:3000，你应该会看到页面显示 "Hello World!"。

5. 中间件

中间件是 Express 的核心功能之一，它可以处理请求和响应之间的逻辑。以下是一些常见的中间件使用示例。

5.1 使用内置中间件

Express 提供了一些内置中间件，例如 express.json() 和 express.urlencoded()，用于解析请求体。

在 app.js 中添加以下代码：

app.use(express.json()); // 用于解析 JSON 格式的请求体
app.use(express.urlencoded({ extended: true })); // 用于解析 URL 编码的请求体

5.2 自定义中间件

你可以创建自己的中间件来处理特定的逻辑。例如，创建一个简单的日志中间件：

app.use((req, res, next) => {
  console.log(`Request URL: ${req.url}, Method: ${req.method}`);
  next(); // 调用 next() 将请求传递到下一个中间件或路由
});

5.3 第三方中间件

Express 社区提供了大量的第三方中间件。例如，使用 morgan 来记录 HTTP 请求：

npm install morgan

在 app.js 中使用：

const morgan = require('morgan');
app.use(morgan('dev'));

6. 路由

Express 提供了强大的路由功能，可以方便地定义不同路径的处理逻辑。

6.1 基本路由

在 app.js 中定义多个路由：

app.get('/about', (req, res) => {
  res.send('This is the about page');
});

app.post('/submit', (req, res) => {
  res.send('Form submitted');
});

6.2 路由参数

可以通过路由参数动态获取 URL 中的值：

app.get('/user/:id', (req, res) => {
  const userId = req.params.id;
  res.send(`User ID: ${userId}`);
});

6.3 查询参数

可以通过查询参数获取 URL 中的查询字符串：

app.get('/search', (req, res) => {
  const query = req.query.q;
  res.send(`Search query: ${query}`);
});

6.4 路由分组

对于复杂的项目，可以将路由分组到不同的文件中。例如，创建一个 routes/user.js 文件：

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

router.get('/:id', (req, res) => {
  res.send(`User ID: ${req.params.id}`);
});

module.exports = router;

在 app.js 中引入并使用：

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

7. 静态文件服务

Express 可以轻松地提供静态文件服务。例如，创建一个 public 文件夹，并在其中放置一些静态文件（如 index.html 和 style.css）。

在 app.js 中添加以下代码：

app.use(express.static('public'));

现在，访问 http://localhost:3000/index.html 将会返回 public/index.html 文件的内容。

8. 错误处理

Express 提供了错误处理中间件，用于捕获和处理错误。

在 app.js 中添加以下代码：

// 定义一个错误处理中间件
app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).send('Something broke!');
});

9. 连接数据库

Express 可以与各种数据库集成。以下是一个使用 MongoDB 的示例。

9.1 安装 MongoDB 驱动

npm install mongoose

9.2 连接数据库

在 app.js 中添加以下代码：

const mongoose = require('mongoose');

mongoose.connect('mongodb://localhost:27017/mydatabase', {
  useNewUrlParser: true,
  useUnifiedTopology: true
}).then(() => {
  console.log('Connected to MongoDB');
}).catch(err => {
  console.error('Failed to connect to MongoDB', err);
});

9.3 定义模型

创建一个 models/User.js 文件：

const mongoose = require('mongoose');

const userSchema = new mongoose.Schema({
  name: String,
  email: String
});

module.exports = mongoose.model('User', userSchema);

在 app.js 中使用模型：

const User = require('./models/User');

app.post('/user', async (req, res) => {
  const user = new User(req.body);
  await user.save();
  res.send('User created');
});

10. 部署

部署 Express 应用通常需要以下步骤：

打包代码：使用 npm run build（如果使用了 TypeScript 或其他构建工具）。
选择服务器：可以选择云服务器（如 AWS、Azure、阿里云）或使用 PaaS 平台（如 Heroku）。
配置环境变量：使用 .env 文件或环境变量管理配置。
启动应用：使用 pm2 或其他进程管理工具保持应用运行。

10.1 使用 PM2

安装 PM2：

npm install pm2 -g

启动应用：

pm2 start app.js

查看应用状态：

pm2 status

ejs (后端渲染)

在 Express 中使用 EJS（Embedded JavaScript templating）是一种非常流行的方式来渲染动态 HTML 页面。EJS 是一种简单的模板引擎，允许你在 HTML 文件中嵌入 JavaScript 代码，从而实现动态内容的生成。

以下是一个完整的指南，帮助你在 Express 项目中使用 EJS。

1. 创建 Express 项目

首先，确保你已经安装了 Node.js 和 npm。

1.1 初始化项目

在终端中运行以下命令，创建一个新的项目文件夹并初始化 npm 项目：

mkdir my-express-ejs-app
cd my-express-ejs-app
npm init -y

1.2 安装 Express 和 EJS

在项目目录下运行以下命令，安装 Express 和 EJS：

npm install express ejs

2. 配置 Express 使用 EJS

在项目根目录下创建一个名为 app.js 的文件，并添加以下代码：

const express = require('express');
const app = express();
const port = 3000;

// 设置 EJS 作为模板引擎
app.set('view engine', 'ejs');

// 设置静态文件目录
app.use(express.static('public'));

// 定义路由
app.get('/', (req, res) => {
  const data = {
    title: 'Welcome to My Blog',
    description: 'This is a simple blog built with Express and EJS.',
    posts: [
      { title: 'Post 1', content: 'This is the content of post 1.' },
      { title: 'Post 2', content: 'This is the content of post 2.' }
    ]
  };
  res.render('index', data); // 渲染 EJS 模板
});

app.listen(port, () => {
  console.log(`Server is running at http://localhost:${port}`);
});

3. 创建 EJS 模板

在项目目录下创建一个名为 views 的文件夹，Express 会默认从这个文件夹中查找 EJS 模板文件。

3.1 创建 `index.ejs` 文件

在 views 文件夹中创建一个名为 index.ejs 的文件，并添加以下内容：

HTML复制

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><%= title %></title>
  <style>
    body { font-family: Arial, sans-serif; }
    .post { margin-bottom: 20px; }
  </style>
</head>
<body>
  <h1><%= title %></h1>
  <p><%= description %></p>

  <h2>Blog Posts</h2>
  <div id="posts">
    <% posts.forEach(post => { %>
      <div class="post">
        <h3><%= post.title %></h3>
        <p><%= post.content %></p>
      </div>
    <% }) %>
  </div>
</body>
</html>

3.2 EJS 语法说明

<%= value %>：输出变量的值，并进行 HTML 转义，防止 XSS 攻击。
<%- value %>：输出变量的值，不进行 HTML 转义。
<% code %>：嵌入 JavaScript 代码，例如循环或条件语句。

4. 创建静态文件目录（可选）

如果你需要使用静态文件（如 CSS、JavaScript 或图片），可以在项目根目录下创建一个名为 public 的文件夹，并将静态文件放在其中。

例如，创建 public/style.css 文件：

css复制

body {
  font-family: Arial, sans-serif;
  margin: 20px;
}

.post {
  border: 1px solid #ccc;
  padding: 10px;
  margin-bottom: 20px;
}

然后在 index.ejs 中引入：

HTML复制

<link rel="stylesheet" href="/style.css">

5. 启动应用

在终端中运行以下命令启动 Express 应用：

node app.js

打开浏览器访问 http://localhost:3000，你应该会看到动态渲染的页面，其中包含标题、描述和博客文章列表。

Express创建项目

express-generator 是一个由 Express 官方提供的工具，用于快速生成 Express 项目的初始结构。它可以帮助开发者节省手动创建文件和配置的时间，快速搭建一个完整的项目框架。

如何使用 `express-generator`

1. 安装 `express-generator`

你可以通过以下两种方式安装 express-generator：

使用 npx（推荐）：如果你的 Node.js 版本 >= 8.2.0，可以直接使用 npx 命令运行生成器，而无需安装：
```
npx express-generator
```
全局安装：对于早期版本的 Node.js，可以将 express-generator 安装为全局 npm 包：
```
npm install -g express-generator
```

2. 创建项目

使用 express-generator 创建一个新项目时，可以通过命令行选项指定项目名称、视图引擎、CSS 引擎等。例如：

express --view=ejs myapp

这条命令会在当前目录下创建一个名为 myapp 的文件夹，并设置 EJS 作为视图引擎。

3. 项目结构

生成的项目具有以下目录结构：

复制

myapp/
├── app.js
├── bin/
│   └── www
├── package.json
├── public/
│   ├── images/
│   ├── javascripts/
│   └── stylesheets/
│       └── style.css
├── routes/
│   ├── index.js
│   └── users.js
└── views/
    ├── error.ejs
    ├── index.ejs
    └── layout.ejs

4. 安装依赖并运行

进入项目目录并安装依赖：

cd myapp
npm install

运行项目：

在 macOS 或 Linux 上：
```
DEBUG=myapp:* npm start
```
在 Windows 命令提示符上：
```
set DEBUG=myapp:* & npm start
```
在 Windows PowerShell 上：
```
$env:DEBUG='myapp:*'; npm start
```

访问 http://localhost:3000/ 即可查看运行中的应用程序。

操作数据库

在 Express 中操作数据库是构建 Web 应用程序的常见需求。以下是几种常见的数据库（如 MySQL、MongoDB 和 PostgreSQL）在 Express 中的集成和操作方法。

1. MySQL 数据库

MySQL 是一种流行的关系型数据库，常与 Express 结合使用。

安装 MySQL 驱动

bash复制

npm install mysql2

创建数据库连接

JavaScript复制

const mysql = require('mysql2');

const connection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: 'password',
  database: 'mydatabase'
});

connection.connect(err => {
  if (err) {
    console.error('连接数据库失败: ', err);
    return;
  }
  console.log('连接数据库成功!');
});

使用连接池

为了提高效率，建议使用连接池：

JavaScript复制

const pool = mysql.createPool({
  connectionLimit: 10,
  host: 'localhost',
  user: 'root',
  password: 'password',
  database: 'mydatabase'
});

pool.query('SELECT * FROM users', (err, results, fields) => {
  if (err) {
    console.error('查询失败: ', err);
    return;
  }
  console.log(results);
});

2. MongoDB 数据库

MongoDB 是一种 NoSQL 数据库，适合存储大量文档数据。

安装 Mongoose

bash复制

npm install mongoose

连接 MongoDB

JavaScript复制

const mongoose = require('mongoose');

mongoose.connect('mongodb://localhost:27017/mydatabase', {
  useNewUrlParser: true,
  useUnifiedTopology: true
}).then(() => {
  console.log('连接到 MongoDB 成功');
}).catch(err => {
  console.error('连接到 MongoDB 失败: ', err);
});

定义模型并操作数据

JavaScript复制

const UserSchema = new mongoose.Schema({
  name: String,
  email: String
});

const User = mongoose.model('User', UserSchema);

// 添加数据
const newUser = new User({ name: 'John Doe', email: 'john@example.com' });
newUser.save(err => {
  if (err) console.error(err);
  else console.log('用户已添加');
});

3. PostgreSQL 数据库

PostgreSQL 是一种功能强大的关系型数据库。

安装 PostgreSQL 驱动

bash复制

npm install pg

创建数据库连接

JavaScript复制

const { Client } = require('pg');

const client = new Client({
  user: 'postgres',
  host: 'localhost',
  database: 'mydatabase',
  password: 'password',
  port: 5432
});

client.connect(err => {
  if (err) {
    console.error('连接失败: ', err);
    return;
  }
  console.log('连接成功');
});

client.query('SELECT * FROM users', (err, res) => {
  if (err) {
    console.error('查询失败: ', err);
    return;
  }
  console.log(res.rows);
  client.end();
});

4. 通用建议

错误处理：在实际应用中，建议对数据库操作中的错误进行详细处理，避免程序崩溃。
环境变量：将数据库连接信息（如用户名、密码）存储在环境变量中，避免直接写入代码。
ORM 工具：对于关系型数据库，可以使用 ORM 工具（如 Sequelize）来简化数据库操作。

posted @ 2025-02-14 11:05 笨笨的虎狼阅读(36) 评论(0) 收藏举报

刷新页面返回顶部

bbdhl

node（中）

Express 框架入门教程

1. 简介

2. 安装环境

3. 创建 Express 项目

3.1 初始化项目

3.2 安装 Express

4. 创建基本的 Express 应用

4.1 启动应用

5. 中间件

5.1 使用内置中间件

5.2 自定义中间件

5.3 第三方中间件

6. 路由

6.1 基本路由

6.2 路由参数

6.3 查询参数

6.4 路由分组

7. 静态文件服务

8. 错误处理

9. 连接数据库

9.1 安装 MongoDB 驱动

9.2 连接数据库

9.3 定义模型

10. 部署

10.1 使用 PM2

ejs (后端渲染)

1. 创建 Express 项目

1.1 初始化项目

1.2 安装 Express 和 EJS

2. 配置 Express 使用 EJS

3. 创建 EJS 模板

3.1 创建 index.ejs 文件

3.2 EJS 语法说明

4. 创建静态文件目录（可选）

5. 启动应用

Express创建项目

如何使用 express-generator

1. 安装 express-generator

2. 创建项目

3. 项目结构

4. 安装依赖并运行

操作数据库

1. MySQL 数据库

安装 MySQL 驱动

创建数据库连接

使用连接池

2. MongoDB 数据库

安装 Mongoose

连接 MongoDB

定义模型并操作数据

3. PostgreSQL 数据库

安装 PostgreSQL 驱动

创建数据库连接

4. 通用建议

3.1 创建 `index.ejs` 文件

如何使用 `express-generator`

1. 安装 `express-generator`