一个专业的 AI 商品图生成平台，支持背景替换、风格转换等功能，采用积分制商业模式。
- 智能生成: 基于文本描述生成高质量商品图片
- 多种尺寸: 支持正方形、横版、竖版等多种图片比例
- 风格定制: 可自定义产品风格、背景、光线等参数
- 批量生成: 一次最多生成 4 张图片，提高效率
- 初始积分: 新用户注册即送 50 积分
- 积分消耗: 生成每张图片消耗 1 积分
- 多种充值: 提供 50-1000 积分的多种套餐选择
- 积分获取: 支持每日登录奖励、推荐奖励等方式
- 账户系统: 完整的用户注册、登录、管理功能
- 权限控制: AI 功能需要登录才能使用
- 积分管理: 实时查看积分余额和交易记录
- Next.js 14: React 全栈框架
- TypeScript: 类型安全的 JavaScript
- Tailwind CSS: 现代化 CSS 框架
- Shadcn/ui: 高质量 UI 组件库
- Next.js API Routes: 服务端 API 接口
- JWT 认证: 安全的用户身份验证
- 数据库: 支持 MySQL/PostgreSQL 等关系型数据库
- FAL.AI: 集成 Stable Diffusion 等先进 AI 模型
- BFL Kontext: 支持图片编辑和背景替换
- 百度翻译: 自动将中文 prompt 翻译为英文，提升 AI 生成质量
- 图片处理: 支持多种图片格式和尺寸
users: 用户基本信息user_credits: 用户积分余额credit_transactions: 积分交易记录credit_packages: 积分套餐配置ai_generation_tasks: AI 生成任务ai_generated_images: AI 生成结果
- 新用户注册: +50 积分
- 每日登录: +5 积分
- 推荐好友: +20 积分
- 提交反馈: +2 积分
- AI 图片生成: -1 积分/张
- 自动语言检测: 智能识别中文 prompt 并自动翻译为英文
- 提升 AI 质量: 英文 prompt 通常能获得更好的 AI 生成效果
- 优雅降级: 翻译失败时自动使用原文，不影响主流程
- 批量支持: 支持批量翻译多个文本
- 访问 百度翻译开放平台 注册账号
- 创建应用获取 APP ID 和密钥
- 在
.env.local中配置环境变量：NEXT_PUBLIC_BAIDU_TRANSLATE_APP_ID=your_app_id NEXT_PUBLIC_BAIDU_TRANSLATE_APP_KEY=your_app_key
import { translateToEnglish, autoTranslate } from "@/lib/baidu-translate";
// 基本翻译
const english = await translateToEnglish("一个漂亮的红色苹果");
// 结果: "A beautiful red apple"
// 自动检测语言
const auto = await autoTranslate("这是测试文本");
// 结果: "This is test text"详细配置说明请参考 百度翻译配置文档
- Node.js 18+
- pnpm/npm/yarn
- 数据库 (MySQL/PostgreSQL)
# 克隆项目
git clone https://github.com/your-username/ai-shop.git
cd ai-shop
# 安装依赖
pnpm install
# 配置环境变量
cp .env.example .env.local
# 编辑 .env.local 文件，配置数据库连接和AI服务密钥
# 运行数据库迁移
pnpm db:migrate
# 启动开发服务器
pnpm dev# 数据库配置
DATABASE_URL="mysql://username:password@localhost:3306/ai_shop"
# AI服务配置
NEXT_PUBLIC_BFL_KEY="your_bfl_api_key"
# 百度翻译API配置
NEXT_PUBLIC_BAIDU_TRANSLATE_APP_ID="your_app_id"
NEXT_PUBLIC_BAIDU_TRANSLATE_APP_KEY="your_app_key"JWT_SECRET="your-secret-key"
FAL_AI_KEY="your-fal-ai-key" FAL_AI_SECRET="your-fal-ai-secret"
ALIPAY_APP_ID="your-alipay-app-id" WECHAT_PAY_MCH_ID="your-wechat-pay-mch-id"
## 🔧 开发指南
### 项目结构
ai-shop/ ├── app/ # Next.js 应用页面 │ ├── ai-product/ # AI 商品图生成页面 │ ├── credits/ # 积分管理页面 │ ├── login/ # 用户登录页面 │ └── register/ # 用户注册页面 ├── components/ # React 组件 │ ├── ai-product/ # AI 功能相关组件 │ ├── auth/ # 认证相关组件 │ └── ui/ # 通用 UI 组件 ├── lib/ # 工具库 │ ├── auth.ts # 认证工具 │ ├── fal-ai.ts # AI 服务集成 │ └── utils.ts # 通用工具函数 ├── database/ # 数据库相关 │ ├── schema.sql # 主数据库结构 │ └── user_credits_schema.sql # 积分系统数据库 └── middleware.ts # Next.js 中间件
### 添加新功能
1. 在`app/`目录下创建新页面
2. 在`components/`目录下创建相关组件
3. 在`lib/`目录下添加业务逻辑
4. 更新数据库结构（如需要）
5. 添加相应的 API 路由
### 积分系统扩展
1. 在`credit_rules`表中添加新规则
2. 在相应的业务逻辑中调用积分扣除/增加函数
3. 更新前端界面显示积分变化
## 🔒 安全特性
### 认证安全
- JWT token 认证
- 密码加密存储
- 路由权限控制
- CSRF 防护
### 数据安全
- SQL 注入防护
- XSS 攻击防护
- 敏感信息加密
- 操作日志记录
## 📈 部署指南
### 生产环境部署
```bash
# 构建生产版本
pnpm build
# 启动生产服务器
pnpm start
# 或使用PM2管理进程
pm2 start ecosystem.config.js
# 构建镜像
docker build -t ai-shop .
# 运行容器
docker run -p 3000:3000 ai-shop- 生产环境使用强密码和密钥
- 配置 HTTPS 证书
- 设置数据库连接池
- 配置 CDN 和缓存
- Fork 项目
- 创建功能分支 (
git checkout -b feature/AmazingFeature) - 提交更改 (
git commit -m 'Add some AmazingFeature') - 推送到分支 (
git push origin feature/AmazingFeature) - 打开 Pull Request
本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情
- 项目主页: https://github.com/your-username/ai-shop
- 问题反馈: Issues
- 功能建议: Discussions
感谢以下开源项目和服务：
- Next.js - React 全栈框架
- FAL.AI - AI 服务提供商
- Shadcn/ui - UI 组件库
- Tailwind CSS - CSS 框架