Dynamic content functions redirect in emulators to :5001 port instead of :5000

[chrisjacobs91]

[REQUIRED] Environment info

firebase-tools: 9.1.0

Platform: macOS

[REQUIRED] Test case

• Setup serving dynamic content with firebase hosting as per firebase documentation (using Express).
• Trigger a function by navigating in browser to localhost:5000/test
• Return res.redirect("/destination") at in the express function
• User navigated to localhost:5001/destination
• User gets 404 error (expected for localhost:5001/destination as nothing is there)

[REQUIRED] Steps to reproduce

See above

[REQUIRED] Expected behavior

Expect the redirect to use the :5000 port to navigate the user to: localhost:5000/destination
NOTE - when deployed to live, this redirect works fine. Only when operating in the emulator do the ports seem to get muddled up.

[REQUIRED] Actual behavior

Redirects to localhost:5001/destination.

I understand this is because the functions emulator is running at :5001, however production redirects to the hosting path without any issues.

Is there either a fix to be done to the emulator, or a way I can tell express to use :5000 port instead of :5001 ?

[google-oss-bot]

This issue does not seem to follow the issue template. Make sure you provide all the required information.

[kmcnellis]

Could you provide the steps to reproduce this?

When I try to reproduce, it works as expected (I'm being redirected to localhost:5000/destination)

[chrisjacobs91]

@kmcnellis will try my best!

This is my firebase.json:

As you can see, I'm matching /user/ path to the express function.
And functions are on port 5001 and hosting is 5000.

{
  "functions": {
    "predeploy": [
      "npm --prefix \"$RESOURCE_DIR\" run lint",
      "npm --prefix \"$RESOURCE_DIR\" run build"
    ],
    "source": "functions",
    "ignore": []
  },
  "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "public",
    "redirects": [
      {
        "source": "/{blog,wp,wp-admin,voyage,user,login}",
        "destination": "/",
        "type": 301
      }
    ],
    "rewrites": [
      {
        "source": "/voyage/*",
        "function": "express"
      },
      {
        "source": "/user/*",
        "function": "express"
      },
      {
        "regex": "^[/][a-z0-9_-]{1,15}$",
        "function": "express"
      }
    ],
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "headers": [
      {
        "source": "/**",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=300"
          }
        ]
      },
      {
        "source": "**/*.@(jpg|jpeg|gif|png|svg|webp|eot|otf|ttf|ttc|woff|woff2|font.css)",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=600"
          }
        ]
      }
    ]
  },
  "storage": {
    "rules": "storage.rules"
  },
  "emulators": {
    "functions": {
      "port": 5001
    },
    "firestore": {
      "port": 8080
    },
    "hosting": {
      "port": 5000,
      "host": "0.0.0.0"
    },
    "ui": {
      "enabled": true
    },
    "auth": {
      "port": 9099
    }
  }
}

This is the express function that gets called.

It's in the index.ts file in my functions. You can see that I redirect to either / (if no matching doc found) or /${username} if a matching doc is found.

app.get('/user/:uid', async(req:any, res:any) => {
  console.log(`user function`)
  res.set('Cache-Control', 'public, max-age=600, s-maxage=600');

  const user = req.params.uid

  if(user) {
    console.log(`Attempting profile redirect:`, user);

    const usernameSnapshot = await admin.firestore().collection('usernames').where('owner', '==', user).limit(1).get()
    
    if(usernameSnapshot.size) {
      const docs = usernameSnapshot.docs
      const username = docs[0].id
      console.log(`Redirecting profile ${user} to ${username}`)

      res.redirect(`/${username}`)
    
    } else res.redirect("/")


  } else {
    res.redirect("/")
  }
});

Steps to reproduce:

1. Navigate to localhost:5000/user/abc (no matching doc)
2. Get redirected to localhost:5001/

or

1. Navigate to localhost:5000/user/123 (matching doc)
2. Redirected to localhost:5001/chris ('chris' is the username of that matching doc)

Either option results in obviously the wrong path and a 'Not Found' message is displayed.

[kmcnellis]

Ah, interesting. This is a regression that started after v8.16.2

[kmcnellis]

@bkendall Looks like you did a big change in the hosting emulator in v8.17. Could you take a look at this?

[bkendall]

Alright, I'm digging into this, and I'm just mad at code now.

The function itself is doing the right thing:

bkend-macbookpro2:~ » curl -I http://localhost:5001/bkend-test-stuff/us-central1/helloWorld
HTTP/1.1 302 Found
x-powered-by: Express
location: /somewhereelse

And then I try to make the request through the Hosting emulator:

bkend-macbookpro2:~ » curl -I http://localhost:5000/start
HTTP/1.1 302 Found
x-powered-by: Express
location: http://localhost:5001/somewhereelse

Wut? WHY IS THAT LOCATION HEADER CHANGED? WHAT IS HAPPENING? WHO DONE THIS?

...

...

...

I'm working on it.