WebSocket 握手 - 意外響應代碼 200 - AngularJs 和 Spring Boot

Question

當我嘗試在 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();
}

有誰知道如何解決這個問題？
先感謝您！

Answer 1

我有一個類似的問題，我正在使用 chrome 插件（Simple WebSocket Client）測試我的 websocket 連接，並試圖連接到 ws://localhost:8080/handler/，它在我的代碼中定義為registry.addEndpoint("/handler").setAllowedOrigins("*").withSockJS(); 但發生了意外錯誤 200。 我通過將 /websocket 附加到我的 chrome 擴展上的客戶端請求字符串來解決這個問題，所以你可以嘗試在你的 JS 文件中更改以下行：

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

到

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

我不知道為什么在我的情況下修復了它，我只是隨機偶然發現它，如果有人能更清楚地說明它，那就太好了:)

Answer 2

你可以試試這個WebsocketConfiguration配置：

@Override
public void registerStompEndpoints(StompEndpointRegistry stompEndpointRegistry)
{
    stompEndpointRegistry.addEndpoint("/socket").setAllowedOrigins("*");      
    stompEndpointRegistry.addEndpoint("/socket").setAllowedOrigins("*").withSockJS();
}

所以你有 websocket 和 SockJS 配置？

Answer 3

如果將 sockJS 客戶端配置為在 websocket 端點上使用 sockJS，則需要使用 sockJS 客戶端。

Answer 4

Spring Boot，WebSocket和Angular我遇到了同樣的問題，這就是我如何解決它並在我的角度股票記錄中使用實時數據運行websocket運行websocket

。 antMatchers("/ws/myapp", "/http/myaap", "/topic/**", "/app/**").permitAll()

WebSecurityConfigurerAdapter類

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
                .cors()
                .and()
                .csrf()
                .disable()
                .authorizeRequests()
                .antMatchers("/", "/favicon.ico")                
                .antMatchers("/api/stocks/**")
                .permitAll()
                .antMatchers("/ws/myapp", "/http/myaap", "/topic/**", "/app/**" )
                .permitAll()
                .anyRequest()
                .authenticated()
                .and()
                .exceptionHandling()
                .authenticationEntryPoint(unauthorizedHandler)
                .and()
                .sessionManagement()
                .sessionCreationPolicy(SessionCreationPolicy.STATELESS);
        http.addFilterBefore(authenticationJwtTokenFilter(), UsernamePasswordAuthenticationFilter.class);
    }
}

Angular這里提供的服務網址就是這些

http://localhost:8080/http/myapp'
ws://localhost:8080/ws/myapp 

我希望這個能幫上忙