Search code examples
firebasefirebase-app-check

I'm not getting Debug Token when using AppCheck in a web Local development

I decided to include AppCheck to my Project. I'm implementing this in a web-app with Quasar V2. Quasar offers me some environment variables depending on I'm in development, production or debugging (It's like production but with a --debug flag).

I have two projects at Firebase console for this product that I'm building. One corresponds to my Testing and the other with Production enviroments. Note that I'm using GitHub actions that fires a deployment to Firebase Hosting when a new PR is made in a certain branch. This was generated by firebase-cli.

Lastly, I have my local development.It uses Firebase Services in Emulators.

My problem is that I'm not getting the Debug Token in my browser console. This is the client's file where I configure Firebase depending on the environment it runs.

/src/boot/firebase.js

import { boot } from 'quasar/wrappers'
import firebase from 'firebase/app'
import 'firebase/app-check'
import 'firebase/functions'
import 'firebase/auth'
import 'firebase/firestore'
import 'firebase/storage'

const firebaseConfigTesting = {
  apiKey: '----------------------------',
  authDomain: '-----------------------',
  projectId: '-------------------------',
  storageBucket: '-----------------',
  messagingSenderId: '------------------',
  appId: '--------------------------',
  measurementId: '-------------------'
}

let app = null
if (process.env.DEBUGGING || process.env.DEV) {
  app = firebase.initializeApp(firebaseConfigTesting)
  console.log('DEBUGGING || DEV -> app configurada con proyecto testing')
} else if (process.env.PROD) {
  // TODO: Poner config del proyecto firebase de producción.
  app = firebase.initializeApp(firebaseConfigTesting)
}
const appCheck = firebase.appCheck()
const functions = firebase.app().functions('southamerica-east1')
const auth = firebase.auth()
const db = firebase.firestore()
const storage = firebase.storage()

// When running quasar dev, use Emulators.
if (process.env.DEV) {
  functions.useEmulator('localhost', 5001)
  auth.useEmulator('http://localhost:9099', { disableWarnings: true })
  db.useEmulator('localhost', 9095)
  storage.useEmulator('localhost', 9199)
  self.FIREBASE_APPCHECK_DEBUG_TOKEN = true
  console.log('#======= Corriendo Emuladores =======#')
}

/*  App check
*   Cada ambiente tiene su Key. En desarrollo, usar debugger token.
* */
if (process.env.DEBUGGING || process.env.DEV) {
  // Enabling AppCheck both in local develoment (DEV) and in Testing enviroment (DEBUGGING)
  appCheck.activate('----------------', true)
} else if (process.env.PROD) {
  // TODO Create AppCheck in production. 
}

export default boot((/* { app, router, ... } */) => {
})
export {
  app,
  functions,
  auth,
  db,
  storage
}

In the docs (app-check debug provider) They've an example that uses a function called initializeAppCheck. That function isn't available in my SDK. Is this a built in function that is in the Firebase SDK, or it's just a utility function that they use in the docs?

Finally, I'm not getting any error. It works fine, but I'm not getting the AppCheck debug token.

Have a nice day!

Solution

  • First of all, initializeAppCheck() is only available in the latest version of the API, v9+. It looks like you're using an older version of the API, where everything is based on the firebase namespace (for example, firebase.appCheck()) whereas in the newer version you would import all functions individually.

    So you have two solutions. The easiest would be to upgrade to v9. Here's a migration guide if you need help doing that. If you don't want to change too much code, try using the compat version of v9 (described in that guide), which allows you to use the same APIs as v8. Whether you are using the modular or compat version of v9, it initializes debug mode during App Check initialization, allowing you to set self.FIREBASE_APPCHECK_DEBUG_TOKEN in your code as you're currently doing. (In the compat version it must be set before calling firebase.appCheck.activate(). In the modular version it must be set before calling initializeAppCheck().)

    If you are unable to migrate to v9 at this time, the v8 App Check SDK actually checks for the debug variable when the App Check package is imported, not when App Check is initialized (firebase.appCheck()). That means setting it anywhere in the code is too late. So when users were using v8, we recommended they set self.FIREBASE_APPCHECK_DEBUG_TOKEN in a <script> tag in their index.html page before the main code bundle is loaded. If this is too difficult to do with your build environment, I would suggest upgrading to v9. If you use compat it should require very minimal code changes (just changing import patterns from firebase/firestore, etc. to firebase/compat/firestore).