Giter VIP home page Giter VIP logo

Comments (1)

Mikail-snipez13 avatar Mikail-snipez13 commented on June 27, 2024

I have the same problem but a bit different. I'm thinking this is mainly a problem with the backend with spring boot 3 using websockets. I can connect to the backend when i run the backend on localhost but in deployment the connection fails.

My React Native Code looks like this:

useEffect(() => {
    void getCredentials().then(async credentials => {
      console.log('Configure Websocket')
      const csrfToken = await axios.get(process.env.EXPO_PUBLIC_POST_SERVICE_URL + '/csrf', {
        headers: {
          Authorization: `Bearer ${credentials.accessToken}`
        }
      })
      console.log('Websocket CSRF-TOKEN: ' + csrfToken.data.token)
      wsRef.current = new StompJS.Client({
        // brokerURL: 'ws://localhost:8080/ws',
        // debug: data => { console.log(data) },
        heartbeatIncoming: 10000,
        connectHeaders: {
          'X-Authorization': `Bearer ${credentials.accessToken}`,
          'X-CSRF-TOKEN': csrfToken.data.token
        },
        webSocketFactory: () => {
          return new SockJS(`${process.env.EXPO_PUBLIC_POST_SERVICE_URL}/ws`)  // env = http://localhost:8080
        },
        onConnect: () => {
          console.log('websocket is connected ')
        },
        onStompError: err => {
          console.error('websocket error: %s', err)
        },
        onDisconnect: err => { console.error('websocket error: %s', err) },
        onWebSocketError: err => { console.error('websocket error: %s', err) },
        onUnhandledFrame: err => { console.error('websocket unhandled frame: ' + err)},
        onWebSocketClose: err => { console.error('websocket closed: ' + JSON.stringify(err))}
      })
      wsRef.current.activate()
    }).catch(err => { console.error('noCredentials for websocket: ' + err) })
    return () => {
      if (wsRef.current != null) {
        void wsRef.current.deactivate()
      }
    }
  }, [])

But if i go to the deployment the stompClient throws errors.

websocket closed: {"type":"close","bubbles":false,"cancelable":false,"timeStamp":1717710951199,"wasClean":false,"code":2000,"reason":"All transports failed"}

Screenshot 2024-06-07 at 00 54 22

My Backend configuration is like this:

@Configuration
@EnableWebSocketMessageBroker
@EnableWebSocketSecurity
@Order(Ordered.HIGHEST_PRECEDENCE + 99)
@Slf4j
public class WebsocketConfig implements WebSocketMessageBrokerConfigurer {
    
    @Autowired
    private JwtDecoder jwtDecoder;

    @Autowired
    private JwtAuthenticationConverter authenticationConverter;

    private TaskScheduler messageBrokerTaskScheduler;

    @Autowired
    public void setMessageBrokerTaskScheduler(@Lazy TaskScheduler taskScheduler) {
        this.messageBrokerTaskScheduler = taskScheduler;
    }
    
    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/ws")
                .setAllowedOrigins("postservice.starlight-marketing.de")
                .addInterceptors(new HttpSessionHandshakeInterceptor())
                .withSockJS();
    }

    @Override
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        registry.enableSimpleBroker("/topic")
                        .setHeartbeatValue(new long[] {10000, 20000})
                        .setTaskScheduler(messageBrokerTaskScheduler);
        registry.setUserDestinationPrefix("/user");
        registry.setApplicationDestinationPrefixes("/app");
    }

    @Bean
    AuthorizationManager<Message<?>> messageAuthorizationManager(MessageMatcherDelegatingAuthorizationManager.Builder messages) {
        messages.anyMessage().permitAll();
        return messages.build();
    }

    @Override
    public void configureClientInboundChannel(ChannelRegistration registration) {

        registration.interceptors(new ChannelInterceptor() {
            @Override
            public Message<?> preSend(Message<?> message, MessageChannel channel) {
                StompHeaderAccessor accessor =
                        MessageHeaderAccessor.getAccessor(message, StompHeaderAccessor.class);
                if (StompCommand.CONNECT.equals(accessor.getCommand())) {
                    List<String> authorization = accessor.getNativeHeader("X-Authorization");
                    log.info("X-Authorization: {}", authorization.get(0).substring(0, 19));

                    String accessToken = authorization.get(0).split(" ")[1];
                    Jwt jwt = jwtDecoder.decode(accessToken);
                    Authentication authentication = authenticationConverter.convert(jwt);
                    accessor.setUser(authentication);
                }
                return message;
            }
        });
    }
}

I don't know what to do.

from stompjs.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.