项目背景：前端实时推送联调的痛点
在现代前端开发中，消息推送、实时通知等功能变得越来越常见，WebSocket和Server-Sent Events（SSE）是主流技术方案。实际开发联调时，后端接口往往未完成或难以稳定模拟，导致前端开发者难以验证实时通讯逻辑，后端开发者也很难模拟多端场景。
特别是新手开发者，可以使用这个工具，无需后端接口就绪，可以快速联调前端业务逻辑代码。
于是我使用node开发了这个小工具，因为是基于js的，对前端开发人员友好，为了降低难度，特别没有使用ts。
核心功能亮点
WebSocket & SSE 双协议支持
- 同时支持 WebSocket 和 SSE 两种实时推送协议。
- 多客户端连接，广播/单发消息都可测。
- 客户端可通过浏览器控制台、代码脚本或Postman接入。
HTTP POST 广播接口
- 通过
/push（WS/SSE通用）和/sse-push（SSE专用）接口，方便外部或页面直接向所有客户端广播消息。 - 支持自定义JSON结构，测试各种业务场景。
热更新 & 前端控制台
- 集成 livereload，前端页面静态资源变更自动刷新，开发体验极佳。
- 内置控制台页面，支持手动发送消息、实时日志显示、连接状态切换。
极简启动，零配置依赖
- 一行命令即可启动，Node.js环境即可，无需数据库、无复杂配置。
- 代码结构清晰，易扩展。
核心实现与技术解析
Express+原生WS/SSE实现
- 用 Express 搭建 HTTP 服务，负责静态页面、API路由。
- WebSocket 采用原生实现，管理客户端连接，支持消息广播。
- SSE 用长连接
res.write持续推送事件，自动处理断线重连。
热更新机制
- livereload 监听
public目录，页面变更自动刷新，无需手动F5。
前端控制台交互
- 页面内置三大功能区：
- POST广播区：输入JSON，点按钮直接广播给所有WS/SSE客户端。
- WebSocket区：模拟客户端收发消息，实时日志展示。
- SSE区：一键连接/断开SSE，手动推送消息，实时接收事件。
- 支持多浏览器、多窗口同时测试联调效果。
高度模块化
- WS与SSE功能独立封装，方便自定义扩展、集成其他协议。
- 广播与连接管理逻辑解耦，易维护。
典型应用场景
-
前端开发联调 无需等待后端接口完成，随时模拟推送场景，验证界面逻辑和异常处理。
-
后端开发模拟 快速验证推送接口兼容性，模拟多客户端连接、断线重连等复杂情况。
-
教学与演示 讲解实时通讯原理、协议区别，用工具可视化展示效果。
-
自动化测试 结合脚本自动发送消息，测试前端响应和性能。
使用注意事项
- 安全性：所有API默认无鉴权，仅供本地开发。生产环境务必加认证和访问控制。
- 端口冲突处理：默认8080端口，可在
src/main.js修改。 - 依赖环境：推荐Node.js 18+，Express 5.x以上。
- SSE兼容性：SSE不支持所有代理/旧浏览器，建议主流浏览器测试。
- 数据规范：建议所有推送消息使用标准JSON格式，便于调试和日志分析。
体验与扩展建议
- 快速体验：克隆仓库、
npm install、npm run dev，浏览器访问http://localhost:8080即可。 - 自定义：可自定义API路由、消息格式、客户端鉴权等，满足不同项目需求。
- 扩展协议：如需MQTT、WebRTC等协议，可参考当前模块化设计扩展。