Decoding Firebase ID token failed - reactjs

Question

I am trying to restrict my API to only logged users. To do so I am sending firebase token and trying to verify it on server-side exactly how Google says to do.
However, I get an exception like this:
FirebaseAuthError: Decoding Firebase ID token failed. Make sure you passed the entire string JWT which represents an ID token. See https://firebase.google.com/docs/auth/admin/verify-id-tokens for details on how to retrieve an ID token.
Printing out those tokens on client-side as well as on server-side proves that on both sides they are identical.
Do I miss something?
My code:
const checkAuth = (token) => {
if (token === undefined) return false;
console.log(token);
admin
.auth()
.verifyIdToken(token)
.then((decodedToken) => {
const uid = decodedToken.uid;
admin
.auth()
.getUser(uid)
.then(() => {
return true;
})
.catch(() => {
return false;
});
})
.catch((error) => console.log(error));
};
// example usage
app.get("/fileslist/:id", async function (req, res) {
const authorized = checkAuth(req.headers.token);
if (authorized) {
const directoryPath = path.join(__dirname, "uploads/" + req.params.id);
fs.readdir(directoryPath, function (err, files) {
var array = [];
if (err) {
return console.log("Unable to scan directory: " + err);
}
files.forEach(function (file) {
array.push(file);
});
res.status(200).send(array);
});
} else {
res.status(403).send();
}
});
And client-side:
//getting token
const getToken = () => {
currentUser
.getIdToken(true)
.then(function (idToken) {
setToken(idToken);
})
.catch((error) => {
console.log(error);
});
};
//calling an api
const getFilesById = async (id, token) => {
console.log(token);
return await client.get(
"/fileslist/" + id,
{},
{ headers: { token: token } }
);
};
//api definition
import { create } from "apisauce";
const api = create({
baseURL: "http://localhost:3005",
});
export default api;

Answer 1

You need to return the entire Promises chain in the checkAuth() function, as follows:
const checkAuth = (token) => {
if (token === undefined) return false;
console.log(token);
return admin // <== see return
.auth()
.verifyIdToken(token)
.then((decodedToken) => {
const uid = decodedToken.uid;
return admin // <== see return
.auth()
.getUser(uid)
.then(() => {
return true;
})
.catch(() => {
return false;
});
})
.catch((error) => console.log(error));
};
You could actually have only one catch block, as follows:
const checkAuth = (token) => {
if (token === undefined) return false;
console.log(token);
return admin // <== see return
.auth()
.verifyIdToken(token)
.then((decodedToken) => {
const uid = decodedToken.uid;
return admin // <== see return
.auth()
.getUser(uid);
})
.then(() => {
return true;
})
.catch((error) => {
console.log(error);
return false;
});
};