WebSocket 握手 - 意外响应代码 200 - AngularJs 和 Spring Boot

Posted 2023-03-04

【中文标题】WebSocket 握手 - 意外响应代码 200 - AngularJs 和 Spring Boot

【英文标题】：WebSocket Handshake - Unexpected response code 200 - AngularJs and Spring Boot

【发布时间】：2019-01-21 13:10:13

【问题描述】：

当我尝试在 AngularJS 应用程序和 Spring Boot 之间建立 websocket 通信时，出现错误：websocket 握手期间出错 - 意外响应代码：200。

这是我的 JS 代码：

function run(stateHandler, translationHandler, $websocket) 
    stateHandler.initialize();
    translationHandler.initialize();

    var ws = $websocket.$new('ws://localhost:8080/socket'); // instance of ngWebsocket, handled by $websocket service

    ws.$on('$open', function () 
        console.log('Oh my gosh, websocket is really open! Fukken awesome!');  
    );

    ws.$on('/topic/notification', function (data) 
        console.log('The websocket server has sent the following data:');
        console.log(data);

        ws.$close();
    );

    ws.$on('$close', function () 
        console.log('Noooooooooou, I want to have more fun with ngWebsocket, damn it!');
    );

这是我的 Java 代码：

WebsocketConfiguration.java

@Override
public void registerStompEndpoints(StompEndpointRegistry stompEndpointRegistry)

    stompEndpointRegistry.addEndpoint("/socket")
        .setAllowedOrigins("*")
        .withSockJS();


@Override
public void configureMessageBroker(MessageBrokerRegistry registry) 
    registry.enableSimpleBroker("/topic");

WebsocketSecurityConfiguration.java

@Override
protected void configureInbound(MessageSecurityMetadataSourceRegistry messages) 
    messages
        // message types other than MESSAGE and SUBSCRIBE
        .nullDestMatcher().authenticated()
        // matches any destination that starts with /rooms/
        .simpDestMatchers("/topic/tracker").hasAuthority(AuthoritiesConstants.ADMIN)
        .simpDestMatchers("/topic/**").permitAll()
        // (i.e. cannot send messages directly to /topic/, /queue/)
        // (i.e. cannot subscribe to /topic/messages/* to get messages sent to
        // /topic/messages-user<id>)
        .simpTypeMatchers(SimpMessageType.MESSAGE, SimpMessageType.SUBSCRIBE).denyAll()
        // catch all
        .anyMessage().denyAll();

有人知道如何解决这个问题吗？ 提前谢谢！

【参考方案1】：

我有一个类似的问题，我正在使用 chrome 插件（简单 WebSocket 客户端）测试我的 websocket 连接，并试图连接到我的代码中定义为 registry.addEndpoint("/handler").setAllowedOrigins("*").withSockJS(); 的 ws://localhost:8080/handler/但发生意外错误 200。我已通过将 /websocket 附加到 chrome 扩展上的客户端请求字符串来解决此问题，因此您可以尝试在 JS 文件中更改以下行：

var ws = $websocket.$new('ws://localhost:8080/socket');

到

 var ws = $websocket.$new('ws://localhost:8080/socket/websocket');

我不知道为什么在我的情况下修复它的原因我只是随机偶然发现它，如果 some1 可以进一步澄清它会非常好:)

【讨论】：

我发现用 .withSockJS(); 配置 spring意味着必须添加'websocket'。我假设是因为您提供了后备选项？如果你删除 .withSockJS();你不需要附加 websocket。顺便说一句，谢谢你的回答！

谢谢，你拯救了我的夜晚！这是否显示在文档中？我找不到任何东西...

这是正确答案。当您使用 withSockJS() 时，您必须将 /websocket 添加到您的 url。如果没有 SockJS，您必须使用 WebSocketConfiguration 中的 url。

这也适用于我，但让我发疯，因为我无法在代码中找出它为什么有效。我正在浏览所有内容，但这似乎是一种技巧，而不是正确的解决方案。

@PeterCatalin 您可以在链接中查看后缀 /websocket > github.com/sockjs/…

【参考方案2】：

你能试试这个WebsocketConfiguration配置吗：

@Override
public void registerStompEndpoints(StompEndpointRegistry stompEndpointRegistry)

    stompEndpointRegistry.addEndpoint("/socket").setAllowedOrigins("*");      
    stompEndpointRegistry.addEndpoint("/socket").setAllowedOrigins("*").withSockJS();

所以你有 websocket 和 SockJS 配置？

【讨论】：

我认为只有端点的第一个配置会与您的代码一起使用。

.withSockJS() 应该将端点配置为在浏览器中不可用 websocket 时回退到 SockJS。但是，如果您使用 .withSockJS() ，那么您似乎还需要设置您的 Web 客户端才能使用它，否则您将在协商期间获得 200 状态。比较：stomp-js.github.io/guide/stompjs/rx-stomp/ng2-stompjs/… 和 stomp-js.github.io/guide/stompjs/…。

【参考方案3】：

如果您将其配置为在您的 websocket 端点上使用 sockJS，则需要使用 sockJS 客户端。