WebSocket是HTML5下一种新的协议，它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的目的

在很多项目中，都要用到websocket，使得前端页面与后端页进行实时通信，例如，实时查询订单状态、设备状态实时显示到页面。本博文，分为前端页面代码和后端页面代码，在最后有源代码下载链接。前端使用用vue技术，后端使用springboot

一、后端代码

1、websocket代码

@Slf4j
@Component
@ServerEndpoint(value = "/websocket/order")
public class WebsocketProvider {
 
    /**
     * 连接事件，加入注解
     * @param session
     */
    @OnOpen
    public void onOpen(Session session) {
        String orderId = WebsocketUtil.getParam(WebsocketUtil.sessionKey, session);
        log.info("Websocket连接已打开，当前orderId为："+orderId);
        // 添加到session的映射关系中
        WebsocketUtil.addSession(orderId, session);
        //测试发送消息
        WebsocketUtil.sendMessage(orderId, AjaxResult.success("恭喜，已建立连接"));
    }
 
    /**
     * 连接事件，加入注解
     * 用户断开链接
     * @param session
     */
    @OnClose
    public void onClose(Session session) {
        String orderId = WebsocketUtil.getParam(WebsocketUtil.sessionKey, session);
        // 删除映射关系
        WebsocketUtil.removeSession(orderId);
    }
 
    /**
     * 当接收到用户上......