今日目标
- 让后端服务稳定启动,加载最新静态资源与 WebSocket 逻辑。
- 修复聊天气泡左右归属判定错误(所有消息都在右侧)。
- 提升右侧气泡内昵称与时间的可读性(颜色对比度不足)。
实施过程
- 多次尝试本地启动方式,修正命令语法后仍遭遇解析错误与类路径问题。
- 通过打包生成可执行 JAR 并用
java -jar
启动,绕过类路径依赖问题。 - 在前端用
sessionStorage
为每个标签页生成独立clientId
,移除昵称回退判定。 - 调整右侧气泡
.sender
与.meta
的颜色,提高在深色背景下的可读性。 - 重新打包并重启服务,打开本地页面进行可视化验证。
遇到问题 - 启动命令在 PowerShell 解析时报
MissingExpressionAfterOperator
,启动失败。 - 直接用
java -cp
启动主类报缺少SpringApplication
,类路径未包含 Spring Boot 依赖。 - 打包失败:JAR 重命名被占用(文件锁),无法生成
*.jar.original
。 - 前端判定逻辑错误:同一浏览器多窗口共享 ID,导致“自己”判定失真。
解决方案 - 统一走打包启动流程:
mvn -q -DskipTests package
后用java -jar target\\chat-1.0-SNAPSHOT.jar
启动,确保依赖与资源齐全。 - 释放文件锁:终止本机所有 Java 进程后再打包,打包正常完成。
- 归属判定改造:用
sessionStorage
生成并存储clientId
,仅使用clientId
判断左右气泡,移除昵称回退逻辑。 - 提升可读性:在
static/index.html
中增加右侧气泡内文字颜色覆盖.msg.out .sender { color: rgba(255,255,255,0.92); }
.msg.out .meta { color: rgba(255,255,255,0.78); }
验证与结果
- 服务成功启动,Tomcat 运行在
8080
,欢迎页映射到static/index.html
。 - 左右气泡归属按
clientId
生效,跨浏览器标签页测试正常。 - 右侧气泡中的昵称和时间在深蓝背景下对比度显著提升,可读性良好。
- 本地访问地址:
http://localhost:8080/
收获与反思 - 复杂项目启动优先选择“打包 + JAR 启动”,避免本地环境差异与类路径陷阱。
- 前端判定逻辑应避免使用可跨标签页共享的数据源(如
localStorage
),会干扰“自己/他人”判断。 - 样式在深色背景下应关注信息层级的对比度,适度提升白色系透明度能兼顾美观与可读性。
- 当打包失败涉及文件锁,优先排查是否有正在运行的进程占用目标文件。