Spring WebSocket教程(一)

学习背景

很久以前就知道WebSocket,但那时不论是浏览器还是开发技术对它的支持都还很少。但是,Spring4突然发布,让我眼前一亮,Spring4直接支持WebSocket。
对于Spring我还是很喜欢的,它让Java Web开发相当的有艺术感,这次支持的WebSocket又特别的和我的胃口,所以马上就去学习了。

前提

本文的内容,是建立在懂J2EE编程,使用过Spring,听说过WebSocket上的,如果前面的3点大家不太明白,可以先去补补知识。
WebSocket还不是很普遍,对服务器和浏览器都有要求,不过使用了下面的一些技术,可以将浏览器的要求降低,但是服务器容器的要求还是比较高的,具体哪些服务器容易支持了WebSocket可以百度一下。

第一步:配置Spring

如果你跟我一样采用的Maven,那么只需要将下面的几个依赖,加入到pom.xml文件就可以了:

     
     
  1. <properties>
  2. <spring.version>4.0.0.RELEASE </spring.version>
  3. </properties>
  4. <dependencies>
  5. <!–spring MVC–>
  6. <dependency>
  7. <groupId>org.springframework </groupId>
  8. <artifactId>spring-core </artifactId>
  9. <version>${spring.version}<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="11"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="12"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="13"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="14"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.springframework<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="15"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>spring-web<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="16"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>${spring.version} </version>
  10. </dependency>
  11. <dependency>
  12. <groupId>org.springframework </groupId>
  13. <artifactId>spring-webmvc </artifactId>
  14. <version>${spring.version}<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="23"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="24"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="25"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-comment">&lt;!-- jstl --&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="26"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="27"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>jstl<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="28"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>jstl<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="29"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>1.2<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="30"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="31"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="32"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-comment">&lt;!--spring测试框架--&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="33"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="34"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.springframework<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="35"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>spring-test<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="36"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>${spring.version} </version>
  15. <scope>test </scope>
  16. </dependency>
  17. <!–spring数据库操作库–>
  18. <dependency>
  19. <groupId>org.springframework </groupId>
  20. <artifactId>spring-jdbc </artifactId>
  21. <version>${spring.version}<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="45"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="46"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="47"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="48"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>junit<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="49"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>junit<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="50"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>4.8.2<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="51"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">scope</span>&gt;</span>test<span class="hljs-tag">&lt;/<span class="hljs-name">scope</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="52"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="53"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="54"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-comment">&lt;!--spring websocket库--&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="55"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="56"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.springframework<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="57"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>spring-websocket<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="58"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>${spring.version} </version>
  22. </dependency>
  23. <dependency>
  24. <groupId>org.springframework </groupId>
  25. <artifactId>spring-messaging </artifactId>
  26. <version>${spring.version} </version>
  27. </dependency>
  28. <!–jackson用于json操作–>
  29. <dependency>
  30. <groupId>com.fasterxml.jackson.core </groupId>
  31. <artifactId>jackson-databind </artifactId>
  32. <version>2.3.0 </version>
  33. </dependency>
  34. <dependency>
  35. <groupId>commons-fileupload </groupId>
  36. <artifactId>commons-fileupload </artifactId>
  37. <version>1.2.2 </version>
  38. </dependency>
  39. <dependency>
  40. <groupId>commons-io </groupId>
  41. <artifactId>commons-io </artifactId>
  42. <version>2.2 </version>
  43. </dependency>
  44. <!–使用阿里的连接池–>
  45. <dependency>
  46. <groupId>com.alibaba </groupId>
  47. <artifactId>druid </artifactId>
  48. <version>1.0.4 </version>
  49. </dependency>
  50. <!–mysql connector–>
  51. <dependency>
  52. <groupId>mysql </groupId>
  53. <artifactId>mysql-connector-java </artifactId>
  54. <version>5.1.29 </version>
  55. </dependency>
  56. </dependencies>

Spring的配置我就不一一贴出来了,可以去github看,地址我会贴在下面。

第二步:配置WebSocket

我采用的是使用Configurer类和 Annotation来进行WebSocket配置。
首先要创建一个类,继承WebSocketMessageBrokerConfigurer,并且在类上加上annotation:@Configuration和@EnableWebSocketMessageBroker。这样,Spring就会将这个类当做配置类,并且打开WebSocket。

     
     
  1. @Configuration
  2. @EnableWebSocketMessageBroker
  3. public class WebSocketConfig implements WebSocketMessageBrokerConfigurer{
  4. @Override
  5. public void registerStompEndpoints(StompEndpointRegistry registry) {
  6. //添加这个Endpoint,这样在网页中就可以通过websocket连接上服务了
  7. registry.addEndpoint( “/coordination”).withSockJS();
  8. }
  9. @Override
  10. public void configureMessageBroker(MessageBrokerRegistry config) {
  11. System.out.println( “服务器启动成功”);
  12. //这里设置的simple broker是指可以订阅的地址,也就是服务器可以发送的地址
  13. /**
  14. * userChat 用于用户聊天
  15. */
  16. config.enableSimpleBroker( “/userChat”);
  17. config.setApplicationDestinationPrefixes( “/app”);
  18. }
  19. @Override
  20. public void configureClientInboundChannel(ChannelRegistration channelRegistration) {
  21. }
  22. @Override
  23. public void configureClientOutboundChannel(ChannelRegistration channelRegistration) {
  24. }
  25. }

可以看到,在类中必须实现这四个方法。暂且只需要用到前两个,所以我来介绍一下,前两个方法中代码的意义。
第一个方法,是registerStompEndpoints,大意就是注册消息连接点(我自己的理解),所以我们进行了连接点的注册:
registry.addEndpoint("/coordination").withSockJS();
     
     
我们加了一个叫coordination的连接点,在网页上我们就可以通过这个链接来和服务器的WebSocket连接了。但是后面还有一句withSockJs,这是什么呢?SockJs是一个WebSocket的通信js库,Spring对这个js库进行了后台的自动支持,也就是说,我们如果使用SockJs,那么我们就不需要对后台进行更多的配置,只需要加上这一句就可以了。
第二个方法,configureMessageBroker,大意是设置消息代理,也就是页面上用js来订阅的地址,也是我们服务器往WebSocket端接收js端发送消息的地址。

     
     
  1. config.enableSimpleBroker( “/userChat”);
  2. config.setApplicationDestinationPrefixes( “/app”);
首先,定义了一个连接点叫userChat,从名字可以看的出,最后我会做一个聊天的例子。然后,设置了一个应用程序访问地址的前缀,目的估计是为了和其他的普通请求区分开吧。也就是说,网页上要发送消息到服务器上的地址是/app/userChat。
说了这么多地址,估计大家都绕晕了,因为项目的整个雏形还没有出来,所以很混乱。所以接下来就配置js端。

第三步:配置Browser端

说了这么多地址,估计大家都绕晕了,因为项目的整个雏形还没有出来,所以很混乱。所以接下来就配置js端。
首先我们要使用两个js库,一个是之前说过的SockJs,一个是stomp,这是一种通信协议,暂时不介绍它,只需要知道是一种更方便更安全的发送消息的库就行了。
需要连接服务端的WebSocket:

     
     
  1. var socket = new SockJS( ‘/coordination’);
  2. var stompClient = Stomp.over(socket);
  3. stompClient.connect( , , function (frame) {});
没错,就只需要两句话。有了这三句话,我们就已经可以连接上了服务器。
使用SockJs还有一个好处,那就是对浏览器进行兼容,如果是IE11以下等对WebSocket支持不好的浏览器,SockJs会自动的将WebSocket降级到轮询(这个不知道的可以去百度一下),之前也说了,Spring对SockJs也进行了支持,也就是说,如果之前加了withSockJs那句代码,那么服务器也会自动的降级为轮询。(怎么样,是不是很兴奋,Spring这个特性太让人舒服了)
但是连接上了服务器,却没有进行任何的操作,所以下一步,我们要在服务器端撰写响应和数据处理代码,在Browser端撰写消息发送和接收代码。当然,这是下一篇的内容了。

结语

这是我的毕业设计,我的毕业设计是一个在线协同备课系统,其中包含了聊天这个小功能,所以使用它来讲解一下Spring WebSocket的使用。
我将代码放到了 github上,有兴趣的朋友可以去看看代码,因为涉及到了很多协同操作,所以代码比较复杂,如果仅仅想了解Spring WebSocket的朋友,还是等我的下一篇文章吧。 大笑
github地址:https://github.com/xjyaikj/OnlinePreparation
        </div>
            </div>

学习背景

很久以前就知道WebSocket,但那时不论是浏览器还是开发技术对它的支持都还很少。但是,Spring4突然发布,让我眼前一亮,Spring4直接支持WebSocket。
对于Spring我还是很喜欢的,它让Java Web开发相当的有艺术感,这次支持的WebSocket又特别的和我的胃口,所以马上就去学习了。

前提

本文的内容,是建立在懂J2EE编程,使用过Spring,听说过WebSocket上的,如果前面的3点大家不太明白,可以先去补补知识。
WebSocket还不是很普遍,对服务器和浏览器都有要求,不过使用了下面的一些技术,可以将浏览器的要求降低,但是服务器容器的要求还是比较高的,具体哪些服务器容易支持了WebSocket可以百度一下。

第一步:配置Spring

如果你跟我一样采用的Maven,那么只需要将下面的几个依赖,加入到pom.xml文件就可以了:

   
   
  1. <properties>
  2. <spring.version>4.0.0.RELEASE </spring.version>
  3. </properties>
  4. <dependencies>
  5. <!–spring MVC–>
  6. <dependency>
  7. <groupId>org.springframework </groupId>
  8. <artifactId>spring-core </artifactId>
  9. <version>${spring.version}<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="11"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="12"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="13"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="14"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.springframework<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="15"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>spring-web<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="16"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>${spring.version} </version>
  10. </dependency>
  11. <dependency>
  12. <groupId>org.springframework </groupId>
  13. <artifactId>spring-webmvc </artifactId>
  14. <version>${spring.version}<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="23"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="24"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="25"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-comment">&lt;!-- jstl --&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="26"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="27"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>jstl<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="28"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>jstl<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="29"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>1.2<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="30"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="31"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="32"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-comment">&lt;!--spring测试框架--&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="33"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="34"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.springframework<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="35"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>spring-test<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="36"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>${spring.version} </version>
  15. <scope>test </scope>
  16. </dependency>
  17. <!–spring数据库操作库–>
  18. <dependency>
  19. <groupId>org.springframework </groupId>
  20. <artifactId>spring-jdbc </artifactId>
  21. <version>${spring.version}<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="45"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="46"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="47"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="48"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>junit<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="49"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>junit<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="50"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>4.8.2<span class="hljs-tag">&lt;/<span class="hljs-name">version</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="51"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">scope</span>&gt;</span>test<span class="hljs-tag">&lt;/<span class="hljs-name">scope</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="52"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;/<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="53"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> </div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="54"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-comment">&lt;!--spring websocket库--&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="55"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">dependency</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="56"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">groupId</span>&gt;</span>org.springframework<span class="hljs-tag">&lt;/<span class="hljs-name">groupId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="57"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">artifactId</span>&gt;</span>spring-websocket<span class="hljs-tag">&lt;/<span class="hljs-name">artifactId</span>&gt;</span></div></div></li><li><div class="hljs-ln-numbers"><div class="hljs-ln-line hljs-ln-n" data-line-number="58"></div></div><div class="hljs-ln-code"><div class="hljs-ln-line"> <span class="hljs-tag">&lt;<span class="hljs-name">version</span>&gt;</span>${spring.version} </version>
  22. </dependency>
  23. <dependency>
  24. <groupId>org.springframework </groupId>
  25. <artifactId>spring-messaging </artifactId>
  26. <version>${spring.version} </version>
  27. </dependency>
  28. <!–jackson用于json操作–>
  29. <dependency>
  30. <groupId>com.fasterxml.jackson.core </groupId>
  31. <artifactId>jackson-databind </artifactId>
  32. <version>2.3.0 </version>
  33. </dependency>
  34. <dependency>
  35. <groupId>commons-fileupload </groupId>
  36. <artifactId>commons-fileupload </artifactId>
  37. <version>1.2.2 </version>
  38. </dependency>
  39. <dependency>
  40. <groupId>commons-io </groupId>
  41. <artifactId>commons-io </artifactId>
  42. <version>2.2 </version>
  43. </dependency>
  44. <!–使用阿里的连接池–>
  45. <dependency>
  46. <groupId>com.alibaba </groupId>
  47. <artifactId>druid </artifactId>
  48. <version>1.0.4 </version>
  49. </dependency>
  50. <!–mysql connector–>
  51. <dependency>
  52. <groupId>mysql </groupId>
  53. <artifactId>mysql-connector-java </artifactId>
  54. <version>5.1.29 </version>
  55. </dependency>
  56. </dependencies>

Spring的配置我就不一一贴出来了,可以去github看,地址我会贴在下面。

第二步:配置WebSocket

我采用的是使用Configurer类和 Annotation来进行WebSocket配置。
首先要创建一个类,继承WebSocketMessageBrokerConfigurer,并且在类上加上annotation:@Configuration和@EnableWebSocketMessageBroker。这样,Spring就会将这个类当做配置类,并且打开WebSocket。

   
   
  1. @Configuration
  2. @EnableWebSocketMessageBroker
  3. public class WebSocketConfig implements WebSocketMessageBrokerConfigurer{
  4. @Override
  5. public void registerStompEndpoints(StompEndpointRegistry registry) {
  6. //添加这个Endpoint,这样在网页中就可以通过websocket连接上服务了
  7. registry.addEndpoint( “/coordination”).withSockJS();
  8. }
  9. @Override
  10. public void configureMessageBroker(MessageBrokerRegistry config) {
  11. System.out.println( “服务器启动成功”);
  12. //这里设置的simple broker是指可以订阅的地址,也就是服务器可以发送的地址
  13. /**
  14. * userChat 用于用户聊天
  15. */
  16. config.enableSimpleBroker( “/userChat”);
  17. config.setApplicationDestinationPrefixes( “/app”);
  18. }
  19. @Override
  20. public void configureClientInboundChannel(ChannelRegistration channelRegistration) {
  21. }
  22. @Override
  23. public void configureClientOutboundChannel(ChannelRegistration channelRegistration) {
  24. }
  25. }

可以看到,在类中必须实现这四个方法。暂且只需要用到前两个,所以我来介绍一下,前两个方法中代码的意义。
第一个方法,是registerStompEndpoints,大意就是注册消息连接点(我自己的理解),所以我们进行了连接点的注册:
registry.addEndpoint("/coordination").withSockJS();
   
   
我们加了一个叫coordination的连接点,在网页上我们就可以通过这个链接来和服务器的WebSocket连接了。但是后面还有一句withSockJs,这是什么呢?SockJs是一个WebSocket的通信js库,Spring对这个js库进行了后台的自动支持,也就是说,我们如果使用SockJs,那么我们就不需要对后台进行更多的配置,只需要加上这一句就可以了。
第二个方法,configureMessageBroker,大意是设置消息代理,也就是页面上用js来订阅的地址,也是我们服务器往WebSocket端接收js端发送消息的地址。

   
   
  1. config.enableSimpleBroker( “/userChat”);
  2. config.setApplicationDestinationPrefixes( “/app”);
首先,定义了一个连接点叫userChat,从名字可以看的出,最后我会做一个聊天的例子。然后,设置了一个应用程序访问地址的前缀,目的估计是为了和其他的普通请求区分开吧。也就是说,网页上要发送消息到服务器上的地址是/app/userChat。
说了这么多地址,估计大家都绕晕了,因为项目的整个雏形还没有出来,所以很混乱。所以接下来就配置js端。

第三步:配置Browser端

说了这么多地址,估计大家都绕晕了,因为项目的整个雏形还没有出来,所以很混乱。所以接下来就配置js端。
首先我们要使用两个js库,一个是之前说过的SockJs,一个是stomp,这是一种通信协议,暂时不介绍它,只需要知道是一种更方便更安全的发送消息的库就行了。
需要连接服务端的WebSocket:

   
   
  1. var socket = new SockJS( ‘/coordination’);
  2. var stompClient = Stomp.over(socket);
  3. stompClient.connect( , , function (frame) {});
没错,就只需要两句话。有了这三句话,我们就已经可以连接上了服务器。
使用SockJs还有一个好处,那就是对浏览器进行兼容,如果是IE11以下等对WebSocket支持不好的浏览器,SockJs会自动的将WebSocket降级到轮询(这个不知道的可以去百度一下),之前也说了,Spring对SockJs也进行了支持,也就是说,如果之前加了withSockJs那句代码,那么服务器也会自动的降级为轮询。(怎么样,是不是很兴奋,Spring这个特性太让人舒服了)
但是连接上了服务器,却没有进行任何的操作,所以下一步,我们要在服务器端撰写响应和数据处理代码,在Browser端撰写消息发送和接收代码。当然,这是下一篇的内容了。

结语

这是我的毕业设计,我的毕业设计是一个在线协同备课系统,其中包含了聊天这个小功能,所以使用它来讲解一下Spring WebSocket的使用。
我将代码放到了 github上,有兴趣的朋友可以去看看代码,因为涉及到了很多协同操作,所以代码比较复杂,如果仅仅想了解Spring WebSocket的朋友,还是等我的下一篇文章吧。 大笑
github地址:https://github.com/xjyaikj/OnlinePreparation
        </div>
            </div>

猜你喜欢

转载自blog.csdn.net/qq_34531925/article/details/80867332