Next.js与MySQL PostgreSQL

Next.js与MySQL/PostgreSQL

介绍

Next.js 是一个流行的 React 框架，支持服务端渲染（SSR）、静态站点生成（SSG）和 API 路由。在实际应用中，数据库集成是构建动态网站的关键部分。MySQL 和 PostgreSQL 是两种广泛使用的关系型数据库，Next.js 可以通过多种方式与它们集成，包括直接连接、ORM（对象关系映射）工具或 REST/GraphQL API。

本章将详细介绍如何在 Next.js 项目中集成 MySQL 和 PostgreSQL，涵盖基础配置、查询执行、性能优化和实际应用场景。

数据库选择：MySQL vs PostgreSQL

MySQL 和 PostgreSQL 都是强大的关系型数据库，但各有特点：

• MySQL：

 - 适合高并发读写场景，如 Web 应用。  
 - 简单易用，社区支持广泛。  
 - 默认事务隔离级别为 REPEATABLE READ。  

• PostgreSQL：

 - 支持更复杂的数据类型（如 JSON、GIS）。  
 - 严格遵循 SQL 标准，支持高级功能（如窗口函数）。  
 - 默认事务隔离级别为 READ COMMITTED。  

在 Next.js 中连接数据库

直接连接

Next.js 允许在 API 路由或服务端函数中直接连接数据库。以下是两种数据库的配置示例。

MySQL 连接示例

  
// pages/api/data.js  
import mysql from 'mysql2/promise';

export default async function handler(req, res) {
  const connection = await mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: 'password',
    database: 'nextjs_db'
  });

  const [rows] = await connection.execute('SELECT * FROM users');
  await connection.end();

  res.status(200).json(rows);
}

PostgreSQL 连接示例

  
// pages/api/data.js  
import { Pool } from 'pg';

const pool = new Pool({
  user: 'postgres',
  host: 'localhost',
  database: 'nextjs_db',
  password: 'password',
  port: 5432,
});

export default async function handler(req, res) {
  const client = await pool.connect();
  const { rows } = await client.query('SELECT * FROM users');
  client.release();

  res.status(200).json(rows);
}

使用 ORM（Prisma 或 Sequelize）

ORM 工具可以简化数据库操作。以下是 Prisma 的配置示例：

  
// schema.prisma  
datasource db {
  provider = "postgresql" // 或 "mysql"
  url      = env("DATABASE_URL")
}

model User {
  id    Int     @id @default(autoincrement())
  name  String
  email String  @unique
}

在 Next.js API 路由中使用 Prisma：

  
// pages/api/users.js  
import prisma from '../../lib/prisma';

export default async function handler(req, res) {
  const users = await prisma.user.findMany();
  res.status(200).json(users);
}

实际案例：用户管理系统

假设我们需要构建一个用户管理系统，支持以下功能： 1. 用户注册（写入数据库）。 2. 用户列表展示（读取数据库）。

MySQL 实现

  
// pages/api/register.js  
import mysql from 'mysql2/promise';

export default async function handler(req, res) {
  if (req.method === 'POST') {
    const { name, email } = req.body;
    const connection = await mysql.createConnection(/* 配置 */);
    await connection.execute(
      'INSERT INTO users (name, email) VALUES (?, ?)',
      [name, email]
    );
    await connection.end();
    res.status(201).json({ message: 'User created' });
  }
}

PostgreSQL 实现

  
// pages/api/users.js  
import { Pool } from 'pg';

const pool = new Pool(/* 配置 */);

export default async function handler(req, res) {
  if (req.method === 'GET') {
    const { rows } = await pool.query('SELECT * FROM users');
    res.status(200).json(rows);
  }
}

性能优化

• 连接池：使用连接池（如 `mysql2/pool` 或 `pg.Pool`）避免频繁创建/销毁连接。
• 缓存：对频繁读取的数据使用 Redis 缓存。
• 索引：为常用查询字段添加数据库索引。

graph LR A[Next.js 应用] --> B[API 路由] B --> C[MySQL/PostgreSQL] C --> D[(数据库服务器)]

安全注意事项

1. 使用环境变量存储数据库凭据（如 `DATABASE_URL`）。 2. 防止 SQL 注入：始终使用参数化查询（如 `?` 占位符）。 3. 限制数据库用户权限（如只读/只写）。

总结

Next.js 与 MySQL/PostgreSQL 的集成是构建全栈应用的核心技能。通过直接连接或 ORM 工具，开发者可以高效地操作数据库。实际项目中需结合性能优化和安全实践，确保应用稳定可靠。