Firebase Fix 403 Requests From Referrer Are Blocked Error
When setting up a new or existing Firebase Web App on a new domain (or subdomain), you may encounter errors (shown below) where most of them talk about requests being blocked by the referrer which is yoursite.com
or sub.yoursite.com
.
Errors
Errors or warnings of the following kind may be seen or observed.
Firebase config instantiation error:
FirebaseError: Installations: Create Installation request failed with error "403 PERMISSION_DENIED: Requests from referer [yoursite.com] are blocked.
Firebase Measurement ID fetch failed error:
@firebase/analytics: Failed to fetch this Firebase app's measurement ID from the server...
Measurement ID/Analytics related warning:
[Analytics: Dynamic config fetch failed: [403] Requests from referer [yoursite.com] are blocked. (analytics/config-fetch-failed).]
403 POST responses to identitytoolkit.googleapis.com
API calls, for instance:
POST https://identitytoolkit.googleapis.com/v1/accounts:signInWithCustomToken?key=YOUR_API_KEY
PAYLOAD {"token": ..., "returnSecureToken": true}
{
"error": {
"code": 403,
"message": "Requests from referer [yoursite.com] are blocked.",
"errors": [
{
"message": "Requests from referer [yoursite.com] are blocked.",
"domain": "global",
"reason": "forbidden"
}
],
"status": "PERMISSION_DENIED",
"details": [
{
"@type": "type.googleapis.com/google.rpc.ErrorInfo",
"reason": "API_KEY_HTTP_REFERRER_BLOCKED",
"domain": "googleapis.com",
"metadata": {
"consumer": "projects/...",
"service": "identitytoolkit.googleapis.com"
}
}
]
}
}
Solution
Basically, the first thing you should do is just read the API Keys for Firebase documentation page to get acquainted with the concept of client-side API keys in Firebase.
Then, in all likelihood, the solution to pretty much all the errors/warnings above is to set your web URL as an HTTP referrer for the Browser Key
in use. This can be done in the APIs & Services > Credentials > API Keys
section in your Google Cloud Console. This is what the section should look like:

When you click on Browser key (auto created by Firebase)
link seen in the image above, you should see HTTP referrers (web sites)
selected under the Application restrictions
section. If that is the case, go to the Website restrictions
section below it and add yoursite.com
or sub.yoursite.com
to the list.

Once saved, your problem should be solved.