Protect Firebase Secret in javascript

Question

I have created simple firebase chat system using pure javascript , Everything is working fine , But I have below code in javascript open to everyone.

  var config = {
    apiKey: "AIzaSyD0Bm91234567678srKwjUGrpu35dgIIE",
    authDomain: "example-26847.firebaseapp.com",
    databaseURL: "https://example-26847.firebaseio.com",
    projectId: "example-26847",
    storageBucket: "example-26847.appspot.com",
    messagingSenderId: "937123954572"
  };

But I feel like this is vulnerable to hacking , How do i protect it , I have only php web server.

Answer 1

You don't have much choice.

Accessing it via JS

You actually need those keys in your javascript based app, so they will be in it one way or another. I don't think it expose much risk, you can still add some rules to only let read/write access to firestore based on apikeys/tokens you'll generate.
Another solution would be to get those ids from your server via an ajax/XHR request & store them locally in some private browser based storage.

VCS

Keeping those ids locally wihtout being commited to a VCS is easy (.gitignore for example with a .example)

Also, you don't need all of them, storageBucket only for storing file in GCP Storage, messagingSenderId for push notification.