返回模板
Go Fiber - EdgeOne Pages 云函数
在 EdgeOne Pages 上使用 Fiber——受 Express 启发、基于 fasthttp 的 Go 框架，支持中间件和 JSON 解析。
| 框架 | Go |
| 应用场景 | 快速开始,Cloud Functions |
Go Cloud Functions on EdgeOne Pages - Fiber 框架
一个基于 Next.js + Tailwind CSS 前端和 Go Fiber 后端的全栈演示应用，展示如何在 EdgeOne Pages 上使用 Fiber 框架部署 Go 云函数，支持 RESTful API 路由。
🚀 特性
- Fiber 框架集成：基于 fasthttp 的 Express 风格 Go Web 框架，支持中间件、JSON 解析和路由组
- 现代化 UI 设计：深色主题搭配 #1c66e5 点缀色，响应式布局配合交互元素
- 交互式 API 测试：内置 API 端点测试面板 — 点击 "Call" 实时测试每个 REST 端点
- RESTful API 设计：完整的 Todo CRUD 操作，使用结构化路由组（
/api/todos） - TypeScript 支持：前端完整的类型定义和类型安全
🛠️ 技术栈
前端
- Next.js 15 - React 全栈框架（支持 Turbopack）
- React 19 - 用户界面库
- TypeScript - 类型安全的 JavaScript
- Tailwind CSS 4 - 实用优先的 CSS 框架
UI 组件
- shadcn/ui - 高质量 React 组件
- Lucide React - 精美的图标库
- class-variance-authority - 组件样式变体管理
- clsx & tailwind-merge - CSS 类名合并工具
后端
- Go 1.21 - 云函数运行时
- Fiber v2 - 基于 fasthttp 的 Express 风格 Go Web 框架
📁 项目结构
go-fiber/
├── cloud-functions/ # Go 云函数源码
│ ├── api.go # Fiber 应用，包含所有 REST API 路由
│ ├── go.mod # Go 模块定义
│ └── go.sum # Go 依赖校验和
├── src/
│ ├── app/ # Next.js App Router
│ │ ├── globals.css # 全局样式（深色主题）
│ │ ├── layout.tsx # 根布局
│ │ └── page.tsx # 主页面（API 测试界面）
│ ├── components/ # React 组件
│ │ └── ui/ # UI 基础组件
│ │ ├── button.tsx # 按钮组件
│ │ └── card.tsx # 卡片组件
│ └── lib/ # 工具函数
│ └── utils.ts # 通用工具（cn 辅助函数）
├── public/ # 静态资源
│ ├── eo-logo-blue.svg # EdgeOne 标志（蓝色）
│ └── eo-logo-white.svg # EdgeOne 标志（白色）
├── package.json # 项目配置
└── README.md # 项目文档
🚀 快速开始
环境要求
- Node.js 18+
- pnpm（推荐）或 npm
- Go 1.21+（本地开发需要）
安装依赖
pnpm install
# 或
npm install
开发模式
edgeone pages dev
访问 http://localhost:8088 查看应用。
构建生产版本
edgeone pages build
🎯 核心功能
1. Fiber REST API 路由
所有 API 端点定义在单个 cloud-functions/api.go 文件中，使用 Fiber 的路由组：
| 方法 | 路由 | 说明 |
|---|---|---|
| GET | / | 欢迎消息及路由列表 |
| GET | /health | 健康检查 |
| GET | /api/todos | 获取待办事项列表 |
| POST | /api/todos | 创建新待办事项 |
| GET | /api/todos/:id | 根据 ID 获取待办事项 |
| PATCH | /api/todos/:id/toggle | 切换待办事项完成状态 |
| DELETE | /api/todos/:id | 删除待办事项 |
2. 交互式 API 测试面板
- 7 个预配置的 API 端点卡片，带 "Call" 按钮
- 实时 JSON 响应展示
- POST 请求支持预填充 JSON Body
- 加载状态和错误处理
3. Fiber 框架约定
Go 后端使用 Fiber 的标准模式 — 路由组、Body 解析和内置中间件：
package main
import (
"github.com/gofiber/fiber/v2"
"github.com/gofiber/fiber/v2/middleware/recover"
)
func main() {
app := fiber.New()
app.Use(recover.New())
app.Get("/health", func(c *fiber.Ctx) error {
return c.JSON(fiber.Map{
"status": "ok",
"framework": "fiber",
})
})
api := app.Group("/api")
api.Get("/todos", listTodos)
api.Post("/todos", createTodo)
api.Get("/todos/:id", getTodo)
api.Patch("/todos/:id/toggle", toggleTodo)
api.Delete("/todos/:id", deleteTodo)
app.Listen(":9000")
}
4. 数据模型
type Todo struct {
ID int `json:"id"`
Title string `json:"title"`
Completed bool `json:"completed"`
CreatedAt time.Time `json:"createdAt"`
}
🔧 配置说明
Tailwind CSS 配置
项目使用 Tailwind CSS 4，支持自定义颜色变量：
:root {
--primary: #1c66e5; /* 主色调 */
--background: #000000; /* 背景色 */
--foreground: #ffffff; /* 前景色 */
}
组件样式
使用 class-variance-authority 管理组件样式变体，支持多种预设样式。
📚 文档入口
- EdgeOne Pages 官方文档：https://pages.edgeone.ai/document/go
- Fiber 框架文档：https://docs.gofiber.io
- Next.js 文档：https://nextjs.org/docs
- Tailwind CSS 文档：https://tailwindcss.com/docs
🚀 部署指南
EdgeOne Pages 部署
- 将代码推送到 GitHub 仓库
- 在 EdgeOne Pages 控制台创建新项目
- 选择 GitHub 仓库作为源
- 配置构建命令：
edgeone pages build - 部署项目
Go Fiber 云函数配置
在项目根目录创建 cloud-functions/api.go，编写 Fiber 应用：
package main
import "github.com/gofiber/fiber/v2"
func main() {
app := fiber.New()
app.Get("/hello", func(c *fiber.Ctx) error {
return c.JSON(fiber.Map{
"message": "Hello from Go Fiber on EdgeOne Pages!",
})
})
app.Listen(":9000")
}
部署
📄 许可证
本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情。