Browser SDK Demo

中文 | English

🌟 项目简介

Browser SDK Demo 是一个完整的浏览器端SDK演示项目，包含后台管理系统、服务端API和桌面客户端应用。该项目展示了现代Web技术栈的最佳实践，适用于SDK集成方、前端开发者和平台运维人员。

🏗️ 项目架构

browser-sdk-demo/
├── sdk-server/    # 服务端API (Go + Gin)
├── sdk-client/    # 桌面客户端 (Electron + Vue 3)

技术栈概览

前端技术栈:

• Vue 3 + TypeScript
• Vite 构建工具
• Pinia 状态管理
• Element Plus UI 组件库
• Electron 桌面应用框架

后端技术栈:

• Go 语言 (1.25+)
• Gin Web 框架
• GORM ORM
• JWT 认证
• SQLite 数据库

🚀 快速开始

环境要求

• Node.js: >= 20.19.0
• Go: >= 1.25
• pnpm: 包管理器
• SQLite: 数据库

下载项目

# 克隆项目
git clone https://github.com/browsersdk/browser-sdk-demo.git
cd browser-sdk-demo

配置 API Key

resources/config.dev.yaml

extend:
  bro-sdk:
    endpoint: https://api.brosdk.com
    api-key: 这里填写你的 API Key

启动服务

1. 启动后端服务:

cd sdk-server
go mod tidy
go run main.go start -c resources/config.dev.yaml

2. 启动桌面客户端:

cd sdk-client-ts
npm install
npm run dev

3. 创建环境: 登录界面使用默认用户名和密码，点击登录。 点击创建环境，填写环境名，选择内核版本和操作系统，点击确认。

3. 启动环境: 选择刚刚创建的环境，点击启动，第一次启动会自动下载内核，根据网络需要等待一段时间。

📁 目录结构

browser-sdk-demo/
│
├── sdk-server/            # 服务端
│   ├── cmd/               # 命令行工具
│   ├── common/            # 公共工具
│   ├── modules/           # 业务模块
│   ├── resources/         # 配置资源
│   ├── go.mod             # Go模块
│   └── main.go            # 入口文件
│
├── sdk-client-ts/            # 客户端
│   ├── src/               # Vue源码
│   ├── electron/          # Electron主进程
│   ├── package.json       # 依赖配置
│   └── vite.config.ts     # 构建配置
│
└── README.md              # 项目说明

🔧 核心功能

服务端API (sdk-server)

• RESTful API 接口
• JWT Token 认证
• 数据库操作
• 日志记录
• 中间件支持

桌面客户端 (sdk-client)

• Electron 桌面应用
• 浏览器环境控制
• 实时状态监控
• 本地数据存储
• 跨平台支持

⚙️ 配置说明

bro-sdk 配置

项目中的 bro-sdk 配置用于连接浏览器 SDK 服务：

bro-sdk:
  endpoint: https://api.brosdk.com # 请替换为实际值 
  api-key:  xxxxx                  # 请替换为实际值

配置项说明：

• endpoint: 浏览器 SDK 服务的访问地址
• api-key: 用于身份验证的 API 密钥

注意事项：

• 请根据实际部署环境修改 endpoint 地址
• api-key 为敏感信息，请妥善保管
• 在生产环境中建议使用 HTTPS 协议

其他重要配置

• 数据库配置: 支持 SQLite 和 MySQL
• 缓存配置: 支持内存和 Redis 缓存
• 日志配置: 可配置日志级别和输出格式
• JWT配置: 用于用户认证的 Token 配置

🛠️ 开发指南

代码规范

前端开发:

# 代码检查
pnpm lint

# 代码格式化
pnpm format

# 类型检查
pnpm type-check

后端开发:

# 代码格式化
go fmt ./...

# 代码检查
go vet ./...

构建部署

构建前端:

# 客户端构建
cd sdk-client
npm run build

## win 构建
npm run build:win

构建后端:

cd sdk-server
go build -ldflags "-w -s" -o bin/server main.go

测试

# 后端测试
cd sdk-server && go test ./...

📊 API文档

API文档通过 Swagger 自动生成，启动服务后访问:

http://localhost:7888/swagger/index.html

🤝 贡献指南

1. Fork 项目
2. 创建功能分支 (git checkout -b feature/AmazingFeature)
3. 提交更改 (git commit -m 'Add some AmazingFeature')
4. 推送到分支 (git push origin feature/AmazingFeature)
5. 开启 Pull Request

提交规范

遵循 Conventional Commits 规范:

• feat: 新功能
• fix: Bug修复
• docs: 文档更新
• style: 代码格式调整
• refactor: 代码重构
• test: 测试相关
• chore: 构建过程或辅助工具的变动

📄 许可证

本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情

📞 联系方式

• 项目主页: https://github.com/browsersdk/browser-sdk-demo
• Issues: https://github.com/browsersdk/browser-sdk-demo/issues

---

Made with ❤️ by browsersdk