Emulator is calling https.callable functions remotely instead of from localhost

[REQUIRED] Environment info

firebase-tools:

6.10.0

Platform:

Fedora 30

[REQUIRED] Test case

I have a very simple firebase https.callable function:

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

const admin = require('firebase-admin');
admin.initializeApp();

exports.oauth = functions.https.onCall((data, ctx) => {

    return ({ok:1})

});

And in my calling code

const oauth = Firebase.functions().httpsCallable('oauth')
oauth('foo').then(console.log)

[REQUIRED] Steps to reproduce

You just need to initialize FB all call the above in some front end code

[REQUIRED] Expected behavior

After running firebase serve, I expected my front end code to call the function on localhost, as in the last line below:

✔  functions: Using node@8 from host.
✔  functions: Emulator started at http://localhost:5001
i  functions: Watching "/home/rob/development/stripmall/src/try1/web_app/functions" for Cloud Functions...
i  hosting: Serving hosting files from: build
✔  hosting: Local server: http://localhost:5000
i  Your code has been provided a "firebase-admin" instance.
**i  functions: HTTP trigger initialized at http://localhost:5001/stripmall-0001/us-central1/oauth**

[REQUIRED] Actual behavior

Instead, my front end code is making CORS requests against the deployed functions url. But note, the url is malformed (undefined is in the place where my project id should be). The result is the same whether I deploy the function or not.

Access to fetch at ‘https://us-central1-undefined.cloudfunctions.net/oauth’ from origin ‘http://localhost:5000’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled. app.js:206

Firebase auth is working fine in the front end application. The function is working fine in the shell.

[samtstern]

@rmoskal is this code in your web frontent?

const oauth = Firebase.functions().httpsCallable('oauth')
oauth('foo').then(console.log)

It does not automatically know about the functions emulator. Instead you have to tell it:

Firebase.functions().useFunctionsEmulator('http://localhost:5001') 

[ottob]

Using the code:

getFirebase() // for emulator
      .functions()
      .httpsCallable('myFunction')

Did not work for me. It will then try to access my function with an url like: http://localhost:4002/myproject/us-central1/myFunction The project, host and port is correct here since I called useEmulator() but the region is wrong. The function region should be europe-west3 not us-central1.

And if I try to use the code below, it will not use localhost but will try to access the cloud at https://europe-west3-myproject.cloudfunctions.net/myFunction even if I have called useEmulator.

getFirebase() // for prod
      .app()
      .functions('europe-west3')
      .httpsCallable('myFunction')

The most natural thing would be if the // for prod code above could always be used and that it respected that useEmulator had been called.

My function is defined like this:

functions
  .region('europe-west3').https.onCall(async (data, context) => {

So I can’t see a way to get this working with a custom region right now. ping @samtstern