Web debug token different each time for App Check

[arisAlexis]

I can't make my app work in local host with App Check. Each time the generated debug token is different so I can't add it in the console. The only way I made it work is to add programmatically to index.html the custom debug token I generated like this:
self.FIREBASE_APPCHECK_DEBUG_TOKEN = '186152BD-4BAA-blabla';

is there a way to do this only for development environment? I know we can get the environment from Flutter inside flutter from String.getFromEnrironment but I don't know how I would do this with plain javascript before the app loads?

I read that adding localhost to the recaptcha key is a security breach so I didn't want to go that route.

[abel-123]

Yes, I had the same issue. Hard coding the token into index.html works but feels like a big security risk. For obvious reasons I also don't want to add a new debug token through Firebase console every time I run on localhost.

I was about to post this message end with "there must be a better solution" and then it hit me: The debug token is changing every time because Android Studio changes the port on every run!

Run your app and specify the port to keep using the same debug token.

In index.html:
<script> self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;</script>

When you run the application specify the port:
flutter run -d chrome --web-port=1234

Check the log for the debug token as per the instructions and add it through firebase console. Keep running on the same port to stay using the same debug token.

[abel-123]

a single paragraph about the post above in the firebase documentation would have saved me several hours...
https://firebase.google.com/docs/app-check/flutter/debug-provider

@firebase team, please update the documentation..