I’m using firebase functions like so…
exports.sendLicenseAgain = onCall({
enforceAppCheck: true,
consumeAppCheckToken: true,
}, async (req) => {
...
})
and i have this in my angular 17 front end code
import { getFunctions, httpsCallable } from 'firebase/functions';
import { AppCheck, getToken } from '@angular/fire/app-check';
....
...
getToken(this.appCheck).then((token) => {
const funcs = getFunctions();
const sendFunc= httpsCallable(funcs, "sendLicenseAgain", { limitedUseAppCheckTokens: true })
sendFunc({ ... })
I get error status 401 because i haven’t included the appcheck token. I know I’m supposed to put the token in the headers with ‘X-Firebase-AppCheck’ in the http request, but I can’t find a way to do that with the httpsCallable funciton. Am I missing something?
EDIT: more info on my implementation:
in app.config.ts:
importProvidersFrom(provideAppCheck(() => {
const provider = new ReCaptchaV3Provider("...");
return initializeAppCheck(undefined, { provider, isTokenAutoRefreshEnabled: true });
})),
in app.component.ts (because im in a local host env)
constructor(){
(<any>window).FIREBASE_APPCHECK_DEBUG_TOKEN = true;
}
2
Answers
UPDATE: I removed replay protection code from firebase functions and my web app and now it works.
Specifically I removed from the function's index.js:
And i removed from my web app's httpsCallable invocation:
based on no evidence, I'm thinking the error come from using the debug token with the replay protection.
You can’t control the HTTP headers for a callable function if you’re using the Firebase client library to make the call. In cases where you must absolutely be able to set headers, you can no longer use the Firebase client library to make the request.
See:
To use App Check with callable type functions, you don’t have to do anything with headers, because the library handles the header for you, as long as you configure the function and the calling code correctly. Please see the documentation for details. You don’t have to do anything else other than what’s shown.