'Error: INTERNAL' when running firebase cloud functions locally from react native client

Question

I passed all over the questions/answers about an issue related to: Calling firebase cloud functions locally from react native client. But no answer helped me fix it.

I'm using react-native@0.61.5 and react-native-firebase@5.6.0

Here is the issue:

After I run 'firebase serve --only functions', when I try to use functions.useFunctionsEmulator('http://localhost:5000') or functions.useFunctionsEmulator('http://MY-IP-ADDRESS:5000') I get the following error.

Note: My cloud function is working properly when called from firebase server (when removing the line code that produces the error).

Here is my code:

Cloud Function:

const functions = require('firebase-functions');
const admin = require('firebase-admin');

admin.initializeApp();

exports.addAdminRole = functions.https.onRequest((data, context) => {  

    return admin.auth().getUserByEmail(data.email).then(user => {
        return admin.auth().setCustomUserClaims(user.uid, {
            admin: true
        });
    }).then(() => {
        return {
            message: 'Admin has been added Successfuly!'
        }
    }).catch(err => {
        return err;
    });
});

React Native (UI)

import React from 'react'
import { View, Text, TouchableHighlight } from 'react-native'
import firebase from 'react-native-firebase'

const functions = firebase.functions()

//functions.useFunctionsEmulator('http://localhost:5000')   <-- this line produce 'Error: INTERNAL'
//functions.useFunctionsEmulator('http://MY-IP-ADDRESS:5000') <-- using this line also produced the same error

export default class AddAdmin extends React.Component {

    addAdminRole() {
        const addAdminRole = functions.httpsCallable('addAdminRole')
        addAdminRole({ email: 'admin@test.fr' })
            .then(result => console.log(result))
            .catch(err => console.error(err))
    }

 render() {
        return (
                <View style={{ flex: 1, justifyContent: 'center', alignitems: 'center' }}>
                    <TouchableHighlight onPress={this.addAdminRole}>
                            <Text style={styles.buttonText}>Add Admin Role</Text>
                    </TouchableHighlight>
                </View>
                )
 }
}

Answer 1

You seem to be following some outdated instructions. According to the Firebase documentation on starting the emulators, you need:

firebase emulators:start --only functions

After doing that, you can use this in your React code:

firebase.functions().useFunctionsEmulator("http://localhost:5001")

I'm not entirely sure if react-native-firebase supports useFunctionsEmulator yet, so if you're using that package you might want to check their release notes.

Answer 2

By default Firebase emulators only respond to requests from localhost, to test from other local devices try adding "host": "0.0.0.0" to your firebase.json file:

"emulators": {
  "functions": {
     "port": 5001,
     "host": "0.0.0.0"
   },
}

Also .useFunctionsEmulator() in your config file should have your local host IP address instead of http://localhost, example:

firebase.functions().useFunctionsEmulator("http://10.0.0.170:5001");

Answer 3

You have to remove the "http", so it will be:

firebase.functions().useEmulator('localhost', '5001')