Vercel 全栈部署与数据存储
约 1252 字大约 4 分钟
vercel全栈Serverless数据库
2026-04-03
前后端项目部署架构
Vercel 的全栈部署基于 前端 + Serverless Functions 模式,不需要单独维护后端服务器。
用户请求
├── 静态页面 / SSR → Vercel CDN(全球边缘节点)
├── API 请求 → Serverless Function
│ └── 读写数据 → Vercel Storage / 外部数据库
└── 文件上传 → Vercel Blob项目目录结构
以 Next.js 为例,前后端代码在同一仓库中:
project/
├── app/ # 前端页面(App Router)
│ ├── page.tsx
│ └── layout.tsx
├── api/ # 后端 API(Serverless Functions)
│ ├── hello.ts → /api/hello
│ └── users/
│ └── [id].ts → /api/users/:id
├── lib/ # 共享逻辑(数据库连接等)
├── vercel.json
└── package.json提示
非 Next.js 项目也可以使用 api/ 目录,Vercel 会自动将其中的文件部署为 Serverless Functions。
Serverless Functions 特性
- 无状态:每次请求独立执行,不能在内存中持久化数据
- 自动扩缩容:根据请求量自动伸缩,无需手动管理
- 冷启动:不活跃的函数首次调用会有延迟(通常几百毫秒)
数据存储方案
Vercel 提供了一套官方存储服务,也支持接入外部数据库。
Vercel 官方存储
Vercel Postgres
基于 Neon 的 Serverless PostgreSQL,适合关系型数据存储。
# 安装
pnpm add @vercel/postgresimport { sql } from '@vercel/postgres'
// 查询
const { rows } = await sql`SELECT * FROM users WHERE id = ${userId}`
// 插入
await sql`INSERT INTO users (name, email) VALUES (${name}, ${email})`特点:
- 自动连接池管理,无需担心 Serverless 环境下的连接数问题
- 兼容标准 PostgreSQL,可配合 Prisma / Drizzle 等 ORM 使用
- 免费版:256 MB 存储,60 计算小时/月
Vercel KV
基于 Redis 的键值存储,适合缓存、Session、排行榜等场景。
pnpm add @vercel/kvimport { kv } from '@vercel/kv'
// 设置
await kv.set('user:1', { name: 'ZhenYu', role: 'admin' })
await kv.set('session:abc', 'user:1', { ex: 3600 }) // 1 小时过期
// 获取
const user = await kv.get('user:1')
// 自增(适合计数器、排行榜)
await kv.incr('page:views')特点:
- 读写延迟极低(毫秒级)
- 支持 Redis 常用数据结构(String、Hash、List、Set、Sorted Set)
- 免费版:256 MB 存储,30,000 请求/天
Vercel Blob
对象存储,适合文件上传、图片存储等场景。
pnpm add @vercel/blobimport { put, del, list } from '@vercel/blob'
// 上传文件
const blob = await put('avatars/user1.png', file, {
access: 'public',
contentType: 'image/png'
})
console.log(blob.url) // 返回 CDN 加速的公开 URL
// 列出文件
const { blobs } = await list({ prefix: 'avatars/' })
// 删除
await del(blob.url)特点:
- 自动 CDN 分发
- 免费版:500 MB 存储
Vercel Edge Config
超低延迟的只读键值存储,适合 Feature Flags、A/B 测试配置等。
pnpm add @vercel/edge-configimport { get } from '@vercel/edge-config'
// 读取配置(< 1ms 延迟)
const isFeatureEnabled = await get('feature_new_ui')
if (isFeatureEnabled) {
// 新 UI 逻辑
}特点:
- 读取延迟 < 1ms(数据部署在边缘节点)
- 通过 Vercel Dashboard 或 API 更新数据
- 适合读多写少的配置场景
官方存储对比
| 方案 | 类型 | 适用场景 | 免费额度 |
|---|---|---|---|
| Vercel Postgres | 关系型数据库 | 用户数据、业务数据 | 256 MB |
| Vercel KV | Redis 键值存储 | 缓存、Session、计数器 | 256 MB |
| Vercel Blob | 对象存储 | 文件上传、图片 | 500 MB |
| Edge Config | 只读键值 | Feature Flags、配置 | 512 条目 |
外部数据库接入
Vercel 也支持连接外部数据库服务,适合更大规模或特殊需求:
| 服务 | 说明 | 适用场景 |
|---|---|---|
| PlanetScale | Serverless MySQL | MySQL 生态、分支管理 |
| Supabase | PostgreSQL + Auth + Realtime | 需要实时功能的应用 |
| MongoDB Atlas | 云端 MongoDB | 文档型数据 |
| Upstash | Serverless Redis / Kafka | 消息队列、更灵活的 Redis |
| Turso | 基于 libSQL 的边缘数据库 | 超低延迟读取 |
注意
使用外部数据库时,需注意连接池管理。Serverless 环境下每次调用可能创建新连接,容易耗尽数据库连接数。建议:
- 使用数据库服务自带的 HTTP/Serverless 连接模式
- 使用 Prisma 的 Data Proxy 或
@prisma/adapter-* - 将数据库凭证配置在 Vercel 的环境变量中,避免硬编码
全栈项目示例
一个完整的 Next.js + Vercel Postgres 全栈应用:
// app/api/todos/route.ts
import { sql } from '@vercel/postgres'
import { NextResponse } from 'next/server'
export async function GET() {
const { rows } = await sql`SELECT * FROM todos ORDER BY created_at DESC`
return NextResponse.json(rows)
}
export async function POST(request: Request) {
const { title } = await request.json()
const { rows } = await sql`
INSERT INTO todos (title) VALUES (${title}) RETURNING *
`
return NextResponse.json(rows[0], { status: 201 })
}// app/page.tsx
'use client'
import { useState, useEffect } from 'react'
export default function Home() {
const [todos, setTodos] = useState([])
useEffect(() => {
fetch('/api/todos').then(r => r.json()).then(setTodos)
}, [])
const addTodo = async (title: string) => {
const res = await fetch('/api/todos', {
method: 'POST',
body: JSON.stringify({ title })
})
const todo = await res.json()
setTodos(prev => [todo, ...prev])
}
return (
<main>
{/* UI 省略 */}
</main>
)
}关键注意点
- 执行时长限制:Hobby 计划 Serverless Functions 最长 10s,Pro 计划 60s,不适合长时间任务
- Edge Functions 限制:运行更快但不能使用 Node.js 专有 API(如
fs、child_process) - 冷启动优化:选择较小的 Function 体积、减少依赖可降低冷启动时间
- 费用控制:关注数据库读写次数和带宽用量,合理使用缓存(Vercel KV)减少数据库压力
- 数据安全:数据库凭证必须通过环境变量配置,切勿提交到代码仓库
