Firebase inside ReactNative (ReactVR) websocket error

Question

I am trying to use Firebase Realtime Database from inside ReactVR (which is built on top of ReactNative).

When I try to listen on a ref though, it throws Error during WebSocket handshake: Unexpected response code: 500 though.

Here is the code I have used -

export default class WelcomeToVR extends React.Component {

  constructor(){
    super();

    var config = {
      apiKey: "<REDACTED>",
      authDomain: "<REDACTED>",
      databaseURL: "<REDACTED>",
      projectId: "<REDACTED>",
      storageBucket: "<REDACTED>",
      messagingSenderId: "<REDACTED>",
    };
    firebase.initializeApp(config);
  }

  componentWillMount() {
    firebase.database().ref(`viewers`).on('child_added', function(data) {
      console.log(data);
    });
  }

  render() {
    return (
      <View>
      </View>
    );
  }
};

AppRegistry.registerComponent('WelcomeToVR', () => WelcomeToVR);

And this is the trace in the console -

WebSocket connection to 'wss://myapp.firebaseio.com/.ws?v=5' failed: Error during WebSocket handshake: Unexpected response code: 500

WrappedWebSocket    @   VM1892:37
connect @   WebSocketModule.js:45
frame   @   ReactNativeContext.js:416
frame   @   createRootView.js:188
_frame  @   VRInstance.js:152

If I run this code outside of the RN context, it works great.

I feel like the problem is with the WS URL its trying to connect with.

When I run this outside of the RN context, this is the URL that its trying to connect with - wss://s-usc1c-nss-107.firebaseio.com/.ws?v=5&ns=my-app

But from inside the RN component, it tries for - wss://my-app.firebaseio.com/.ws?v=5

I am a bit lost here. Since I am not able to gain access to the Firebase.js source code I am not able to debug this as well.

Would love some help here. :) Thanks

Firebase inside ReactNative (ReactVR) websocket error

0 Answers0