离线提示可通过监听 navigator.onLine 与 online/offline 事件实现，配合固定顶部 banner、无障碍支持及重试机制，轻量可靠。
在离线状态下，通过监听 navigator.onLine 和网络事件，配合简洁的 DOM 操作，就能快速给出用户友好的提示界面，无需后端参与。
监听网络状态变化
利用 window.addEventListener('online') 和 'offline' 实时捕获连接切换：
- 页面加载时立即检查
navigator.onLine初始值，避免首次打开就离线却无提示 - 绑定事件后，状态变更时动态显示/隐藏提示条，不依赖定时轮询
- 注意：该 API 在部分老旧安卓 WebView 中可能不准，可辅以简单 fetch 探测（如请求一个轻量本地资源）增强可靠性
设计轻量提示 UI（不遮挡核心内容）
推荐使用顶部固定 banner，避免弹窗打断操作流：
- 用
position: fixed; top: 0; width: 100%; z-index: 9999;确保始终可见 - 离线时显示浅灰色背景 + 黄色感叹号图标 + 简短文案（如“您当前处于离线状态”）
- 在线时自动淡出（可用 CSS transition 或简单 removeClass），不残留 DOM
- 为无障碍考虑，添加
aria-live="polite"，让屏幕阅读器能播报状态变化
增强用户体验的小细节
让提示更自然、更可操作：
java-api-doc-generator
下载
分析 Java Spring Boot 后端 Controller 代码，自动生成 Markdown 格式的接口文档。当用户说“生成 Java 接口文档”、“生成 API 文档”、“从 Spring 代码生成文档”时触发。
- 离线提示旁加一个「重试」按钮，点击后执行一次
fetch('/health')或重新检查navigator.onLine，成功则自动关闭提示 - 若页面支持离线缓存（如 Service Worker + Cache API），可在提示中补充“部分内容仍可查看”提升信任感
- 对表单类操作，在提交前主动校验
navigator.onLine，提前拦截并提示，而非等请求失败再反馈
兼容性与降级处理
面向真实环境做务实适配：
- IE10+ 支持
navigator.onLine，低于此版本可跳过监听，或 fallback 到「无网络事件，仅首次检测」 - 某些企业内网或代理环境会误报 online，建议关键操作（如支付、提交）仍以实际请求结果为准，状态提示仅作辅助
- 避免在提示中使用绝对化表述（如“无法访问任何功能”），改用中性措辞（如“部分功能暂不可用”）
不复杂但容易忽略。核心是快响应、轻展示、有反馈——用户一眼看懂状态，顺手点一下就能验证恢复，体验就稳了。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
