SpringBoot集成STOMP WebSocket时浏览器与服务端无法建立连接求助

1. 检查依赖配置 #

• 后端确认已引入WebSocket起步依赖，Spring Boot项目pom.xml需添加：

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

• 前端确认按顺序引入jquery、sockjs-client、旧版stompjs三个依赖，注意不要使用@stomp/stompjs v5+的新版本，其API与旧版stompjs不兼容，会导致连接逻辑失效

2. 检查路径匹配 #

• 若后端配置了server.servlet.context-path上下文路径，前端SockJS初始化需补全前缀，例如下文路径前缀为/demo时，需修改为：

  var socket = new SockJS('/demo/gs-guide-websocket');
  

3. 检查跨域配置 #

• 若前后端部署端口/域名不一致，需在WebSocket端点注册时放开跨域限制，修改WebSocketConfig配置：

  @Override
  public void registerStompEndpoints(StompEndpointRegistry registry) {
      registry.addEndpoint("/gs-guide-websocket")
              .allowedOriginPatterns("*") // 放开跨域
              .withSockJS();
  }
  

4. 检查配置类扫描 #

• 确认WebSocketConfig类位于Spring Boot启动类的同级包或子包下，否则需通过@ComponentScan手动指定扫描路径，可在配置类方法内加断点验证启动时是否被加载。

5. 检查权限拦截 #

• 若项目集成了Spring Security、权限拦截器等组件，需将/gs-guide-websocket/**路径加入放行规则，避免连接请求被拦截。

6. 增加连接异常回调排查错误 #

可在前端connect方法中增加错误回调，打印具体异常信息：

stompClient.connect({}, function (frame) {
    // 原有连接成功逻辑
}, function (error) {
    console.error('连接失败: ' + error);
});

内容的提问来源于stack exchange，提问作者user2023141