我是如何用Vercel零成本部署小程序后台的
最近在做一个微信小程序项目，后台需要部署到云端，但是后端业务相对简单，购买服务器的话超出预算了。经过一番调研，发现 Vercel 是个不错的选择：免费、简单、速度快。今天就来分享一下具体的部署过程。
项目后台演示
为什么选择 Vercel
传统的服务器部署需要自己管理服务器、配置环境、处理运维问题。而 Vercel 这类 Serverless 平台的出现，让部署和API部署变得极其简单。
对于小程序后台来说，Vercel 有几个明显的优势：
- 零配置部署：推送代码就能自动部署
- 全球 CDN：访问速度快
- 免费额度：个人项目完全够用
- 自动 HTTPS：省去证书配置的麻烦
项目结构
我们的小程序后台是一个标准的 Node.js + Express 应用，主要文件结构如下：
backend/
├── app.js # 主应用文件
├── package.json # 依赖配置
├── vercel.json # Vercel 配置文件
├── deploy.sh # 部署脚本
├── .env # 环境变量
└── admin/ # 管理后台静态文件核心配置文件
1. vercel.json
这是 Vercel 的配置文件，告诉 Vercel 如何构建和运行我们的应用：
{
"version": 2,
"builds": [
{
"src": "app.js",
"use": "@vercel/node"
}
],
"routes": [
{
"src": "/(.*)",
"dest": "/app.js"
}
],
"env": {
"NODE_ENV": "production",
"VERCEL": "1"
}
}这个配置很简单：
builds指定构建规则，使用@vercel/node来处理 Node.js 应用routes将所有请求都路由到app.jsenv设置环境变量
2. package.json
关键是要有正确的启动脚本：
{
"name": "backend",
"version": "1.0.0",
"main": "app.js",
"scripts": {
"start": "node app.js",
"dev": "nodemon app.js",
"vercel-build": "echo \"Vercel build completed\""
},
"dependencies": {
"express": "^5.1.0",
"cors": "^2.8.5",
"mysql2": "^3.14.3",
"jsonwebtoken": "^9.0.2",
"bcryptjs": "^3.0.2",
"dotenv": "^17.2.1",
"axios": "^1.11.0",
"multer": "^2.0.2",
"sharp": "^0.34.3",
"sqlite3": "^5.1.7"
}
}3. 应用入口文件
app.js 是我们的主应用文件，需要注意几个关键点：
const express = require('express');
const cors = require('cors');
const mysql = require('mysql2/promise');
require('dotenv').config();
const app = express();
const PORT = process.env.PORT || 3000;
// CORS 配置 - 重要！
app.use(cors({
origin: true,
credentials: true,
methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'],
allowedHeaders: ['Content-Type', 'Authorization', 'X-Requested-With']
}));
// 静态文件服务
app.use('/admin', express.static(path.join(__dirname, './admin')));
// 数据库配置
const dbConfig = {
host: process.env.DB_HOST || 'localhost',
port: process.env.DB_PORT || 3306,
user: process.env.DB_USER || 'root',
password: process.env.DB_PASSWORD || '',
database: process.env.DB_NAME || 'zhaoyimei_db'
};
// 重要：Vercel 环境下不启动监听
if (process.env.NODE_ENV !== 'production' || !process.env.VERCEL) {
const server = app.listen(PORT, '0.0.0.0', () => {
console.log(`服务器运行在端口 ${PORT}`);
});
}
// 导出 app 供 Vercel 使用
module.exports = app;最后两行很关键。在 Vercel 环境下，我们不需要启动 HTTP 服务器，只需要导出 Express 应用实例即可。
部署脚本
为了简化部署流程，我写了一个自动化脚本：
#!/bin/bash
echo "🚀 开始部署到 Vercel..."
# 检查是否安装了 Vercel CLI
if ! command -v vercel &> /dev/null; then
echo "❌ Vercel CLI 未安装，正在安装..."
npm install -g vercel
fi
# 检查是否已登录
echo "🔐 检查 Vercel 登录状态..."
if ! vercel whoami &> /dev/null; then
echo "📝 请先登录 Vercel:"
vercel login
fi
# 部署到生产环境
echo "📦 部署到生产环境..."
vercel --prod
echo "✅ 部署完成！"
echo "📋 请记住在 Vercel Dashboard 中配置环境变量"环境变量配置
部署完成后，需要在 Vercel Dashboard 中配置环境变量。我们的项目需要这些变量：
DB_HOST- 数据库主机DB_PORT- 数据库端口DB_USER- 数据库用户名DB_PASSWORD- 数据库密码DB_NAME- 数据库名称JWT_SECRET- JWT 密钥WECHAT_APPID- 微信小程序 AppIDWECHAT_SECRET- 微信小程序密钥
在 Vercel Dashboard 的项目设置页面，找到 "Environment Variables" 选项，逐一添加这些变量。
数据库选择
我用的sqlpub的开发版数据库，数据库版本是mysql8.4.0，一年9元，1G容量。也有免费版的500M容量，如果测试用可以免费申请使用这个版本的
部署步骤
整个部署过程非常简单：
直接运行我们的部署脚本：
chmod +x deploy.sh && ./deploy.sh常见问题
1. CORS 问题
小程序访问后台 API 时，经常遇到跨域问题。解决方案是在 Express 中正确配置 CORS：
app.use(cors({
origin: true, // 允许所有来源
credentials: true,
methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS']
}));2. 静态文件服务
如果你的后台包含管理界面等静态文件，需要正确配置静态文件服务：
app.use('/admin', express.static(path.join(__dirname, './admin')));3. 数据库连接
建议使用连接池来管理数据库连接，避免连接数过多的问题：
const pool = mysql.createPool(dbConfig);访问优化
自定义域名
部署成功后vercel会免费分配一个域名，但是国内访问效果不佳，需要自定义域名
服务器位置选择
系统默认部署到其他洲的服务器，这就让我们的访问速度比较慢，需要手动更改地区为亚洲的HongKong
总结
Vercel 让小程序后台的部署变得非常简单。整个过程只需要几个配置文件和一条命令，就能把本地开发的应用部署到全球 CDN 上。
相比传统的服务器部署，Vercel 的优势很明显：
- 不需要管理服务器
- 自动扩容
- 全球加速
- 免费 HTTPS
- 与 Git 集成，推送即部署
对于个人开发者和小团队来说，这种 Serverless 的部署方式确实是个不错的选择。
当然，Vercel 也有一些限制，比如函数执行时间限制、冷启动问题等。但对于大多数小程序后台来说，这些限制都不是问题。
我之前还写过一篇关于把小程序后台部署的cloudflare workers的教程，大家感兴趣也可以参考一下。