[NEXT]: new framework with app router is unaccessible after deployment to firebase/cloud-functions

[RichardIvan]

[REQUIRED] Environment info

global firebase v - 11.30.0

Repository is using pnpm. The next app is within a workspace.

project firebase "firebase": "^9.22.0", "firebase-tools": "^12.1.0"

firebase config

{
  "hosting": {
    "source": "./",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "frameworksBackend": {
      "region": "europe-west1",
      "cpu": 1,
      "maxInstances": 1,
      "invoker": "public",
      "cors": true,
      "ingressSettings": "ALLOW_ALL"
    }
  }
}

firebase-tools:

Platform: macOS

[REQUIRED] Test case

N/A

[REQUIRED] Steps to reproduce

firebase deploy of the frameworks enabled nextjs app

[REQUIRED] Expected behavior

example.com/api/endpoint does not throw 500, Invariant: failed to start render worker Error: listen EADDRNOTAVAIL: address not available

[REQUIRED] Actual behavior

Local, emulator works as expected including nextjs /app/api/* function Deployment is successful and the Nextjs framework app.

When deployed, GET request function works as expected. When trying to access POST request, we see a failure even if the functions are the same - basically trying to return 200 status with empty object.

Requesting POST API endpoint fails with 500. "Invariant: failed to start render worker Error: listen EADDRNOTAVAIL: address not available" Logs in GCP don't provide much of additional information.

[justinh00k]

I am also getting this error on the cloud function of my NextJs firebase hosting app. Invariant: failed to start render worker Error: listen EADDRNOTAVAIL: address not available 199.36.158.100

[rchaz]

I'm hitting the same error

[rchaz]

Error on the SSR function deployment post upgrade to nextjs13 app router -

Invariant: failed to start render worker Error: listen EADDRNOTAVAIL: address not available 199.36.158.100 at Server.setupListenHandle [as _listen2] (node:net:1723:21) at listenInCluster (node:net:1788:12) at GetAddrInfoReqWrap.doListen [as callback] (node:net:1937:7) at GetAddrInfoReqWrap.onlookup [as oncomplete] (node:dns:109:8) { code: 'EADDRNOTAVAIL', errno: -99, syscall: 'listen', address: '199.36.158.100' } Container called exit(1). Error: Process exited with code 1 at process. (/layers/google.nodejs.functions-framework/functions-framework/node_modules/@google-cloud/functions-framework/build/src/invoker.js:92:22)

[slecoustre]

The crash of the function appeared with the next version 13.4.3 only on firebase in local it works very well

but the problem for POST, PUT ... APIs with a Body appeared since next 13.3. it works if you don't use the emulator but if you use the emulator or deployer it doesn't work 500

[justinh00k]

Looks like same as https://github.com/vercel/next.js/issues/49777. I was able to workaround by reverting to next 13.3.4, which also meant I had to add experimental.appDir : true to next.config.mjs and __NEXT_PRIVATE_PREBUNDLED_REACT="next" (with two underscores) to my .env.

[slecoustre-vulog]

With version 13.4.2, the site works well on firebase but the problem on Route Handlers persists for methods other than GET

[ameddin73]

This is a major blocker, any progress on this?

[slecoustre-vulog]

The bug is still present in the latest version 13.4.4 😔

[michaelangeloio]

Any updates?

[michaelangeloio]

The above PR resolved the issue for me @slecoustre @ameddin73 @rchaz @justinh00k

[slecoustre-vulog]

@michaelangrivera Thanks.

Some developers have the same problem on AWS.

I think the problem is with Nextjs.

[DhruvRaiPuri]

The above PR resolved the issue for me @slecoustre @ameddin73 @rchaz @justinh00k

@michaelangrivera please help by explaining how the above PR helped you solve the issue? I tried editing cloud run service's environment variables to add hostname as 0.0.0.0 but the service did not get deployed after editing it. Did you try any other way to set the hostname?

[ameddin73]

@DhruvRaiPuri I tried the same thing as you and it did not resolve the issue. It's still an open bug for me.

[leoortizz]

seems like this Next.js change on the custom server is the cause: https://github.com/vercel/next.js/pull/49805.

As the custom server running on Firebase is not using the customServer: false option, this whole block is running instead: https://github.com/vercel/next.js/pull/49805/files#diff-7550a61853cf6a2d455d1613bd428eb42c6fc2057ce87e8ba7adab4094abcb6eR264

Setting customSever to false seems to fix some cases and break others

[ameddin73]

Is there any workaround while we wait for firebase support?

[slecoustre-vulog]

@ameddin73 I think the problem needs to be solved by the NextJs team.

My solution is to fix the version to 13.4.2

[DhruvRaiPuri]

@slecoustre-vulog Thanks, it worked. Cloud Run starts working if we use Next 13.4.2 CC: @ameddin73

[mrnguyentrantam]

After struggling a few days I found this thread. Thanks, guys. Downgrade to 13.4.2 worked for me as well

[davebrewer]

Same, downgrade to "next": "13.4.2", worked.

[rchaz]

Firebase's support is quite disappointing. Personally, I grew tired of the constant back and forth and the waiting game for Firebase to keep up with the latest development trends. That's why I made the decision to switch my stack to Vercel and Supabase. It did take about two weeks, especially considering the need to migrate production data, but the relief I felt was worth it. The difference is remarkable, with significantly reduced development overhead and app latency. [App: b7labs.co]

[100tomtomas100]

Downgraded to next 13.4.2 it just changed an error from 500 to 502. Are there any other ways to fix this issue ?

Edit

Moved from Firebase to Vercel all is working like it should :)

[alexastrum]

Fixed in https://www.npmjs.com/package/firebase-frameworks/v/0.10.4