I want to use Firebase App Check in Gatsby Project.I have pleted the App registration in the Firebase console.
In my project:
import { initializeApp } from "firebase/app";
import { initializeAppCheck, ReCaptchaV3Provider, getToken } from "firebase/app-check";
const app = initializeApp({
// My firebase configuration object
});
const appCheck = initializeAppCheck(app, {
provider: new ReCaptchaV3Provider('MY_RECAPTCHA_PUBLIC_KEY'),
isTokenAutoRefreshEnabled: true
});
getToken(appCheck)
.then(() => {
console.log('success')
})
.catch((error) => {
console.log(error.message)
})
But, it not working and got the error:
@firebase/app-check: FirebaseError: AppCheck: Fetch server returned an HTTP error status. HTTP status: 403. (appCheck/fetch-status-error).
So, can anyone help me check where the problem is? How to solve?
Thanks!
I want to use Firebase App Check in Gatsby Project.I have pleted the App registration in the Firebase console.
In my project:
import { initializeApp } from "firebase/app";
import { initializeAppCheck, ReCaptchaV3Provider, getToken } from "firebase/app-check";
const app = initializeApp({
// My firebase configuration object
});
const appCheck = initializeAppCheck(app, {
provider: new ReCaptchaV3Provider('MY_RECAPTCHA_PUBLIC_KEY'),
isTokenAutoRefreshEnabled: true
});
getToken(appCheck)
.then(() => {
console.log('success')
})
.catch((error) => {
console.log(error.message)
})
But, it not working and got the error:
@firebase/app-check: FirebaseError: AppCheck: Fetch server returned an HTTP error status. HTTP status: 403. (appCheck/fetch-status-error).
So, can anyone help me check where the problem is? How to solve?
Thanks!
Share Improve this question edited Oct 11, 2021 at 6:50 Doug Stevenson 318k36 gold badges454 silver badges472 bronze badges Recognized by Google Cloud Collective asked Oct 11, 2021 at 6:00 85Ryan85Ryan 1352 silver badges8 bronze badges5 Answers
Reset to default 9Do NOT add localhost to ReCaptcha's accepted domains. The Google Firebase docs are clear you SHOULD NOT add localhost to the allowed domains like @uponly suggested ref: https://firebase.google./docs/app-check/web/debug-provider?authuser=0&hl=en#web-version-9
Use the steps more clearly outlined in the "Use the debug provider on localhost" section here
TLDR;
- Set
window.FIREBASE_APPCHECK_DEBUG_TOKEN=true
right before you callinitializeAppCheck
to tell your code to request a debug token - Open the console in the web browser of your app and get the token printed there following the printed prompt
AppCheck debug token:
- Go to the Firebase Console web portal and navigate to Project Settings -> App Check. Click on the three dots at the end of the row for the app you're setting AppCheck up for and add the debug token in the popup.
Go to your Firebase Project in Google Cloud Console: https://console.cloud.google./apis/credentials
Click on the name of your Firebase API Key under "API Keys".
"API restrictions"
If you are restricting use of your API key, make sure you include:
Selected APIs: Firebase App Check API
I had a similar issue. For me, the error got resolved when I used the correct appId in the firebase config. It turns out that I had set up two apps on firebase and I downloaded the wrong json file which had a different appId.
According to firebase support, appIds are unique per app.
Adding onto @jprio's answer:
If you are using an unrestricted API key and using ReCaptchaEnterprise, you must make sure that you correctly have the appropriate domains set for your Recaptcha Enterprise Site Key.
- In the Google Cloud console, go to Security, then reCAPTCHA Enterprise: https://console.cloud.google./security/recaptcha
- Click on the three dots and press "Edit Key" on your generated key
- Under Domain List, enter in the domain of your website, no need to add any HTTP/HTTPS/WWW prefixes, or port numbers.
- If you are developing locally, be sure to add localhost/127.0.0.1. This is what solved the issue for me. Save changes. DO NOT FORGET to remove these before you deploy to your website
- Hit refresh on your client after about 5 minutes, allowing for the changes to propagate. Be sure you are using ReCaptchaEnterpriseProvider in your client if you are using ReCaptcha Enterprise.
2024
For me the solution was to add all the Firebase config properties. The appId
is totally crucial for App Check to work.
Regarding @uponly's answer: never add localhost
to your allowed domains list! Just read the docs for how to handle local development with App Check!
Link: https://firebase.google./docs/app-check/web/debug-provider#localhost