7【WebSocket

1

引入依赖

要在Spring 中使用WebSocket 功能，您需要在pom.xml 中引入依赖项。

登录后复制

依赖

组号

org.springframework.boot

/

组号

工件ID

Spring Boot启动器网络套接字

/

工件ID

/

依赖

1.2.3.4。

配置类

添加配置类，定义WebSocket全局配置信息

登录后复制

@作品

@EnableWebSocketMessageBroker

公共类WebSocketStompConfig 实现WebSocketMessageBrokerConfigurer {

/**

* 注册stomp端点

* @参数注册表

*/

@覆盖

公共无效registerStompEndpoints（StompEndpointRegistry注册表）{

##允许使用socketJs访问。您可以通过http://IP:PORT/xboot/ws连接到服务器WebSocket。

registry.addEndpoint(\’/tmax/ws\’).setAllowedOrigins(\’*\’).withSockJS();

}

/**

*信息代理设置

* @参数注册表

*/

@覆盖

公共无效configureMessageBroker（MessageBrokerRegistry注册表）{

## 订阅broker名称用户的点对点主题广播，即群发。

registry.enableSimpleBroker(\’/user\’,\’/topic\’);

## 全局使用的消息前缀（客户端）

registry.setApplicationDestinationPrefixes(\’/app\’);

## 用于点对点的前缀。无需默认/用户设置。

registry.setUserDestinationPrefix(\’/user\’);

}

}

1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.26.27.28.29.30.31.32.33.34。

我们来看看这两种方法。

1、registerStompEndpoints(StompEndpointRegistry registry)

注册stomp 端点。这添加了一个用于接收客户端连接的服务端点。

registry.addEndpoint(\’/tmax/ws\’) 表示添加/tmax/ws 端点，客户端可以通过此端点进行连接。 withSockJS()的作用是开启SockJS访问支持，可以通过http://IP:PORT/tmax/ws连接到服务器WebSocket。

2、configureMessageBroker(MessageBrokerRegistry registry)

配置信息代理。定义消息代理，设置消息连接请求的各种规范信息。

registry.enableSimpleBroker(\’/user\’,\’/topic\’) 表示客户端订阅地址的前缀信息，即客户端接收服务器消息的地址（有点混乱，但大概可以理解） )registry.setApplicationDestinationPrefixes(\’/app\’) 指向服务器接收地址的前缀。这是指客户端向服务器发送消息的地址前缀。

registry.setUserDestinationPrefix(\’/user\’) 指的是推送用户前缀。

对我来说，setApplicationDestinationPrefixes 和setUserDestinationPrefix 具有相反的效果并不困难。一个定义客户端接收的地址的前缀，另一个定义客户端发送的地址的前缀。

开始业务代码的编写

首先了解一下我们下面会用到的一些知识点。

1、MessageMapping

接收客户端请求的连接注释。 Spring使得封装WebSocket变得非常容易，提供了@MessageMapping注解，其功能与@RequestMapping类似，用于定义基本的消息请求。此功能还包括支持的URL 定义。外卡等

2、SimpMessagingTemplate

SimpMessagingTemplate 是Spring-WebSocket 中内置的消息传递工具，允许您向指定的客户端发送消息。

3、SendTo

例如，@SendTo 可以将消息广播到路径。如果客户端订阅了该路径的消息，则可以接收消息。

接下来我们看一下后台代码实现，HelloController。

登录后复制

/**

* @作者nicyoo

*/

@slf4j

@控制器

@Api(描述=\’你好接口\’)

@交易

公共类HelloController {

@Autowired

私有SimpMessagingTemplate 消息模板；

/**

* 跳转到hello.html界面

* @返回

*/

@RequestMapping(\’/你好\’)

公共字符串你好（）{

返回“你好”。

}

/**

* 接收消息并转发给客户端

* @参数消息

* @返回

* @抛出异常

*/

@MessageMapping(\’/顶部\’)

@SendTo(\’/主题/问候\’)

公共Stringgreeting（字符串消息）抛出异常{

System.out.println(\’接收中\’ + 消息);

System.out.println(\’连接成功。\’);

返回“AAA:”+消息；

}

/**

* 前方新闻

* @返回

*/

@ResponseBody

@RequestMapping(\’/hello/addMessage\’)

发表结果

目的

添加消息(){

messagesTemplate.convertAndSend(\’/topic/greetings\’, \’收到新系统消息\’);

返回一个新的ResultUtil

目的

().setSuccessMsg(\’添加成功\’);

}

}

1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.26.27.28.29.30.31.32.33.34.35.36.37.38.39.40.41.42.43.4 4.45.46.47.48.49.50 51.52。

hello.html 代码：

登录后复制

!doctypehtml

html

头

脚本

来源=

“http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js”

/

脚本

脚本

来源=

“https://cdn.bootcss.com/sockjs-client/1.3.0/sockjs.js”

/

脚本

脚本

来源=

“https://cdn.bootcss.com/stomp.js/2.3.3/stomp.js”

/

脚本

风格

。盒子{

宽度：

300像素；

浮动：

左边；

保证金：

0

20像素

0

20像素；

}

。盒子

分配，

。盒子

输入{

边框：

1 像素

坚硬的；

-魔族-

边界半径：

4个像素；

边界半径：

4个像素；

宽度：

100%；

衬垫：

0 像素；

保证金：

5个像素；

}

。盒子

分配{

边框颜色：

灰色的；

身高：

300像素；

溢出：

auto;

}

.box

input {

height:

30px;

}

h1 {

margin-left:

30px;

}

body {

background-color:

#F0F0F0;

font-family:

\”Arial\”;

}

</

style

>

</

head

>

<

body

lang=

\”en\”

>

<

h1

>Index

</

h1

>

<

div

id=

\”first\”

class=

\”box\”

>

<

div

>

</

div

>

<

input

autocomplete=

\”off\”

value=

\”Type here…\”

>

</

input

>

<

button

onclick=

\”connect()\”

>登陆客户端

</

button

>

<

button

onclick=

\”send()\”

>发送消息

</

button

>

</

div

>

<

script

>

var

stompClient

=

null;

var

sockjs_url

=

\’/tmax/ws\’;

function

connect() {

var

sockjs

=

new

SockJS(

sockjs_url);

stompClient

=

Stomp.

over(

sockjs);

stompClient.

connect({},

function(

frame) {

console.

log(

\’Connected: \’

+

frame);

stompClient.

subscribe(

\’/topic/greetings\’,

function(

greeting){

console.

log(

\”返回内容：\”

+

greeting.

body);

print(

\’服务器：\’,

greeting.

body);

});

});

}

function

send() {

if(

stompClient

==

null){

print(

\’系统提示：\’,

\’请先点击客户端登陆\’);

return

false;

}

print(

\’客户端：\’,

inp.

val());

stompClient.

send(

\”/app/top\”, {},

inp.

val());

inp.

val(

\’\’);

}

$(

\’#first input\’).

focus();

var

div

=

$(

\’#first div\’);

var

inp

=

$(

\’#first input\’);

var

print

=

function(

m,

p) {

p

= (

p

===

undefined)

?

\’\’ :

p;

div.

append(

$(

\”<code>\”).

text(

m

+

\’ \’

+

p));

div.

append(

$(

\”<br>\”));

div.

scrollTop(

div.

scrollTop()

+

10000);

};

</

script

>

</

body

>

</

html

>

1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.16.17.18.19.20.21.22.23.24.25.26.27.28.29.30.31.32.33.34.35.36.37.38.39.40.41.42.43.44.45.46.47.48.49.50.51.52.53.54.55.56.57.58.59.60.61.62.63.64.65.66.67.68.69.70.71.72.73.74.75.76.77.78.79.80.81.82.83.84.85.86.87.88.89.90.

操作流程：

点击“登录客户端”，输入框内输入内容，点击发送消息。

消息推送

关于消息的推送，借助 postman，调用 http://127.0.0.1:8888/hello/addMessage，实现后端推送至客户端。

额外补充，关于消息推送，往往会用到推送至指定用户，则：messagingTemplate.convertAndSendToUser(id,\”/queue/subscribe\”, \”您收到了新的消息\”); ，其中id为系统用户id。

详细可搜索 SimpMessagingTemplate 的一些用法。
#以上关于7【WebSocket 的相关内容来源网络仅供参考，相关信息请以官方公告为准！