SpringBoot整合WebSocket案例
WebSocket简介
WebSocket协议是基于TCP的⼀种⽹络协议。它实现了浏览器与服务器全双⼯通信——允许服务器主动发送信息给客户端。
WebSocket是通过⼀个socket来实现双⼯异步通信的。直接使⽤WebSocket或者SockJS协议显得特别繁琐。使⽤它的⼦协议STOMP,它是⼀个更⾼级别的协议,STMOP协议使⽤⼀个基于帧格式来定义消息,与HTTP的Request和Response类似。
SpringBoot对使⽤WebSocket提供了⽀持,配置源码在org.springframework.boot.autoconfigure.websocket包下。
案例中使⽤到的maven依赖:
<!--springBoot其它依赖省略-->
<!-- webSocket -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
<!-- thymeleaf模板引擎 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!-- spring security -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-security</artifactId>
</dependency>
⼴播模式
⼴播式即服务端有消息时,会将信息发送给所有连接了当前endpoint的浏览器。
1、 写消息类
/**
* 浏览器向服务端发送的消息
*/
public class AricMessage {
private String name;
public String getName() {
return name;
}
}
/**
* 服务端向浏览器发送的消息
*/
public class AricResponse {
private String responseMessage;
public AricResponse(String responseMessage) {
}
public String getResponseMessage() {
return responseMessage;
}
}
2、配置websocket
/**
* 配置WebSocket
*/
@Configuration
//注解开启使⽤STOMP协议来传输基于代理(message broker)的消息,这时控制器⽀持使⽤@MessageMapping,就像使⽤@RequestMapping⼀样    @EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer{
@Override
public void registerStompEndpoints(StompEndpointRegistry registry) {//注册STOMP协议的节点(endpoint),并映射指定的url
//注册⼀个STOMP的endpoint,并指定使⽤SockJS协议
registry.addEndpoint("/endpointAric").withSockJS();
}
@Override
public void configureMessageBroker(MessageBrokerRegistry registry) {//配置消息代理(Message Broker)
//⼴播式应配置⼀个/topic消息代理
}
}
3、写Controller
/**
* webSocket控制器
*/
@Controller
public class WebSocketController {
@MessageMapping("/welcome") //当浏览器向服务端发送请求时,通过@MessageMapping映射/welcome这个地址,类似于@ResponseMapping        @SendTo("/topic/getResponse")//当服务器有消息时,会对订阅了@SendTo中的路径的浏览器发送消息
public AricResponse say(AricMessage message) {
try {
//睡眠1秒
Thread.sleep(1000);
} catch (InterruptedException e) {
e.printStackTrace();
}
return new AricResponse("welcome," + Name() + "!");
}
}
4、在src\main\resource\templates⽬录下编写webSocket.html,使⽤thymeleaf模板引擎
<!DOCTYPE html>
<html xmlns:th="">
<head>
<meta charset="UTF-8" />
<title>SpringBoot实现⼴播式WebSocket</title>
<script th:src="@{sockjs.min.js}"></script>
<script th:src="@{stomp.min.js}"></script>
<script th:src="@{jquery-1.11.3.min.js}"></script>
</head>
<body>
<noscript><h2 >抱歉,您的浏览器不⽀持改功能!</h2></noscript>
<div>
<div>
<button id="connect" onclick="connect();">连接</button>
<button id="disconnect" disabled="disabled" onclick="disconnect();">断开连接</button>
</div>
<div id="conversationDiv">
<label>请输⼊您的姓名</label><input type="text" id="name" />
<label>请输⼊您的姓名</label><input type="text" id="name" />
<button id="sendName" onclick="sendName();">发送</button>
<p id="response"></p>
</div>
</div>
</body>
<script type="text/javascript">
var stompClient = null;
function setConnected(connected){
thymeleaf用法
$("#response").html();
}
function connect(){
var socket = new SockJS('/endpointAric'); //连接SockJS的endpoint名称为"endpointWisely"
stompClient = Stomp.over(socket);//使⽤STMOP⼦协议的WebSocket客户端
setConnected(true);
console.log('Connected:' + frame);
//通过stompClient.subscribe订阅/topic/getResponse ⽬标(destination)发送的消息,这个是在控制器的@SentTo中定义的                stompClient.subscribe('/topic/getResponse',function(response){
showResponse(JSON.parse(response.body).responseMessage);
});
});
}
function disconnect(){
if(stompClient != null) {
stompClient.disconnect();
}
setConnected(false);
console.log("Disconnected");
}
function sendName(){
var name = $("#name").val();
//通过stompClient.send向/welcome ⽬标(destination)发送消息,这个是在控制器的@MessageMapping中定义的
stompClient.send("/welcome",{},JSON.stringify({'name':name}));
}
function showResponse(message){
var response = $("#response");
response.html(message);
}
</script>
</html>
5、配置viewController,为webSocket.html提供路径映射。
/**
* 配置viewController,为页⾯提供路径映射
*/
@Controller
public class WebMvcConfig extends WebMvcConfigurerAdapter{
/**
* 配置viewController,提供映射路径
*/
@Override
public void addViewControllers(ViewControllerRegistry registry) {
registry.addViewController("/webSocket").setViewName("/webSocket");
}
}
6、打开多个浏览器,访问地址,其中⼀个发送消息,其它浏览器能接收消息。
点对点式
点对点⽅式解决消息由谁发送,由谁接收的问题。
1. 使⽤到Spring Security,简单配置。
/
**
* Spring Security配置
*/
@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter{
@Override
protected void configure(HttpSecurity http) throws Exception {
http.authorizeRequests()
.antMatchers("/", "login").permitAll() //设置Spring Security对/和"/login"路径不拦截
.anyRequest().authenticated()
.
and().formLogin().loginPage("/login")//设置Spring Security的登陆页⾯访问路径为login
.defaultSuccessUrl("/chat") //登陆成功后转向/chat路径
.permitAll().and().logout()
.permitAll();
}
@Override
protected void configure(AuthenticationManagerBuilder auth) throws Exception {
//配置两个⽤户,⾓⾊是user
auth.inMemoryAuthentication()
.withUser("james").password("james").roles("user")
.and()
.
withUser("curry").password("curry").roles("user");
}
@Override
public void configure(WebSecurity web) throws Exception {
// 设置Spring Secutiry不拦截/resources/static/⽬录下的静态资源
web.ignoring().antMatchers("/resources/static/**");
}
}
2. 配置WebSocket
/**
* 配置WebSocket
*/
@Configuration
//注解开启使⽤STOMP协议来传输基于代理(message broker)的消息,这时控制器⽀持使⽤@MessageMapping,就像使⽤@RequestMapping⼀样
//注解开启使⽤STOMP协议来传输基于代理(message broker)的消息,这时控制器⽀持使⽤@MessageMapping,就像使⽤@RequestMapping⼀样@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer{
@Override
public void registerStompEndpoints(StompEndpointRegistry registry) {//注册STOMP协议的节点(endpoint),并映射指定的url
//注册⼀个STOMP的endpoint,并指定使⽤SockJS协议
registry.addEndpoint("/endpointAric").withSockJS();
/
/注册名为"endpointChat"的endpoint
registry.addEndpoint("/endpointChat").withSockJS();
}
@Override
public void configureMessageBroker(MessageBrokerRegistry registry) {//配置消息代理(Message Broker)
//⼴播式应配置⼀个/topic消息代理
//      ableSimpleBroker("/topic");
//点对点式应配置/queue和/topic消息代理
}
}
3. 编写Controller
/**
* webSocket控制器
*/
@Controller
public class WebSocketController {
//通过simpMessagingTemplate向浏览器发送消息
@Autowired
private SimpMessagingTemplate simpMessagingTemplate;
@MessageMapping("/chat")
//在springmvc中,可以直接在参数中获得principal,pinciple中包含当前⽤户信息
public void handleChat(Principal principal,String msg){
if ("james".Name())) {//硬编码,对⽤户姓名进⾏判断
//向⽤户发送消息,第⼀个参数:接收消息的⽤户,第⼆个参数:浏览器订阅地址,第三个参数:消息
"/queue/notifications", Name() + "-send: " + msg);
} else {
"/queue/notifications", Name() + "-send: " + msg);
}
}
@MessageMapping("/welcome") //当浏览器向服务端发送请求时,通过@MessageMapping映射/welc
ome这个地址,类似于@ResponseMapping    @SendTo("/topic/getResponse")//当服务器有消息时,会对订阅了@SendTo中的路径的浏览器发送消息
public AricResponse say(AricMessage message) {
try {
//睡眠3秒
Thread.sleep(3000);
} catch (InterruptedException e) {
e.printStackTrace();
}
return new AricResponse("welcome," + Name() + "!");
}
}
4. 在src\main\resource\templates⽬录下编写login.html和chat.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。