angular6.0+springboot+nginx连接socket协议

1.前端angular6.0

//先定义全局socket变量

    ws: WebSocket;//定义websocket

//socket连接
    connectWs() {

        let userno = "userno"           //userno  是当前登陆的用户
        this.ws = new WebSocket("ws://localhost:8888/pfss-back/passport/websocket/"+userno );
        let that  = this;                     //这一步一定要有 that是全局的对象  方法中的this只是指socket对象
        this.ws.onopen = function (event) {
                //socket 开启后执行,可以向后端传递信息
                that.ws.send('sonmething'); 
        }
        this.ws.onmessage = function (event) {
                //socket 获取后端传递到前端的信息

               let obj = JSON.parse(event);    //将后台返回的json字符串数据转为json对象
                that.dataSet = obj .dataList;
                
        }
        this.ws.onerror = function (event) {
                //socket error信息
                
                
        }
        this.ws.onclose = function (event) {
                //socket 关闭后执行
               
        }
    }
}

2.后台pom添加jar包依赖

         
       
            org.springframework.boot
            spring-boot-starter-websocket
            1.3.5.RELEASE
       

3.后台发送文本对象数据到前端

a.开启socket服务 WebSocketConfig.java

/**
*开启对socket支持

*/

@Configuration
public class WebSocketConfig {
    @Bean
    public ServerEndpointExporter serverEndpointExporter() {
        return new ServerEndpointExporter();
    }
}

b.连通客户端与前端通信  WebSocketServe.java

@ServerEndpoint("/websocket/{userno}")
@Component
public class WebSocketServe {

 

 

 

 

 

}
 

你可能感兴趣的:(angular6.0+springboot+nginx连接socket协议)