CODEWITHSUNDEEP
firebasereactjsreact-native
lazywei
lazywei

Reputation: 12465

Firebase client on ReactNative

When using Firebase on ReactNative, it will show such error message:

can't find variable process

However, if I require firebase/lib/firebase-web.js manually, it will show:

can't find variable document

How can I resolve this?

Upvotes: 7

Views: 1415

Answers (3)

Lukas Liesis
Lukas Liesis

Reputation: 26393

I had issues with socket.io on React Native too, solution was to get notifications about new data and if data is big enough - get it by simple RESTfull request. in my case data was small enough to be sent all within notifications API.

I was using GCM service to send notification to phone from nodejs server. BTW, it uses less battery then socket connection and works great :)

Upvotes: 0

lazywei
lazywei

Reputation: 12465

Just figuring it our. Pavan's answer is helpful, but it is not quite true when using with Firebase.

For firebase, please follow the steps:

  1. Download the firebase-debug.js from wsExample. Or you can just install wsExample by npm and require the firebase-debug.js inside it.

  2. Use badfortrains's forked React-Native:

    "react-native": "git://github.com/badfortrains/react-native#WebSocket"

  3. New the Firebase like this:

    var firebase = require("../../firebase-debug.js");
var rootRef = new Firebase(Const.FB_ROOT);

Things should just work now!

Upvotes: 2

Pavan Ravipati
Pavan Ravipati

Reputation: 1870

I just went through the same issue while trying to use sockets.io in my react native app so hopefully I can help.

The reason that you cannot use firebase's node module is because there hasn't been a polyfill created yet for websockets support (which firebase is dependent on) in react native.

If you take a look at issue #619 in react native's repo you'll find the current discussion on creating a websockets api polyfill.

The way that we solved it is by using Jason's modified version of the sockets library and creating our own repo around just that file. Then we added the line below to our package.json dependencies. 

"react-sockets": "crewapp/react-native-sockets-io"

enter image description here

The reason that Jason's version of the sockets.io client file works is because react-native is added as a user agent. You can find the code that makes this change at the top of the file:

window.navigator = {
  userAgent: "react-native"
}

Once you've gone through these steps you should be able to require sockets.io / firebase as normal.

Upvotes: 4

Related Questions