-
Notifications
You must be signed in to change notification settings - Fork 1
Firebase Deployment Configuration
Firebase deployment settings are located in the firebase.json
file at the root of your project directory. Don't see one? Visit the Readme for installation details or run firebase init
from the Command Line.
The initial config will look something like:
{
"hosting": {
"public": "app",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}
}
This file configures which files are published upon deployment.
The public
field tells the Firebase CLI which directory to upload to Firebase Hosting. This directory must exist within the project directory. You will not want to commit this directory to version control and should instead add it to your .gitignore file.
The ignore
field specifies which files to ignore when deploying the app via the Firebase CLI. It can handle glob definitions.
The redirects
field contains an array of redirect rules. Each rule must specify a source
, destination
, and type
.
The source
is a glob pattern matched against all URL paths at the start of every request - before determining if a file or folder exists at that path. When a match is found, a HTTP redirect response is set with the Location header set to the static destination
field string - this field can be either a relative path or an absolute URL.
The type
parameter specifies the HTTP response code served and can include a 301
(Moved Permanently) or a 302
(Found - Temporary Redirect).
"redirects": [{
"source": "/foo",
"destination": "/bar",
"type": 301
},
"source": "/firebase/*",
"destination": "https://www.firebase.com",
"type": 302
{
}]
When you wish to capture information from the source URL of a redirect and re-use it at the destination, use a :
prefix to identify the segment and an optional *
after the name to indicate that the redirect should capture the rest of the URL:
"redirects": [{
"source": "/blog/:post*",
"destination": "https://blog.myblog.com/:post*",
"type": 301
},
{
"source": "/users/:id/profile",
"destination": "/users/:id/newProfile",
"type": 301
}]
Use redirects to prevent broken links if a page moves or to shorten URLs.
The rewrites
field contains an optional array of URL rewrite rules. Each rule must contain source
and destination
parameters. The destination should be an existing file. A rewrite rule is only applied if a file or folder does not exist at the source location. It will return the content of the destination location instead of redirecting.
"rewrites": [{
"source": **,
"destination": "/index.html"
}]
This example will rewrite any URL to the content found at /index.html
if a match does not exist. Use rewrites when you would like to display the same content for multiple URLs.
The headers
field contains an array of custom header definitions. Each definition must contain a source
key and an array of headers
to be applied. Each entry of the latter must contain a key
and a value
. The source
key is matched against the original request path disregarding any rewrite rules. When a file or folder cannot be found, headers are instead matched against the source 404.html
.
"header": [{
"source": "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
"headers": [{
"key": "Access-Control-Allow-Origin",
"value": "*"
}]
},
{
"source": "**/*.@(jpg|jpeg|gif|png)",
"headers": [{
"key": "Cache-Control",
"value": "max-age=7200"
}]
},
"source": "404.html",
"headers": [{
"key": "Cache-Control",
"value": "max-age=300"
}]
{
}]
Supported Keys for Headers:
- Cache-Control
- Access-Control-Allow-Origin
- X-UA-Compatible
- X-Content-Type-Options
- X-Frame-Options
- X-XSS-Protection
- Content-Type
- Link
- Content-Security-Policy
cleanUrls: true
This parameter will drop the .html
extension from uploaded file URLs. If the extension is added manually, a 301
redirect will trigger the same path without the .html
extension.
trailingSlash: true
This parameter forces redirect URLs to either add (true) or remove (false) trailing slashes. When unspecified, trailing slashes used for directory index files only (about/index.html).
See this Wiki Article for an in-depth explanation.
See the Firebase documentation for full details.