数传集团实习Task3：对项目“契文星创”的前端结构剖析
文章目录
- 项目概要
- 接口设计
- 项目所用工具
- 小结
项目概要
“契文星创” 前端基于微信小程序构建，作为用户与系统交互的核心入口，以轻量化、易传播的特点为用户提供甲骨文相关的一站式服务。前端聚焦于打造直观、便捷的操作体验，涵盖多个核心功能页面，包括首页、个人界面、登录 / 注册界面、知识闯关界面、甲骨助手界面、古今转换界面、破译甲骨界面及艺术生成界面等。
各页面通过模块化设计实现明确的功能分工：首页作为总入口，整合图片轮播、功能导航及知识展示；登录 / 注册页面通过加密传输保障用户信息安全；甲骨助手页面基于 WebSocket 协议实现实时聊天交互；古今转换与破译甲骨页面支持图片上传（Base64 编码处理）和文字转换展示；知识闯关与艺术生成页面则通过趣味交互增强用户参与感。整体设计以 “文化传承 + 技术赋能” 为核心，旨在让用户便捷体验甲骨文识别、破译、学习及创作功能。
接口设计
接口地址
接口功能
请求格式
请求内容（请求头+请求体）
返回内容
/chat/send
处理用户发送的聊天消息
POST
请求头：content-type: application/json
+token
请求体：chatData
code：状态码
msg：失败的信息
data：助手的回答
/chat/getdata/{sessionId}
根据会话 ID 获取聊天数据
GET
请求头：content-type: application/json+
Token
请求体：无
data：消息列表
code：状态码
/chat/getsession/{userId}
根据用户 ID 获取会话
GET
请求头：content-type: application/json+token
请求内容：无
code：状态码
data：会话id
/files/upload
处理用户上传图片文件
POST
请求内容：
filePath+name
data：上传到服务器的存储地址
/predict
对甲骨文图片转简体字
POST
请求头： content-Type: \'application/x-www-form-urlencoded\',
请求内容：base64Image
data：预测内容
/pic/addHistory
增加一条艺术字信息
POST
请求头：content-type: application/json+token
请求内容：id+picUrl+stars+time
code：状态码
msg：失败的信息
/pic/getHistory
获取用户的艺术字历史记录
GET
请求头：无
请求内容：user.id
code：状态码
data：记录
/selection/get
获取选择题相关数据
GET
请求头：content-type: application/json+token
请求内容：无
code：状态码
data：用户信息
/selection/incScores ?id={user.id}
用于增加用户的积分
PUT
请求头：content-type: application/json+token
请求内容：id
code：状态码
data：用户信息
/islogin
验证用户的登录状态
POST
请求头：content-type: application/json+token
请求内容：无
code：状态码
/login
验证用户名和密码，返回登录结果
POST
请求头：content-type: application/json
请求内容：username
+password
code：状态码
data：用户信息
/register
处理用户的注册操作
POST
请求头：content-type: application/json
请求内容：phone+code+email+username+password+avater
code：状态码
msg：失败的信息
/sendEmailCode
根据邮箱，发送验证码
GET
请求头：content-type: application/json
请求内容：email
code：状态码
msg：失败的信息
/user/getUserInfo /?userId={user.id}
获取用户信息
GET
请求头：content-type: application/json+token
请求内容：无
code：状态码
data：用户信息
/user/update
更新用户信息
PUT
请求头： content-type: application/json+token
请求内容：
code：状态码
msg：失败信息
/oracle-bone/query
通过简体汉字返回甲骨文对应的oss图片链接
GET
请求头：content-type: application/json+token
请求内容：character
数据：data
/generate
上传图片进行风格化转变
POST
请求头：content-type: application/json+token
请求内容：base64Image
数据：data
项目所用工具
开发载体：微信小程序（依托微信生态，支持跨设备访问）
核心技术：
- 数据传输：通过
wx.request实现前后端 HTTP 通信，登录信息采用 SHA256 加密传输。 - 实时交互：甲骨助手模块基于 WebSocket 协议实现用户与后端 ChatService 的实时消息传递。
- 图片处理：支持图片上传（转换为 Base64 编码）、轮播展示及结果渲染。
- 界面组件：采用微信小程序原生组件（如输入框、按钮、轮播图等），结合自定义样式实现文化主题风格（如古朴背景、甲骨文元素）。
辅助工具：微信开发者工具（用于小程序调试、预览及发布）。
小结
“契文星创” 前端以用户体验为核心，通过微信小程序的轻量化特性降低用户使用门槛，同时以模块化界面设计覆盖甲骨文学习、识别、破译、创作等全场景需求。
在功能实现上，前端通过加密传输（SHA256）、实时通信（WebSocket）、图片编码（Base64）等技术保障交互安全性与流畅性；在体验设计上，结合甲骨文文化元素（如古朴背景、文字形态）增强场景沉浸感，通过趣味模块（如知识闯关、艺术生成）提升用户粘性。
前端作为连接用户与后端服务的桥梁，成功将复杂的甲骨文技术功能转化为直观可操作的界面，为学术群体、文化爱好者及青少年等不同用户群体提供了便捷的甲骨文数字化体验入口。
