使用Springboot开发websocket程序(三)——基于子协议STOMP的web聊天室

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

@SpringBootApplication
public class SpringWebsocketApplication {
    public static void main(String[] args) {
        SpringApplication.run(SpringWebsocketApplication.class, args);
    }
}

@Configuration
// 启用STOMP协议消息代理来传递消息
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {
    /**
     * 注册STOMP端点
     *
     * @param registry STOMP端点注册器
     */
    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        // 客户端连接的websocket握手地址（端点）
        registry.addEndpoint("/websocket")
                // .setAllowedOrigins("*") // 设置允许的客户端请求源，默认只能在同域名下，不能跨域，设置为*可允许所有客户端请求
                .withSockJS(); // 启用socketjs
    }

    /**
     * 消息代理配置，使用基于内存的消息代理
     *
     * @param registry 消息代理注册表
     */
    @Override
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        // 如果消息端点是/topic或/queue开头的，则直接转发给消息代理(内存或其他MQ，如RabbitMQ等)
        registry.enableSimpleBroker("/topic", "/queue");
        // 端点以app开头的消息将会自动路由给@MessageMapping标注的Controller方法上
        registry.setApplicationDestinationPrefixes("/app");
    }

    @Override
    public void configureClientInboundChannel(ChannelRegistration registration) {
        registration.interceptors(new ChannelInterceptorAdapter() {
            @Override
            public Message<?> preSend(Message<?> message, MessageChannel channel) {
                StompHeaderAccessor accessor = MessageHeaderAccessor.getAccessor(message, StompHeaderAccessor.class);
                // 握手时客户端传递userName头信息来标识登录人
                if (StompCommand.CONNECT.equals(accessor.getCommand())) {
                    String userName = accessor.getNativeHeader("userName").get(0);
                    Principal principal = new PrincipalImpl(userName);
                    accessor.setUser(principal);
                }
                return message;
            }
        });
    }

}

@Override
public void configureMessageBroker(MessageBrokerRegistry registry) {
    // 启用其他MQ(RabbitMQ、ActiveMQ等)消息代理，他们需要支持并启用STOMP
    registry.setPathMatcher(new AntPathMatcher("."));
    registry.enableStompBrokerRelay("/topic", "/queue");
    // 端点以app开头的消息将会自动路由给@MessageMapping标注的Controller方法上
    registry.setApplicationDestinationPrefixes("/app");
}

@Controller
@RequestMapping
public class WebSocketController {
    @Resource
    private SimpMessagingTemplate simpMessagingTemplate;
    private DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss");

    @RequestMapping("/hello")
    @ResponseBody
    public String customSendMsg(String name) {
        // 手动发送消息
        simpMessagingTemplate.convertAndSend("/topic/chat", "hello, i am " + name);
        return "success";
    }

    /**
     * 发送群聊消息
     *
     * @param content
     * @return
     */
    // 路由消息，可用在类和方法上，用在类上表示控制器中所有方法之间共享映射。格式为/foo*，/foo/**和/foo/{id}(使用@DestinationVariable来引用传递的参数)
    @MessageMapping("/say")
    // 将消息的返回值直接发送到指定的目标地址上
    @SendTo("/topic/chat")
    public String sayAll(String content, Principal principal) {
        String curUserName = principal.getName();
        return formatter.format(LocalDateTime.now()) + ", " + curUserName + " say : " + content;
    }

    @MessageMapping("/say/{userName}")
    public String send2User(String content, @DestinationVariable String userName, Principal principal) {
        System.out.println("userName : " + userName);
        String curUserName = principal.getName();
        // return formatter.format(LocalDateTime.now()) + ", " + curUserName + " say : " + content;
        String s = formatter.format(LocalDateTime.now()) + ", " + curUserName + " say : " + content;
        simpMessagingTemplate.convertAndSendToUser(userName, "/queue/" + principal + "/chat", s);
        return s;
    }

    @MessageExceptionHandler
    @SendTo("/queue/errors")
    public String handleException(Throwable exception) {
        return exception.getMessage();
    }
}

<!--stomp js-->
<script src="https://cdn.bootcss.com/stomp.js/2.3.3/stomp.js"></script>
<!--sockjs-client-->
<script src="https://cdn.bootcss.com/sockjs-client/1.4.0/sockjs.js"></script>

function connect() {
    // 基于SocketJS
    var socket = new SockJS('/websocket');
    ws = Stomp.over(socket);
    // 传递header信息，用来后台登录认证
    ws.connect({userName: $username.val()}, function (frame) {
        setConnected(true);
        console.log("connected : " + frame);
        // 订阅聊天内容
        ws.subscribe('/topic/chat', function (data) {
            console.log(data);
            showMessage(data.body);
        });
        // 订阅错误信息
        ws.subscribe('/queue/errors', function (data) {
            console.log("error : " + data);
            showMessage(data.body);
        });
    }, function (error) {
        console.log("STOMP error : " + error);
    });
}

// 订阅某一个人, 注意客户端订阅必须以/user开头，后台并没有
ws.subscribe('/user/queue/' + $oneuser.val() + '/chat', function (data) {
    console.log(data);
    showOneUserMessage(data.body);
});

function send() {
    if (oneUserChat) {
        ws.send('/app/say/' + $oneuser.val(), {}, $content.val());
        $oneuserMsg.append("
" + dateFormat(new Date()) + " 你对" + $oneuser.val() + "说：" + $content.val())
    } else {
        ws.send('/app/say', {}, $content.val());
    }
}