Support On-Demand Firebase SDK Auto-configuration

[seanlail]

Not sure if this is even possible with AngularFire2, but this was just released:

https://firebase.googleblog.com/2017/04/easier-configuration-for-firebase-on-web.html?m=1

At first glance it seems that the init would need to be able to support this new feature from Firebase.

[davideast]

@seanlail It's actually in the RC0 API which is checked in at master, but not yet released. I plan on doing a next tag release soon. See issue #854 for more details. This isn't actually a new feature it was released sometime back in November and we're just making more noise about it now.

[davideast]

Apologies, I thought you were referring to the module bundling splitting, import 'firebase/auth';

I'll have to give it a think of how we'd do it, but it would be awesome.

[Maistho]

I solved it with a (admittedly pretty ugly) workaround:

In your index.html add the following lines before the end of the body tag (or in the head, doesn't really matter as long as they execute before the webpack bundles)

<script>
  window.firebase = { initializeApp: function(credentials) { window.firebaseCredentials = credentials} };
</script>
<script src="/__/firebase/init.js"></script>
<script>
  window.firebase = undefined;
</script>

This will save the credentials needed to initialize firebase to window.firebaseCredentials, so that we can use them when initializing the app.

Then add the saved credentials to your app.module.ts imports:

AngularFireModule.initializeApp((window as any).firebaseCredentials)

Maybe something that could be added to the docs?

[hiepxanh]

hello, any update on this?

[jamesdaniels]

No update, happy to accept a PR; which is why I left this open. Continue configuring normally for now.

[Maistho]

I've been looking at where to possibly inject this in a way that is easy for users. I'd like it if it was an option to the initializeApp() call, but I don't think that it's possible without changes to the firebase SDK.
The SDK assumes that the config is provided synchronously, but if Angularfire is to be responsible for loading the config asynchronously it's not possible to do in a clean way.

I think that my solution posted above is a good fit for users who want to do this, and could probably be added (with some changes for clarity) to the docs.

It will however slow down the loading of the app slightly (one more non-deferred network request) so I don't think it should be the default/preferred way of doing it.

TL:DR; I don't think this is possible in a user-friendly way without changes to the firebase SDK to allow loading config async.

[jamesdaniels]

Further, I don't think we can handle this easily with Angular Universal. I'm going to think on this more and will reconsider in the future. Closing for now.

[LeonardoRick]

Any updates here? I think This is a huge update on security and I think we should discuss better on alternatives if it's not possible to implement

@Maistho, what it credentials on this case? I tried your solution but couldn't make it work