How to hide API Keys with Angular 8/9?

Viewed 983

I'm trying to call the Firebase API. To call this API, we need to specify a user config key. How can I hide this key in my code? I have no idea how to do.

If I use the environment.ts file, after build, those keys are exposing in the main.js file.

main.js Keys Exposed

Is there any way to avoid the exposure of these keys in main.js file?

1 Answers

Firebase is designed such a way that you do not have to hide these keys.

Please refer to doc here and extract below:

Unlike how API keys are typically used, API keys for Firebase services are not used to control access to backend resources; that can only be done with Firebase Security Rules. Usually, you need to fastidiously guard API keys (for example, by using a vault service or setting the keys as environment variables); however, API keys for Firebase services are ok to include in code or checked-in config files.

Related