How to Enable and Enforce HTTPS in Firebase Hosting

Every Firebase Hosting project gets two default domains: yourproject.web.app and yourproject.firebaseapp.com. Both have SSL certificates provisioned automatically. After deploying your site with firebase deploy, visit both URLs in your browser and verify the padlock icon appears. No configuration is needed for these domains.

1# Deploy your site
2firebase deploy --only hosting
3
4# Your site is available at:
5# https://YOUR-PROJECT.web.app
6# https://YOUR-PROJECT.firebaseapp.com

To use your own domain (e.g., www.yoursite.com), open the Firebase Console, go to Hosting, and click Add custom domain. Enter your domain name. Firebase will ask you to verify ownership by adding a TXT record to your DNS. After verification, add the A records Firebase provides (typically pointing to 151.101.1.195 and 151.101.65.195). SSL provisioning begins automatically once DNS records propagate.

While Firebase Hosting always serves over HTTPS, browsers may still attempt HTTP connections on custom domains. Add the Strict-Transport-Security (HSTS) header in your firebase.json to tell browsers to always use HTTPS. The max-age value is in seconds — 31536000 equals one year. The includeSubDomains directive applies the policy to all subdomains.

1{
2  "hosting": {
3    "public": "dist",
4    "headers": [
5      {
6        "source": "**",
7        "headers": [
8          {
9            "key": "Strict-Transport-Security",
10            "value": "max-age=31536000; includeSubDomains"
11          },
12          {
13            "key": "X-Content-Type-Options",
14            "value": "nosniff"
15          },
16          {
17            "key": "X-Frame-Options",
18            "value": "DENY"
19          }
20        ]
21      }
22    ],
23    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"]
24  }
25}

Mixed content errors occur when your HTTPS page loads resources (images, scripts, stylesheets) over HTTP. Check your HTML, CSS, and JavaScript for any hardcoded http:// URLs and change them to https:// or use protocol-relative URLs (//). Open your browser's developer tools console and look for mixed content warnings.

1<!-- BAD: HTTP resource on HTTPS page -->
2<script src="http://cdn.example.com/lib.js"></script>
3<img src="http://example.com/image.jpg" />
4
5<!-- GOOD: HTTPS or protocol-relative -->
6<script src="https://cdn.example.com/lib.js"></script>
7<img src="https://example.com/image.jpg" />
8
9<!-- ALSO GOOD: Protocol-relative URL -->
10<script src="//cdn.example.com/lib.js"></script>

If your custom domain shows 'Needs setup' or 'Pending' for more than 24 hours, the DNS records are likely incorrect. Verify your A records point to the Firebase IP addresses shown in the Console. Check that no CAA records on your domain block Let's Encrypt. If you are using a CDN like Cloudflare in front of Firebase, set the DNS proxy to DNS-only (grey cloud) during provisioning, then re-enable it after the certificate is active.

1# Verify DNS resolution from your terminal
2dig A www.yoursite.com +short
3# Should return Firebase IP addresses like 151.101.1.195
4
5# Check for CAA records that might block certificate issuance
6dig CAA yoursite.com +short
7# Should be empty or include letsencrypt.org