Calling Firebase function from Node.js results in FirebaseError: internal

[matallui]

Operating System

macOS

Browser Version

Arc

Firebase SDK Version

10.4.0

Firebase SDK Product:

Functions

Describe your project's tooling

Next.js 13 (app router) with RSC.
The goal is to be able to call a firebase functions from both client and server components.

Describe the problem

I'm trying to setup a Next.js 13 (app router) application in a way that I could call a callable Firebase function from both client and server components.

When called from a client component (aka browser) everything seems to work fine.
However, when called from a server component (aka Node.js) I get an internal error with the code functions/internal.

Steps and code to reproduce issue

In order to reproduce this issue, all you have to do is run the following code in Node.js:

import { getApp, getApps, initializeApp } from "firebase/app";
import {
  connectFunctionsEmulator,
  getFunctions,
  httpsCallable,
} from "firebase/functions";

const firebaseConfig = {
  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
  authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
  projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
};

const app = !getApps().length ? initializeApp(firebaseConfig) : getApp();

const functions = getFunctions(app);
connectFunctionsEmulator(functions, "localhost", 5001);

const helloWorld = httpsCallable(functions, "helloWorld", {
  timeout: 1000,
});

console.log("Calling helloWorld function...");

const res = await helloWorld();
console.log(res.data);

You'd have to replace the environment variables with your own, as well as make sure the helloWorld() function is defined as a callable Firebase function:

import * as logger from "firebase-functions/logger";
import { onCall } from "firebase-functions/v2/https";

export const helloWorld = onCall((_req) => {
  logger.info("Hello logs!", { structuredData: true });
  return {
    message: "Hello from Firebase!",
  };
});

[google-oss-bot]

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

[matallui]

Turns out I was using Node.js 18 and it doesn't seem to be supported.

Once I switched to Node.js 16, it started working.

[hsubox76]

Actually the SDK is supposed to work in a Node 18 environment and if it doesn't, it's a bug.

We do have separate Node and browser bundles for the functions package, and which one you get depends on the module resolution in your bundler config (e.g. mainFields or conditions). Do you know what your bundler config is? Are you using the default Next config?

The difference between the two bundles is that the Node bundle polyfills fetch with node-fetch, because Node did not have a native fetch method until 18. I'm guessing either the absence or presence of node-fetch is causing the issue.

[matallui]

@hsubox76 thanks for reopening this! It does indeed seem like a bug if that's the case.

I'm running Next.js 13.4 and the code was failing on a React server component (which is running in Node).

Literally changing Node from v18 to v16 (via nvm in terminal) and rerunning next dev fixed the issue.

Not sure I'm answering all your questions, but if there's anything else I can do to help triage this, I'm happy to help.

[hsubox76]

May be related to #7280 but I don't think it's the same exact issue. This is a runtime error calling fetch and the other seems to be a compile-time error.

[matallui]

I agree! I also ran into this issue by running the code in the description outside of Next.js, so this isn't Next related.

[hsubox76]

I realized I completely missed that you were using the functions emulator. Do you still have this problem if you don't use the emulator, but a live function instead?

It seems to have issues for me if using the emulator, with Node 18, but works fine live. Seems to be an emulators/Node 18 compatibility issue.

I looked through the firebase-tools repo (the repo that includes the emulators runners) and I found this (related to the Firestore emulator, but it's similar, as it's making a http call): firebase/firebase-tools#5755 (comment)

I tried it and I think it seems to work?

import * as dns from 'dns';
dns.setDefaultResultOrder('ipv4first');

dns is a native node module so this should work fine in a plain node file but I'm not sure if you can use it in a React Server Component? Can you?

If not, I think it might be worth adding a comment to that issue or creating a new one in the firebase-tools repo.

[matallui]

@hsubox76 that's a great find! I'm not far enough in the project to even test the deployed functions, hence why I didn't catch this. Also, I just tried reverting to using Node.js v18 again and it now worked. I think it's because I'm using 127.0.0.1 instead of localhost, as mentioned in the issue you linked.

Not sure how you want to proceed with this, but I might be okay with it as it is for now, will just make a note that we need to set up the emulator host as 127.0.0.1.

If I encounter any other issues down the road I'll let you know.

[hsubox76]

I don't think there's anything we can do on our end, emulators issues need to be resolved in firebase-tools. If you have any suggestions for that fix, you can add it in that issue (firebase/firebase-tools#5755 (comment)).

I'll close this issue but thanks for the temporary workaround to explicitly use 127.0.0.1, hopefully that helps anyone who comes by searching for the same issue.

[matallui]

Sounds good! I've talked to Firebase support and they said the firebase-tools team will work on a fix.
Thanks again for all the help!!!