Spring Boot中使用WebSocket [第二部分]

最新推荐文章于 2024-05-20 09:47:48 发布
最新推荐文章于 2024-05-20 09:47:48 发布
阅读量1.1k 收藏
点赞数
分类专栏： Java html/css JavaScript 文章标签： websocket stomp
原文链接：https://www.zifangsky.cn/1359.html
版权
Java 同时被 3 个专栏收录
81 篇文章 0 订阅
订阅专栏
html/css
10 篇文章 0 订阅
订阅专栏
JavaScript
10 篇文章 0 订阅
订阅专栏

向指定用户发送WebSocket消息并处理对方不在线的情况

  2018/11/20 |  Spring |  admin|  暂无评论 |  4049 views

在上一篇文章（https://www.zifangsky.cn/1355.html）中我介绍了在Spring项目中使用WebSocket的几种实现方式。但是，上篇文章中只介绍了服务端采用广播模式给所有客户端发送消息，然而我们有时需要服务端给指定用户的客户端发送消息（比如：发送Web通知、实时打印用户任务的日志、两个用户点对点聊天等）。

关于服务端如何给指定用户的客户端发送消息，一般可以通过以下三种方案来实现：

  • 方案一：WebSocket使用“Java提供的@ServerEndpoint注解”实现或者使用“Spring低层级API”实现，在建立连接时从HttpSession中获取用户登录后的用户名，然后把“用户名+该WebSocket连接”存储到ConcurrentHashMap。给指定用户发送消息，只需要根据接收者的用户名获取对方已经建立的WebSocket连接，接着给他发送消息即可。

  • 方案二：在页面的监听路径前面动态添加当前登录的“用户ID/用户名”，这样给指定用户发送消息，只需要发送广播消息到监听了前面那个路径的客户端即可。

  • 方案三：这种方案类似于方案一。使用Spring的高级API实现WebSocket，然后自定义HandshakeHandler类并重写determineUser方法，其目的是为了在建立连接时使用用户登录后的用户名作为此次WebSocket的凭证，最后我们就可以使用messagingTemplate.convertAndSendToUser方法给指定用户发送消息了。

注：本篇文章的完整源码可以参考：https://github.com/zifangsky/WebSocketDemo

使用SimpMessagingTemplate发送消息

使用org.springframework.messaging.simp.SimpMessagingTemplate类可以在服务端的任意地方给客户端发送消息。此外，在我们配置Spring支持STOMP后SimpMessagingTemplate类就会被自动装配到Spring的上下文中，因此我们只需要在想要使用的地方使用@Autowired注解注入SimpMessagingTemplate即可使用。

需要说明的是，SimpMessagingTemplate类有两个重要的方法，它们分别是：

  • public void convertAndSend(D destination, Object payload)：给监听了路径destination的所有客户端发送消息payload

  • public void convertAndSendToUser(String user, String destination, Object payload)：给监听了路径destination的用户user发送消息payload

一个简单示例：

 

 

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

package cn.zifangsky.stompwebsocket.controller;

 

import cn.zifangsky.stompwebsocket.model.websocket.Greeting;

import cn.zifangsky.stompwebsocket.model.websocket.HelloMessage;

import cn.zifangsky.stompwebsocket.service.RedisService;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.messaging.simp.SimpMessagingTemplate;

import org.springframework.messaging.simp.user.SimpUserRegistry;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.PostMapping;

import org.springframework.web.bind.annotation.RequestBody;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.ResponseBody;

 

import javax.annotation.Resource;

 

/**

* 测试{@link org.springframework.messaging.simp.SimpMessagingTemplate}类的基本用法

* @author zifangsky

* @date 2018/10/10

* @since 1.0.0

*/

@Controller

@RequestMapping(("/wsTemplate"))

public class MessageTemplateController {

    private final Logger logger = LoggerFactory.getLogger(getClass());

 

    @Autowired

    private SimpMessagingTemplate messagingTemplate;

 

    @Autowired

    private SimpUserRegistry userRegistry;

 

    @Resource(name = "redisServiceImpl")

    private RedisService redisService;

 

    /**

     * 简单测试SimpMessagingTemplate的用法

     */

    @PostMapping("/greeting")

    @ResponseBody

    public String greeting(@RequestBody Greeting greeting) {

        this.messagingTemplate.convertAndSend("/topic/greeting", new HelloMessage("Hello," + greeting.getName() + "!"));

 

        return "ok";

    }

 

}

很显然，这里发送的地址是上篇文章中最后那个示例监听的地址，在客户端页面建立连接后，我们使用Postman请求一下上面这个方法，效果如下：

然后我们可以发现页面中也收到消息了：

向指定用户发送WebSocket消息并处理对方不在线的情况

给指定用户发送消息：

  • 如果接收者在线，则直接发送消息；
  • 否则将消息存储到redis，等用户上线后主动拉取未读消息。

（1）自定义HandshakeInterceptor，用于禁止未登录用户连接WebSocket：

 

 

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

package cn.zifangsky.stompwebsocket.interceptor.websocket;

 

import cn.zifangsky.stompwebsocket.common.Constants;

import cn.zifangsky.stompwebsocket.common.SpringContextUtils;

import cn.zifangsky.stompwebsocket.model.User;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.http.server.ServerHttpRequest;

import org.springframework.http.server.ServerHttpResponse;

import org.springframework.stereotype.Component;

import org.springframework.web.socket.WebSocketHandler;

import org.springframework.web.socket.server.HandshakeInterceptor;

 

import javax.servlet.http.HttpSession;

import java.text.MessageFormat;

import java.util.Map;

 

/**

* 自定义{@link org.springframework.web.socket.server.HandshakeInterceptor}，实现“需要登录才允许连接WebSocket”

*

* @author zifangsky

* @date 2018/10/11

* @since 1.0.0

*/

@Component

public class AuthHandshakeInterceptor implements HandshakeInterceptor {

    private final Logger logger = LoggerFactory.getLogger(getClass());

 

    @Override

    public boolean beforeHandshake(ServerHttpRequest serverHttpRequest, ServerHttpResponse serverHttpResponse, WebSocketHandler webSocketHandler, Map<String, Object> map) throws Exception {

        HttpSession session = SpringContextUtils.getSession();

        User loginUser = (User) session.getAttribute(Constants.SESSION_USER);

 

        if(loginUser != null){

            logger.debug(MessageFormat.format("用户{0}请求建立WebSocket连接", loginUser.getUsername()));

            return true;

        }else{

            logger.error("未登录系统，禁止连接WebSocket");

            return false;

        }

 

    }

 

    @Override

    public void afterHandshake(ServerHttpRequest serverHttpRequest, ServerHttpResponse serverHttpResponse, WebSocketHandler webSocketHandler, Exception e) {

 

    }

 

}

 

（2）自定义HandshakeHandler，用于在建立WebSocket的时候使用自定义的Principal：

 

 

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

package cn.zifangsky.stompwebsocket.interceptor.websocket;

 

import cn.zifangsky.stompwebsocket.common.Constants;

import cn.zifangsky.stompwebsocket.common.SpringContextUtils;

import cn.zifangsky.stompwebsocket.model.User;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.http.server.ServerHttpRequest;

import org.springframework.stereotype.Component;

import org.springframework.web.socket.WebSocketHandler;

import org.springframework.web.socket.server.support.DefaultHandshakeHandler;

 

import javax.servlet.http.HttpSession;

import java.security.Principal;

import java.text.MessageFormat;

import java.util.Map;

 

/**

* 自定义{@link org.springframework.web.socket.server.support.DefaultHandshakeHandler}，实现“生成自定义的{@link java.security.Principal}”

*

* @author zifangsky

* @date 2018/10/11

* @since 1.0.0

*/

@Component

public class MyHandshakeHandler extends DefaultHandshakeHandler{

    private final Logger logger = LoggerFactory.getLogger(getClass());

 

    @Override

    protected Principal determineUser(ServerHttpRequest request, WebSocketHandler wsHandler, Map<String, Object> attributes) {

        HttpSession session = SpringContextUtils.getSession();

        User loginUser = (User) session.getAttribute(Constants.SESSION_USER);

 

        if(loginUser != null){

            logger.debug(MessageFormat.format("WebSocket连接开始创建Principal，用户：{0}", loginUser.getUsername()));

            return new MyPrincipal(loginUser.getUsername());

        }else{

            logger.error("未登录系统，禁止连接WebSocket");

            return null;

        }

    }

 

}

相应地，这里的MyPrincipal继承了java.security.Principal类：

 

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

package cn.zifangsky.stompwebsocket.interceptor.websocket;

 

import java.security.Principal;

 

/**

* 自定义{@link java.security.Principal}

*

* @author zifangsky

* @date 2018/10/11

* @since 1.0.0

*/

public class MyPrincipal implements Principal {

    private String loginName;

 

    public MyPrincipal(String loginName) {

        this.loginName = loginName;

    }

 

    @Override

    public String getName() {

        return loginName;

    }

}

 

（3）自定义ChannelInterceptor，用于在用户断开连接的时候记录日志：

 

 

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

package cn.zifangsky.stompwebsocket.interceptor.websocket;

 

import org.apache.commons.lang3.StringUtils;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.messaging.Message;

import org.springframework.messaging.MessageChannel;

import org.springframework.messaging.simp.stomp.StompCommand;

import org.springframework.messaging.simp.stomp.StompHeaderAccessor;

import org.springframework.messaging.support.ChannelInterceptor;

import org.springframework.stereotype.Component;

 

import java.security.Principal;

import java.text.MessageFormat;

 

/**

* 自定义{@link org.springframework.messaging.support.ChannelInterceptor}，实现断开连接的处理

*

* @author zifangsky

* @date 2018/10/10

* @since 1.0.0

*/

@Component

public class MyChannelInterceptor implements ChannelInterceptor{

    private final Logger logger = LoggerFactory.getLogger(getClass());

 

    @Override

    public void afterSendCompletion(Message<?> message, MessageChannel channel, boolean sent, Exception ex) {

        StompHeaderAccessor accessor = StompHeaderAccessor.wrap(message);

        StompCommand command = accessor.getCommand();

 

        //用户已经断开连接

        if(StompCommand.DISCONNECT.equals(command)){

            String user = "";

            Principal principal = accessor.getUser();

            if(principal != null && StringUtils.isNoneBlank(principal.getName())){

                user = principal.getName();

            }else{

                user = accessor.getSessionId();

            }

 

            logger.debug(MessageFormat.format("用户{0}的WebSocket连接已经断开", user));

        }

    }

 

}

 

（4）WebSocket相关的完整配置：

 

 

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

package cn.zifangsky.stompwebsocket.config;

 

import cn.zifangsky.stompwebsocket.interceptor.websocket.AuthHandshakeInterceptor;

import cn.zifangsky.stompwebsocket.interceptor.websocket.MyChannelInterceptor;

import cn.zifangsky.stompwebsocket.interceptor.websocket.MyHandshakeHandler;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.context.annotation.Configuration;

import org.springframework.messaging.simp.config.ChannelRegistration;

import org.springframework.messaging.simp.config.MessageBrokerRegistry;

import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;

import org.springframework.web.socket.config.annotation.StompEndpointRegistry;

import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;

 

/**

* WebSocket相关配置

*

* @author zifangsky

* @date 2018/9/30

* @since 1.0.0

*/

@Configuration

@EnableWebSocketMessageBroker

public class WebSocketConfig implements WebSocketMessageBrokerConfigurer{

    @Autowired

    private AuthHandshakeInterceptor authHandshakeInterceptor;

 

    @Autowired

    private MyHandshakeHandler myHandshakeHandler;

 

    @Autowired

    private MyChannelInterceptor myChannelInterceptor;

 

    @Override

    public void registerStompEndpoints(StompEndpointRegistry registry) {

        registry.addEndpoint("/stomp-websocket").withSockJS();

 

        registry.addEndpoint("/chat-websocket")

                .addInterceptors(authHandshakeInterceptor)

                .setHandshakeHandler(myHandshakeHandler)

                .withSockJS();

    }

 

    @Override

    public void configureMessageBroker(MessageBrokerRegistry registry) {

        //客户端需要把消息发送到/message/xxx地址

        registry.setApplicationDestinationPrefixes("/message");

        //服务端广播消息的路径前缀，客户端需要相应订阅/topic/yyy这个地址的消息

        registry.enableSimpleBroker("/topic");

    }

 

    @Override

    public void configureClientInboundChannel(ChannelRegistration registration) {

        registration.interceptors(myChannelInterceptor);

    }

 

}

 

（5）Controller中的消息处理如下：

 

 

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

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

package cn.zifangsky.stompwebsocket.controller;

 

import cn.zifangsky.stompwebsocket.common.Constants;

import cn.zifangsky.stompwebsocket.common.SpringContextUtils;

import cn.zifangsky.stompwebsocket.enums.ExpireEnum;

import cn.zifangsky.stompwebsocket.model.User;

import cn.zifangsky.stompwebsocket.model.websocket.Greeting;

import cn.zifangsky.stompwebsocket.model.websocket.HelloMessage;

import cn.zifangsky.stompwebsocket.service.RedisService;

import cn.zifangsky.stompwebsocket.utils.JsonUtils;

import org.apache.commons.lang3.StringUtils;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.messaging.simp.SimpMessagingTemplate;

import org.springframework.messaging.simp.user.SimpUser;

import org.springframework.messaging.simp.user.SimpUserRegistry;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.PostMapping;

import org.springframework.web.bind.annotation.RequestBody;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.ResponseBody;

 

import javax.annotation.Resource;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpSession;

import java.text.MessageFormat;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

 

/**

* 测试{@link org.springframework.messaging.simp.SimpMessagingTemplate}类的基本用法

* @author zifangsky

* @date 2018/10/10

* @since 1.0.0

*/

@Controller

@RequestMapping(("/wsTemplate"))

public class MessageTemplateController {

    private final Logger logger = LoggerFactory.getLogger(getClass());

 

    @Autowired

    private SimpMessagingTemplate messagingTemplate;

 

    @Autowired

    private SimpUserRegistry userRegistry;

 

    @Resource(name = "redisServiceImpl")

    private RedisService redisService;

 

    /**

     * 简单测试SimpMessagingTemplate的用法

     */

    @PostMapping("/greeting")

    @ResponseBody

    public String greeting(@RequestBody Greeting greeting) {

        this.messagingTemplate.convertAndSend("/topic/greeting", new HelloMessage("Hello," + greeting.getName() + "!"));

 

        return "ok";

    }

 

    /**

     * 给指定用户发送WebSocket消息

     */

    @PostMapping("/sendToUser")

    @ResponseBody

    public String chat(HttpServletRequest request) {

        //消息接收者

        String receiver = request.getParameter("receiver");

        //消息内容

        String msg = request.getParameter("msg");

        HttpSession session = SpringContextUtils.getSession();

        User loginUser = (User) session.getAttribute(Constants.SESSION_USER);

 

        HelloMessage resultData = new HelloMessage(MessageFormat.format("{0} say: {1}", loginUser.getUsername(), msg));

        this.sendToUser(loginUser.getUsername(), receiver, "/topic/reply", JsonUtils.toJson(resultData));

 

        return "ok";

    }

 

    /**

     * 给指定用户发送消息，并处理接收者不在线的情况

     * @param sender 消息发送者

     * @param receiver 消息接收者

     * @param destination 目的地

     * @param payload 消息正文

     */

    private void sendToUser(String sender, String receiver, String destination, String payload){

        SimpUser simpUser = userRegistry.getUser(receiver);

 

        //如果接收者存在，则发送消息

        if(simpUser != null && StringUtils.isNoneBlank(simpUser.getName())){

            this.messagingTemplate.convertAndSendToUser(receiver, destination, payload);

        }

        //否则将消息存储到redis，等用户上线后主动拉取未读消息

        else{

            //存储消息的Redis列表名

            String listKey = Constants.REDIS_UNREAD_MSG_PREFIX + receiver + ":" + destination;

            logger.info(MessageFormat.format("消息接收者{0}还未建立WebSocket连接，{1}发送的消息【{2}】将被存储到Redis的【{3}】列表中", receiver, sender, payload, listKey));

 

            //存储消息到Redis中

            redisService.addToListRight(listKey, ExpireEnum.UNREAD_MSG, payload);

        }

 

    }

 

 

    /**

     * 拉取指定监听路径的未读的WebSocket消息

     * @param destination 指定监听路径

     * @return java.util.Map<java.lang.String,java.lang.Object>

     */

    @PostMapping("/pullUnreadMessage")

    @ResponseBody

    public Map<String, Object> pullUnreadMessage(String destination){

        Map<String, Object> result = new HashMap<>();

        try {

            HttpSession session = SpringContextUtils.getSession();

            //当前登录用户

            User loginUser = (User) session.getAttribute(Constants.SESSION_USER);

 

            //存储消息的Redis列表名

            String listKey = Constants.REDIS_UNREAD_MSG_PREFIX + loginUser.getUsername() + ":" + destination;

            //从Redis中拉取所有未读消息

            List<Object> messageList = redisService.rangeList(listKey, 0, -1);

 

            result.put("code", "200");

            if(messageList !=null && messageList.size() > 0){

                //删除Redis中的这个未读消息列表

                redisService.delete(listKey);

                //将数据添加到返回集，供前台页面展示

                result.put("result", messageList);

            }

        }catch (Exception e){

            result.put("code", "500");

            result.put("msg", e.getMessage());

        }

 

        return result;

    }

 

}

注：这里对应的几个Redis操作的方法如下：

 

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

@Override

public boolean delete(String key) {

    return redisTemplate.delete(key);

}

 

@Override

public void addToListLeft(String listKey, ExpireEnum expireEnum, Object... values) {

    //绑定操作

    BoundListOperations<String, Object> boundValueOperations = redisTemplate.boundListOps(listKey);

    //插入数据

    boundValueOperations.leftPushAll(values);

    //设置过期时间

    boundValueOperations.expire(expireEnum.getTime(),expireEnum.getTimeUnit());

}

 

@Override

public void addToListRight(String listKey, ExpireEnum expireEnum, Object... values) {

    //绑定操作

    BoundListOperations<String, Object> boundValueOperations = redisTemplate.boundListOps(listKey);

    //插入数据

    boundValueOperations.rightPushAll(values);

    //设置过期时间

    boundValueOperations.expire(expireEnum.getTime(),expireEnum.getTimeUnit());

}

 

@Override

public List<Object> rangeList(String listKey, long start, long end) {

    //绑定操作

    BoundListOperations<String, Object> boundValueOperations = redisTemplate.boundListOps(listKey);

    //查询数据

    return boundValueOperations.range(start, end);

}

 

（6）示例页面：

 

 

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

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta content="text/html;charset=UTF-8"/>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>

    <meta name="viewport" content="width=device-width, initial-scale=1"/>

    <title>Chat With STOMP Message</title>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/sockjs-client/1.1.4/sockjs.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>

    <script th:src="@{/layui/layui.js}"></script>

    <script th:src="@{/layui/lay/modules/layer.js}"></script>

    <link th:href="@{/layui/css/layui.css}" rel="stylesheet">

    <link th:href="@{/layui/css/modules/layer/default/layer.css}" rel="stylesheet">

    <link th:href="@{/css/style.css}" rel="stylesheet">

    <style type="text/css">

        #connect-container {

            margin: 0 auto;

            width: 400px;

        }

 

        #connect-container div {

            padding: 5px;

            margin: 0 7px 10px 0;

        }

 

        .message input {

            padding: 5px;

            margin: 0 7px 10px 0;

        }

 

        .layui-btn {

            display: inline-block;

        }

    </style>

    <script type="text/javascript">

        var stompClient = null;

 

        $(function () {

            var target = $("#target");

            if (window.location.protocol === 'http:') {

                target.val('http://' + window.location.host + target.val());

            } else {

                target.val('https://' + window.location.host + target.val());

            }

        });

 

        function setConnected(connected) {

            var connect = $("#connect");

            var disconnect = $("#disconnect");

            var echo = $("#echo");

 

            if (connected) {

                connect.addClass("layui-btn-disabled");

                disconnect.removeClass("layui-btn-disabled");

                echo.removeClass("layui-btn-disabled");

            } else {

                connect.removeClass("layui-btn-disabled");

                disconnect.addClass("layui-btn-disabled");

                echo.addClass("layui-btn-disabled");

            }

 

            connect.attr("disabled", connected);

            disconnect.attr("disabled", !connected);

            echo.attr("disabled", !connected);

        }

 

        //连接

        function connect() {

            var target = $("#target").val();

 

            var ws = new SockJS(target);

            stompClient = Stomp.over(ws);

 

            stompClient.connect({}, function () {

                setConnected(true);

                log('Info: STOMP connection opened.');

 

                //连接成功后，主动拉取未读消息

                pullUnreadMessage("/topic/reply");

 

                //订阅服务端的/topic/reply地址

                stompClient.subscribe("/user/topic/reply", function (response) {

                    log(JSON.parse(response.body).content);

                })

            },function () {

                //断开处理

                setConnected(false);

                log('Info: STOMP connection closed.');

            });

        }

 

        //断开连接

        function disconnect() {

            if (stompClient != null) {

                stompClient.disconnect();

                stompClient = null;

            }

            setConnected(false);

            log('Info: STOMP connection closed.');

        }

 

        //向指定用户发送消息

        function sendMessage() {

            if (stompClient != null) {

                var receiver = $("#receiver").val();

                var msg = $("#message").val();

                log('Sent: ' + JSON.stringify({'receiver': receiver, 'msg':msg}));

 

                $.ajax({

                    url: "/wsTemplate/sendToUser",

                    type: "POST",

                    dataType: "json",

                    async: true,

                    data: {

                        "receiver": receiver,

                        "msg": msg

                    },

                    success: function (data) {

 

                    }

                });

            } else {

                layer.msg('STOMP connection not established, please connect.', {

                    offset: 'auto'

                    ,icon: 2

                });

            }

        }

 

        //从服务器拉取未读消息

        function pullUnreadMessage(destination) {

            $.ajax({

                url: "/wsTemplate/pullUnreadMessage",

                type: "POST",

                dataType: "json",

                async: true,

                data: {

                    "destination": destination

                },

                success: function (data) {

                    if (data.result != null) {

                        $.each(data.result, function (i, item) {

                            log(JSON.parse(item).content);

                        })

                    } else if (data.code !=null && data.code == "500") {

                        layer.msg(data.msg, {

                            offset: 'auto'

                            ,icon: 2

                        });

                    }

                }

            });

        }

 

        //日志输出

        function log(message) {

            console.debug(message);

        }

    </script>

</head>

<body>

    <noscript><h2 style="color: #ff0000">Seems your browser doesn't support Javascript! Websockets rely on Javascript being

        enabled. Please enable

        Javascript and reload this page!</h2></noscript>

    <div>

        <div id="connect-container" class="layui-elem-field">

            <legend>Chat With STOMP Message</legend>

            <div>

                <input id="target" type="text" class="layui-input" size="40" style="width: 350px" value="/chat-websocket"/>

            </div>

            <div>

                <button id="connect" class="layui-btn layui-btn-normal" οnclick="connect();">Connect</button>

                <button id="disconnect" class="layui-btn layui-btn-normal layui-btn-disabled" disabled="disabled"

                        οnclick="disconnect();">Disconnect

                </button>

 

            </div>

            <div class="message">

                <input id="receiver" type="text" class="layui-input" size="40" style="width: 350px" placeholder="接收者姓名" value=""/>

                <input id="message" type="text" class="layui-input" size="40" style="width: 350px" placeholder="消息内容" value=""/>

            </div>

            <div>

                <button id="echo" class="layui-btn layui-btn-normal layui-btn-disabled" disabled="disabled"

                        οnclick="sendMessage();">Send Message

                </button>

            </div>

        </div>

    </div>

</body>

</html>

启动项目后，分别在两个浏览器中使用不同的账号登录，接着互相给对方发送消息，效果如下：

界面一：

界面二：

GeeLoong
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
SpringBoot+WebSocket实时监控异常
fghklfgkhd的博客
11-18 2859
写在前面 此异常非彼异常，标题所说的异常是业务上的异常。 最近做了一个需求，消防的设备巡检，如果巡检发现异常，通过手机端提交，后台的实时监控页面实时获取到该设备的信息及位置，然后安排员工去处理。 因为需要服务端主动向客户端发送消息，所以很容易的就想到了用WebSocket来实现这一功能。 WebSocket就不做介绍了，上链接：https://developer.mozilla.org/zh-CN/docs/Web/API/WebSocket 前端略微复杂，需要在一张位置分布图上进行鼠标描
webScoket即时聊天，用户不在线时消息暂存，上线立马收到
qq_39897814的博客
06-25 9535
这个代码是用webScoket写的即时聊天通讯的，功能可群发单发，可对不在线用户发送消息时用户一上线立马就能收到消息，也可以查看未读数量，这个代码写了有一段时间了，忽然想起来就想着发上来记一下和交流一下 欢迎大家指教，如果有什么不对的地方欢迎指出，共同进步 也可以去直接下载代码，不过会需要用5积分下载 https://download.csdn.net/download/qq_3989781......
WebSocket—STOMP详解(官方原版)
最新发布
Java毕设项目分享
05-20 365
🍅🍅WebSocket协议定义了两种类型的消息（文本和二进制），但其内容未作定义。该协议定义了一种机制，供客户端和服务器协商在WebSocket之上使用的子协议（即更高级别的消息传递协议），以定义各自可以发送何种消息、格式是什么、每个消息的内容等等。子协议的使用是可选的，但无论如何，客户端和服务器都需要就定义消息内容的一些协议达成一致。
springBoot使用webscoket，根据订阅信息发送信息给不同的用户
weferxe的博客
01-31 2721
dao层使用jpa 1.数据库三张表的表结构 message表，消息信息表 message_receive接受消息表 subscrib订阅消息表 我想的是发送消息根据订阅表中的订阅类型发送到某某人那里，缺少一张消息类型表，如果需要可以加上 2.WebSocket配置类 @Configuration public class WebSocketConfig { @Bean pu...
webSocket向指定用户发送消息
Funny2333的博客
04-16 5474
webSocket向指定用户发送消息 在pom文件中添加依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency> java后台 @Component @ServerEndpoint(value = "/webSocketT
消息服务器实时通讯,在服务端使用 WebSocket Client 发送 / 广播消息《 企业应用架构：实时通信 》...
weixin_39943383的博客
07-30 253
在服务端上的这些 WebSocket 消息处理器，除了这个消息里的数据参数以外，第二个参数是一个 WebSocket Client，使用这个客户端我们可以去做一些事情。这里可以使用 @ConnectedSocket 这个装饰器装饰一下这个参数，名字可以叫做 client，这个客户端的类型取决于我们在应用里用的是哪一种 WebSocket 库，我用的是 Socket.io，所以这个类型可以设置成 S...
spring-boot-websocket.rar
04-29
2. **WebSocket Controller**：Spring Boot应用中可能会有一个WebSocket控制器，它处理WebSocket连接的建立、消息的发送和接收。控制器类可能包含`@MessageMapping`注解的方法，这些方法对应WebSocket的消息路由。 ...
Spring Boot实现STOMP协议的WebSocket的方法步骤
08-26
Spring Boot 实现 STOMP 协议的 WebSocket 的方法步骤 本文将介绍 Spring Boot 实现 STOMP 协议的 WebSocket 的方法步骤。 WebSocket 是一种双向...现在，我们已经实现了 STOMP 协议的 WebSocket 使用 Spring Boot。
Spring Boot 2 Cookbook 第二版
10-11
《Spring Boot 2 Cookbook 第二版》是一本针对Java开发者极具价值的开发指南，它深入浅出地介绍了Spring Boot 2这一强大框架的使用方法。Spring Boot是Spring框架的一个子项目，旨在简化Java应用程序的初始搭建以及...
spring boot demo
01-07
- 可能会讲解Spring Boot中的安全控制，如使用Spring Security进行身份验证和授权。 - 或者介绍如何集成Thymeleaf、FreeMarker等模板引擎进行视图渲染。 6. **第19章可能涉及的内容** - 可能会讨论Spring Boot的...
spring boot 42讲配套源码.zip
12-12
第 2-2 课 Spring Boot 项目中使用 JSP/spring-boot-jsp 第 2-3 课 模板引擎 Thymeleaf 基础使用/spring-boot-thymeleaf 第 2-4 课 模板引擎 Thymeleaf 高阶用法/spring-boot-thymeleaf 第 2-5 课 Thymeleaf 页面...
Websocket根据session向客户端推送不同数据 巧妙使用菜鸟HTML
qq_40595055的博客
03-13 4180
代码： &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;title&amp;gt;new document&amp;lt;/title&amp;gt; &amp;lt;meta name=&quot;generator&quot; content=&quot;editplus&q
解决 SpringMVC 非spring管理的工具类使用@Autowired注解注入DAO为null的问题
炒鸡加倍
05-16 5004
有时候在工具类中需要要操作数据库，即需要注入springMVC中的DAO层，但是此时工具类并非spring管理，所以使用@Autowired注入会报空指针异常，在试了好多方案都不行时，找到了比较适合springMVC的解决方法：（1）在配置文件（springmvc.xml）中加入工具类所在包的扫描配置。（2）使用@Component注解将工具类声明为spring组件，并静态初始化。代码截取：@Co...
Spring使用WebSocket，发送图片、表情、消息、心跳机制
Johnny_sunshine的博客
10-09 920
Spring使用WebSocket，发送图片、表情、消息、心跳机制 项目地址：https://gitee.com/BestJohnny/spring-web-socket IndexController.java import java.io.IOException; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.json.JSONObj
使用WebSocket实现服务端向指定的客户端推送消息
热门推荐
sleepyhead1994的博客
08-29 1万+
写这篇博客记录一下自己在用websocket的时候遇到的坑。 需求是这样的：需要将activeMq来的数据利用websockt推送给客户端显示出来，有多个服务终端，需要将不同的消息推送到对应的服务终端上。 1.服务端代码：需要写一个WebSocketServer类，里面根据自己需要重写方法，在写一个配置类WebSocketConfig就行了。下面上代码 WebSocketServer类： @Com...
SpringBoot+WebSocket实时监控异常，推荐一款技术人必备的接口测试神器
m0_65321095的博客
12-23 1107
19 margin-top: 15px; 20 width: 20px; 21 height: 20px; 22 border-radius: 50%; 23 background: #55ff00; 24 } 25 .nowI{ 26 background: #ff0000 !important; 27 } 28
websocket实现单发群发（处理用户不在线的情况）
qq_39966012的博客
08-21 1713
代码 package com.ruoyi.utils.websocket; import com.alibaba.fastjson.JSONObject; import com.ruoyi.common.core.domain.AjaxResult; import com.ruoyi.common.core.domain.model.LoginUser; import com.ruoyi.system.service.ISysUserService; import com.ruoyi.utils.dom
WebSocket消息推送
weixin_41368339的博客
08-15 864
■1.消息推送的逻辑结构设计思路 消息推送一般为某角色用户在页面上做申请操作，然后通过消息推送提醒下一个任务节点用户对上述申请数据做出处理。这里我们把消息推送分为，消息生成和消息推送2个部分。消息生成后由于我们不知道被推送者当前是否在线，所以产生的消息可不直接推送，而是将消息内容放入数据库的消息推送表中。然后，通过定时任务去不断获取需要推送的消息，判断被推送者是否在线如果在线就将消息推送出去，并更改消息状态为已推送。如果被推送者当前不在线，那么就不改变当前消息的推送状态。 ■2.代码的简单实现 为了代
springboot整合websocket实现服务器端获取当前在线数并向客户端主动发送消息
QYHuiiQ
12-23 8367
参考链接： https://blog.csdn.net/qq_38082304/article/details/78959373 https://www.imooc.com/article/70702?block_id=tuijian_wz https://blog.csdn.net/b7410852963/article/details/49585507 项目目录结构： 1.创建一...
spring-boot中文教程
05-09
"升级Spring Boot"部分则针对已有项目，指导用户如何平滑地从一个版本升级到另一个版本，包括从1.x到2.x的重大升级和小版本之间的升级，以及Spring Boot CLI的升级。 "使用Spring Boot进行开发"章节深入探讨了...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值