How to set "Access-Control-Allow-Credentials" in Firebase hosting - reactjs

Question

I've set up a Node Express application in Firebase Functions, and a React app in Firebase Hosting (similar to the template I built, with the exception that I've configured session cookies in express and I'm using Passport JS).
My firebase.json contains the following:
{
"hosting": {
"public": "build",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "/api/**",
"function": "app"
}
]
}
}
If I make a direct fetch request from the React app to the API using the full absolute API url, everything works hunky dory:
try {
const url = 'https://us-central1-[my-app-name]-app.cloudfunctions.net/app/api/v1.0/auth/status';
const response = await fetch(url,
{
method: 'GET',
credentials: 'include',
headers: {
'Content-Type': 'application/json',
},
}
);
json = await response.json();
console.log(json); // {"isAuthenticated":true}
} catch (error) {
throw error;
}
The API checks for the existence of a user in session and returns a response accordingly.
However, if I attempt to access the API through the rewrites proxy I've configured in the firebase.json file, using just the relative url /api/v1.0/auth/status then I still get a response (which confirms Firebase proxies the request appropriately), but the isAuthenticated flag is set to false, rather than true.
I assumed that this is because the proxied request is missing my valuable 'withCredentials' header, so I set this in the firebase.json file too:
{
"hosting": {
"public": "build",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "/api/**",
"function": "app"
}
],
"headers": [
{
"source": "/api/**",
"headers": [
{
"key": "Access-Control-Allow-Credentials",
"value": "true"
},
{
"key": "Content-Type",
"value": "application/json"
}
]
}
]
}
}
However, this appears to have no effect. Is there something I'm missing?
Edit: On closer inspection I believe it's because the cookie header isn't being passed onto the functions app when Firebase proxies the request (the 'credentials' headers shouldn't be required as it's not cross-origin), so I believe there must be some way to tell Firebase to include cookies in the rewrite/proxied request?

Answer 1

You can include this code in your express configuration.
This would solve cors problem
// allow-cors
app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');
next();
});