# 万象口袋项目-跨平台一站式信息聚合式软件 面试资料 **项目名称**:万象口袋项目-跨平台一站式信息聚合式软件 **时间**:2025.08 - 2026.01 **技术栈**:Golang,Gin,MySQL,React、 **技术栈**:Java,SpringBoot,MySQL,React、 **描述**:跨平台一站式信息聚合式软件 **上线地址**:https://infogenie.shumengya.top **开源地址**:https://github.com/shumengya/infogenie **本地实现技术栈(当前仓库版本)** - 前端:React 18.2.0、React Router DOM 6.15.0、Styled Components 6.0.7、Axios 1.5.0、React Hot Toast、React Icons、Create React App - 前端架构:React Context API(用户态管理)、混合架构(SPA + public 静态HTML模块)、PWA(Service Worker 离线缓存与 SWR 策略) - 后端:Go 1.25、Gin 1.12、GORM 1.31 + MySQL、gin-contrib/cors、go-playground/validator、joho/godotenv - 后端能力:外部认证中心 JWT 校验与用户态透传、AI供应商(DeepSeek/Kimi) OpenAI兼容接口调用、并发扣费互斥与重试回退、站点展示配置与AI上游运行时管理 - 数据库:MySQL(AIUsageRecord、Site60sDisabled、Site60sUpstream、SiteAIRuntime 等表,GORM 自动迁移) - 工程化:后端 Dockerfile + docker-compose,.env 多环境配置;前端 CRA 构建与 Service Worker 预缓存 ## 技术特点总结(可用于简历) - 前后端分离与RESTful:Gin 路由分组与中间件清晰,统一 JSON 响应;前端 Axios 拦截器统一鉴权与错误提示 - 混合前端架构:React SPA 与 public 静态HTML模块并存,静态页通过 iframe + window.parent 环境注入与本地 token 传递,兼顾体验与加载速度 - 认证与用户态:对接外部认证中心,后端中间件验证 JWT 并透传用户态;前端 Context 管理登录态与本地持久化 - AI接口与计费:DeepSeek/Kimi OpenAI兼容调用、超时与指数回退;并发扣费互斥锁、扣费失败与余额不足的严格返回码 - 站点运行时配置:管理员口令保护的 60s 展示开关与数据源切换、AI上游 base/key/model 运行时配置写入数据库并脱敏展示 - 安全与合规:CORS 策略受控、敏感配置环境变量化、后端仅在开发打印基础设施地址;管理员端采用常量口令 + 服务端令牌比对 - 性能优化:PWA 预缓存入口与 runtime 缓存、SW 导航离线回退、静态模块直出;前端渐变背景与轻量组件保持流畅交互 - 工程化与部署:后端 Dockerfile + docker-compose 支持;前端 CRA 标准构建流程与静态资源缓存策略;多环境 .env ## 架构设计亮点 - SPA核心层:React Router v6 管理路由;UserContext 统一登录态;Navigation/Header/Footer 组成稳定布局 - 静态模块:60sAPI/小游戏/工具箱大量原生HTML/CSS/JS模块,FullscreenEmbed 全屏嵌入并注入 token - 站点后台:AdminPage 管理 60s 展示开关、数据源与 AI 上游;与后端 X-Site-Admin-Token 双向校验 - 后端分层:router/middleware/handler/service/database/model 分层清晰;GORM 自动迁移与表结构约束 - 可靠性:AI 调用指数退避重试、健康检查检测数据库连接状态、并发扣费互斥锁规避竞态 ## 关键功能模块 - 60s聚合信息展示:周期资讯/热门榜单/实用功能/消遣娱乐分类配置;支持节点切换(self/official),静态页按 itemId 映射 - 小游戏集合:2048、俄罗斯方块、别踩白方块、贪吃蛇、扫雷、跑酷、打飞机、FloppyBird、网页魔方等,移动端优化即点即玩 - AI工具集:变量命名、写诗、姓名评测、语言翻译、文章转文言文、表情生成、Linux命令、Markdown排版、亲戚称呼计算器 - 认证与用户:认证中心接入,后端 JWT 验证并透传用户资料;前端登录回调与本地存储持久化 - 计费与统计:每次 AI 调用扣除 100 萌芽币、扣费通过管理员接口更新认证中心;记录 AIUsageRecord 便于统计 ## 安全与性能实践 - 认证与保护:后端 JWT 验证中间件、管理员令牌常量 + 服务端校验;并发扣费互斥锁避免竞态 - 配置安全:环境变量/.env 管理敏感信息,管理员口令与服务端令牌一致性校验;AI Key 脱敏回显与保留策略 - 前端性能:PWA 预缓存 + runtime SWR、离线导航回退、静态模块直出;Axios 错误统一提示与 401 清理会话 - 后端健壮:AI 调用超时与指数退避、健康检查检测数据库连接状态、GORM 连接池与生命周期管理 ## 部署与运维 - 前端:npm run build 标准构建,Service Worker 自动预缓存入口;支持静态资源离线加载 - 后端:Dockerfile + docker-compose 一键编排,环境变量控制端口与数据库;GORM 自动迁移表结构 - 可观测性:AIUsageRecord 与站点配置表为运营与审计提供基础数据;脚本与工具支撑静态页一致性校验 ## 个人职责与成果(示例措辞) - 推动 React SPA + 静态HTML 混合架构落地,封装 FullscreenEmbed 组件实现 token 注入与全屏嵌入 - 设计后端 Gin 分层与中间件体系,接入外部认证中心,完成 JWT 验证与用户态透传 - 实现 AI 调用链路(DeepSeek/Kimi),加入指数回退与超时控制;并发扣费互斥锁与扣费回滚提示 - 搭建后端 Docker 与 compose,GORM 自动迁移与连接池优化;完善 .env 多环境配置 - 开发管理员后台:60s 展示开关、数据源切换、AI 上游运行时配置(密钥脱敏与保留策略) - 完成 PWA 缓存策略与离线回退、Axios 拦截器统一错误提示,保证移动端与弱网下的可用性