We currently use the "from hosting urls" method, which means the Firebase config values, including the apiKey, don't need to be included in the code. A few points worth noting:
it is apparently safe to make the Firebase config values public, including the apiKey, I've always tried to keep them from being public anyway as it just seems like good practice
My temporary workaround is to use the "from the cdn" method (which does require the Firebase config values) and not save the changes. I've put the alternative setup in a file (web/cdns_config.html) and added to .gitignore.
PlatformException(google_sign_in, idpiframe_initialization_failed, Not a valid origin for the client: http://localhost:5000 has not been whitelisted for client ID. Please go to https://console.developers.google.com/ and whitelist this origin for your project's client ID.)
Even after setting the port to always be 5000 and whitelisting http://localhost:5000
As far as I can tell there are 2 problems in the way of being able to run and debug the web version locally:
1. firebase setup
There are a few ways to setup firebase in a web project: Add Firebase to your JavaScript project > Setup
We currently use the "from hosting urls" method, which means the Firebase config values, including the apiKey, don't need to be included in the code. A few points worth noting:
My temporary workaround is to use the "from the cdn" method (which does require the Firebase config values) and not save the changes. I've put the alternative setup in a file (
web/cdns_config.html
) and added to.gitignore
.2. whitelisting the domain
Flutter uses a different port every time so we can't whitelist the domain for firebase auth. We can set the port, as described in Flutter Web: Specify Chrome port number? · Issue #1769 · Dart-Code/Dart-Code
But we still get the error:
Even after setting the port to always be 5000 and whitelisting
http://localhost:5000