I have just set up my app and integrated appcheck and the code looks like

import { initializeApp, getApps } from "firebase/app";
import { getAuth, } from "firebase/auth";
import { getAnalytics } from "firebase/analytics";
import {  getFirestore } from "firebase/firestore";

let app;

if (!getApps().length) {
    app = initializeApp({
        apiKey: process.env.NEXT_PUBLIC_API_KEY,
        authDomain: process.env.NEXT_PUBLIC_AUTH_DOMAIN,
        projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
        storageBucket: process.env.NEXT_PUBLIC_STORAGE_BUCKET,
        databaseURL: process.env.NEXT_PUBLIC_DATABASE_URL,
        messagingSenderId: process.env.NEXT_PUBLIC_MESSAGING_ID,
        appId: process.env.NEXT_PUBLIC_APP_ID,
    });
}
   async function initialize() {
    const { initializeApp } = require("firebase/app");
    const { initializeAppCheck, ReCaptchaV3Provider } = require("firebase/app-check");
  
    const app = initializeApp({
        apiKey: process.env.NEXT_PUBLIC_API_KEY,
        authDomain: process.env.NEXT_PUBLIC_AUTH_DOMAIN,
        projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
        storageBucket: process.env.NEXT_PUBLIC_STORAGE_BUCKET,
        databaseURL: process.env.NEXT_PUBLIC_DATABASE_URL,
        messagingSenderId: process.env.NEXT_PUBLIC_MESSAGING_ID,
        appId: process.env.NEXT_PUBLIC_APP_ID,
    });
    return initializeAppCheck(app, {
      provider: new ReCaptchaV3Provider(process.env.NEXT_PUBLIC_APP_CHECK_KEY),
      isTokenAutoRefreshEnabled: true
    });
  }
  
  if (typeof window !== "undefined") {
    initialize().then((res)=>{
       // console.log(res)
    }).catch((err)=>{
        throw(err)
    })
   
 }


export const auth = getAuth();
export const db = getFirestore();
export default app;

So when i set isTokenAutoRefreshEnabled to true, the error es up and when I set it to false everything works. I am using firebase ^9.9.4 and this gives the above error so I decided to downgrade and use firebase ^9.8.2 since I had set up a different project the same way and there were no errors. In this version, I get the error

FirebaseError: AppCheck: Fetch server returned an HTTP error status. HTTP status: 400. (appCheck/fetch-status-error).
    at exchangeToken

What is this error and how can I fix it

I have just set up my app and integrated appcheck and the code looks like

import { initializeApp, getApps } from "firebase/app";
import { getAuth, } from "firebase/auth";
import { getAnalytics } from "firebase/analytics";
import {  getFirestore } from "firebase/firestore";

let app;

if (!getApps().length) {
    app = initializeApp({
        apiKey: process.env.NEXT_PUBLIC_API_KEY,
        authDomain: process.env.NEXT_PUBLIC_AUTH_DOMAIN,
        projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
        storageBucket: process.env.NEXT_PUBLIC_STORAGE_BUCKET,
        databaseURL: process.env.NEXT_PUBLIC_DATABASE_URL,
        messagingSenderId: process.env.NEXT_PUBLIC_MESSAGING_ID,
        appId: process.env.NEXT_PUBLIC_APP_ID,
    });
}
   async function initialize() {
    const { initializeApp } = require("firebase/app");
    const { initializeAppCheck, ReCaptchaV3Provider } = require("firebase/app-check");
  
    const app = initializeApp({
        apiKey: process.env.NEXT_PUBLIC_API_KEY,
        authDomain: process.env.NEXT_PUBLIC_AUTH_DOMAIN,
        projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
        storageBucket: process.env.NEXT_PUBLIC_STORAGE_BUCKET,
        databaseURL: process.env.NEXT_PUBLIC_DATABASE_URL,
        messagingSenderId: process.env.NEXT_PUBLIC_MESSAGING_ID,
        appId: process.env.NEXT_PUBLIC_APP_ID,
    });
    return initializeAppCheck(app, {
      provider: new ReCaptchaV3Provider(process.env.NEXT_PUBLIC_APP_CHECK_KEY),
      isTokenAutoRefreshEnabled: true
    });
  }
  
  if (typeof window !== "undefined") {
    initialize().then((res)=>{
       // console.log(res)
    }).catch((err)=>{
        throw(err)
    })
   
 }


export const auth = getAuth();
export const db = getFirestore();
export default app;

So when i set isTokenAutoRefreshEnabled to true, the error es up and when I set it to false everything works. I am using firebase ^9.9.4 and this gives the above error so I decided to downgrade and use firebase ^9.8.2 since I had set up a different project the same way and there were no errors. In this version, I get the error

FirebaseError: AppCheck: Fetch server returned an HTTP error status. HTTP status: 400. (appCheck/fetch-status-error).
    at exchangeToken

What is this error and how can I fix it

• javascript
• firebase
• firebase-app-check

• I am facing same issue. To provide more detail, in the network tab, I can see a post call to following path failing with 400 status. content-firebaseappcheck.googleapis./v1/projects/…> . In response, the error says: {"message": "The recaptcha_v3_token cannot be empty.", "status": "INVALID_ARGUMENT" . The request payload is {recaptcha_v3_token: null} – Kartik Narang Commented Mar 18, 2023 at 8:26

2 Answers 2

I am using Nextjs, with Firebase. In my case my error was kind of silly, because I was putting the Public token in the firebase console, instead of putting the secret one.

So what I did was to go to https://www.google./recaptcha/admin

and see the credentials and the proper secret in Firebase Console.

I did a video, may be can help some of you https://youtu.be/Qmdbi0PyeV8

In my case I was using ReCaptchaEnterpriseProvider instead of ReCaptchaV3Provider, make sure your Recaptcha type is correct.