国际化、锁屏与 WebSocket
国际化
语言包位于 src/i18n/locales/zh-CN.ts 与 en-US.ts。组件中使用:
ts
const { t } = useI18n()
t('common.confirm')非组件代码使用 i18n.global.t()。新增文案时应同时补齐所有语言,避免把可见中文散落在业务逻辑中。日期、数字和货币还应使用 Intl 或 Vue I18n 的格式化能力。
锁屏
用户可以直接锁屏,也可以设置本地快捷 PIN。默认解锁方式是把登录密码发送到后端校验;登录密码不在前端存储或比对。可选 PIN 仅以简单散列保存,并支持空闲自动锁定和跨标签同步。
纯前端锁屏只能防止临时误操作,不能阻止能够操作 DevTools 的人。高安全系统应让后端在锁定时暂停会话或使 Token 失效,解锁后重新鉴权。
WebSocket
src/utils/websocket.ts 提供连接、发送、关闭与 open/close/message 回调;消息默认按 JSON 解析。stores/socket.ts 管理连接状态,views/feature/socket 提供演示。
生产使用建议补充:
- 使用
wss://,并设计短期连接凭据。 - 心跳、断线指数退避、网络恢复重连。
- 消息 schema 校验、版本号和最大消息大小。
- 页面/用户退出时取消监听与关闭连接。
- 服务端逐条校验订阅权限,不信任前端传入的用户或租户 ID。
富文本与上传
富文本输出在展示前必须经过可信 HTML 清洗;文件上传必须由后端校验 MIME、文件头、扩展名、大小与访问权限。不要把用户提供的 HTML、SVG 或 URL 直接放入高权限后台页面。