Home / Questions / 137881
Accepted
A. Cedano
Asked: 2020-02-13 05:09:33 +0800 CST 2020-02-13 05:09:33 +0800 CST

Is it dangerous to expose my Firebase API KEY in web project with Javascript SDK? How could he protect her?

  • 772

This is the code that tells Firebase to configure a Web App that can read data from the Real Time Database with the Javascript SDK:

  // Set the configuration for your app
  // TODO: Replace with your project's config object
  var config = {
    apiKey: "apiKey",
    authDomain: "projectId.firebaseapp.com",
    databaseURL: "https://databaseName.firebaseio.com",
    storageBucket: "bucket.appspot.com"
  };
  firebase.initializeApp(config);

  // Get a reference to the database service
  var database = firebase.database();

I would like to do a implementation on a website with shared hosting. I have tested the code with my data and it works.

But as you can see, the APIKEYproject and database URL would be exposed on the client .

  • This is dangerous? What possible dangers could there be?
  • Is there any way to avoid it? (I would have to use the Javascript SDK, I don't know how to use Node or the like and I want to display the data on a normal web page that already exists in Wordpress. I could do it with PHP, but I didn't find anything about PHP on Firebase.)
firebase

1 Answers

  1. Best Answer

    The danger that it can have is that if your API is visible, anyone could copy it and use it to make requests and reach your limit (which would imply that the requests would stop working or you would be billed, depending on the type of service you are using). have).

    If it's a private project, you can (should) include in the contract that all the code (including API keys) belongs to you and cannot be used by the client. Although that is not so simple when it is an application open to the Internet.

    To prevent this key theft, many APIs (such as those of Google or Facebook) allow you to restrict access to a series of domains. So if you try to access the API outside the indicated host, the request will be rejected.

    In Google (the case of Firebase that you indicate) you can restrict HTTP referrers so that only requests from certain domains are allowed. The steps to follow to create a restricted API would be the following:

    1. Go to the Google Developer Console .
    2. Click on Credentials enter image description here
    3. Optional: If you don't have a project, you must create one.
    4. Click on the "Create Credentials" button and select "API Key" enter image description here
    5. Click on "Restrict Password"
    6. In the menu that appears on the next page, select the "HTTP Referrers" option: enter image description here
    7. In the text box below, enter the domains you want to have access to your API key (you can use "regular expressions" to include multiple domains/subdomains)
    8. Click on Save

    Now only the domains specified in the list will have access to your API key.

    You can leave the text box empty to have no restrictions while you're developing and testing your app, but it's important to add a list of domains before moving the app to production.

    • 5