做笔记的网站源码dedecms5.7 财经网站
🚀 苍穹外卖项目中的 WebSocket 实战：实现来单与催单提醒功能
在现代 Web 应用中，实时通信成为提升用户体验的关键技术之一。WebSocket 作为一种在单个 TCP 连接上进行全双工通信的协议，被广泛应用于需要实时数据交换的场景，如在线聊天、实时通知等。本文将结合苍穹外卖项目，介绍如何使用 WebSocket 实现来单提醒与催单提醒功能。
📖 WebSocket 简介 WebSocket 是一种网络通信协议，允许在客户端和服务器之间建立持久的连接，双方可以随时发送数据。与传统的 HTTP 请求-响应模式不同，WebSocket 提供了更高效的通信方式，特别适用于需要实时交互的应用场景。
🛠️ 项目中 WebSocket 的应用场景 在苍穹外卖项目中，WebSocket 被用于实现以下功能：
- 来单提醒：当用户下单并支付成功后，系统通过 WebSocket 向商家管理端发送通知，提示有新订单。
-
- 催单提醒：用户在等待订单过程中，可以点击“催单”按钮，系统通过 WebSocket 向商家管理端发送催单通知。 这些功能依赖于客户端与服务器之间的实时通信，确保商家能够及时响应用户的需求。
🧱 实现步骤
- 引入WebSocket依赖
在pom.xml中添加以下依赖：
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
- 配置WebSocket
创建配置类WebSocketConfiguration，注册WebSocket组件：
@Configuration
public class WebSocketConfiguration { @Bean public ServerEndpointExporter serverEndpointExporter() { return new ServerEndpointExporter(); }
}
- 创建WebSocket服务端
实现WebSocketServer类，处理连接、消息收发逻辑：
@Component
@ServerEndpoint("/ws/{sid}")
public class WebSocketServer { private static Map<String, Session> sessionMap = new HashMap<>(); @OnOpen public void onOpen(Session session, @PathParam("sid") String sid) { sessionMap.put(sid, session); } @OnMessage public void onMessage(String message, @PathParam("sid") String sid) { // 处理接收到的消息 } @OnClose public void onClose(@PathParam("sid") String sid) { sessionMap.remove(sid); } public void sendToAllClient(String message) { for (Session session : sessionMap.values()) { try { session.getBasicRemote().sendText(message); } catch (Exception e) { e.printStackTrace(); } } }
}
- 业务逻辑中集成消息发送
- 订单支付成功提醒
public void paySuccess(String outTradeNo) { // 更新订单状态 Orders ordersDB = orderMapper.getByNumber(outTradeNo); Orders orders = Orders.builder() .id(ordersDB.getId()) .status(Orders.TO_BE_CONFIRMED) .payStatus(Orders.PAID) .checkoutTime(LocalDateTime.now()) .build(); orderMapper.update(orders); // 构造消息并广播 Map<String, Object> map = new HashMap<>(); map.put("type", 1); // 1=来单提醒 map.put("orderId", ordersDB.getId()); map.put("content", "订单号：" + outTradeNo); String json = JSON.toJSONString(map); webSocketServer.sendToAllClient(json);
}
- 用户催单提醒
public void reminder(Long id) { Orders orders = orderMapper.selectByOId(id); if (orders == null || orders.getStatus() != Orders.TO_BE_CONFIRMED) { throw new OrderBusinessException("订单状态不允许催单"); } Map<String, Object> map = new HashMap<>(); map.put("type", 2); // 2=催单提醒 map.put("orderId", id); map.put("content", "订单号：" + orders.getNumber()); String json = JSON.toJSONString(map); webSocketServer.sendToAllClient(json);
}
- 前端消息处理
建立WebSocket连接并解析通知：
// 初始化连接（clientId为前端用户标识）
var websocket = new WebSocket("ws://localhost:8080/ws/" + clientId); // 消息监听
websocket.onmessage = function(event) { var data = JSON.parse(event.data); if (data.type === 1) { alert("来单提醒：" + data.content); } else if (data.type === 2) { alert("催单提醒：" + data.content); }
};
🧪 测试与验证
测试流程：
- 启动后端服务与前端页面，建立WebSocket连接；
- 模拟用户下单并支付，验证商家端是否弹出“来单提醒”；
- 触发用户催单操作，验证是否收到“催单提醒”弹窗。
Nginx配置（如需代理）：
location /ws/ { proxy_pass http://localhost:8080; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "Upgrade";
}
🧠 总结
通过WebSocket技术，苍穹外卖实现了毫秒级实时通知，显著提升了商家订单处理效率与用户体验。WebSocket在实时通信场景（如在线聊天、数据监控）中具有广泛适用性，是现代Web开发的核心技术之一。