I wan´t to make routing with firebase hosting
"rewrites": [
{
"source": "/api/**",
"function": "api"
},
{
"source": "/**",
"function": "myfunction"
},
{
"source": "**",
"destination": "/index.html"
}
]
/api/test should route to api function
/anything should route to myfunction
/ should route to index.html on firebase hosting
for some reason/api/test is being routed to myfunction. I can´t get the rewrite order right. can you help me? thanks
update: this is what I have now
{
"hosting": {
"public": "build",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"cleanUrls": true,
"trailingSlash": false,
"rewrites": [
{
"source": "/api/**",
"function": "api"
},
{
"source": "/**",
"function": "myfunction"
}
]
},
"functions": {
"predeploy": ["npm --prefix \"$RESOURCE_DIR\" run lint"]
}
}
and myFunction is the one that´s still being executed and ignoring what I set
/api/test is executing myfunction instead of api
/something/test is executing myFunction as expected
"/" (or no slash at all after your domain name) automatically routes to "index.html". So simply remove the "source": "**" item. Specifically remove:
,
{
"source": "**",
"destination": "/index.html"
}
I also like to add the following to my Firebase Hosting config (firebase.json):
"cleanUrls": true,
"trailingSlash": false,
Related
I'd like any traffic that comes to:
mysite.com/suppliers/add-supplier
To be directed to add-supplier.html when the path is identified in my firebase.json config file. I've tried this:
{
"firestore": {
"rules": "firestore.rules",
"indexes": "firestore.indexes.json"
},
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
],
"redirects": [
{
"source": "/suppliers/add-supplier",
"destination": "/add-supplier.html"
}
],
"cleanUrls": true
},
"storage": {
"rules": "storage.rules"
}
}
Even though this identifies and redirects correctly, it gets rid of the suppliers/add-supplier path and makes it mysite.com/add-supplier
Is there a way to retain the original URL while also redirecting to the correct HTML page?
You have two options:
Use a rewrite instead of a redirect:
"rewrites": [
{
"source": "/suppliers/add-supplier",
"destination": "/add-supplier.html"
},
{
"source": "**",
"destination": "/index.html"
}
]
Remove the redirect entirely, and place your file at suppliers/add-supplier.html instead of in the root
I combined #samthecodingman's answer with some changes and got it working:
Moved page to new directory
I moved the add-supplier.html file to a new folder called suppliers inside the public directory so that it's suppliers/add-supplier.html
firebase.json:
{
"firestore": {
"rules": "firestore.rules",
"indexes": "firestore.indexes.json"
},
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
},
{
"source": "/suppliers/add-supplier",
"destination": "suppliers/add-supplier.html"
}
],
"cleanUrls": true
},
"storage": {
"rules": "storage.rules"
}
}
This will correctly load the page but the CSS, media and JS files will not be identified. To fix this, change all your resource files to have ../ in the front:
before changing: <link href="dist/css/style.css" rel="stylesheet" type="text/css">
after changing: <link href="../dist/css/style.css" rel="stylesheet" type="text/css">
My intention is to redirect https://example.com/admin to my firebase function named admin. So I have the following code in the firebase.json:
{
"hosting": {
"public": "build",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "/admin{,/**}",
"function": "admin"
},
{
"source": "**",
"destination": "/index.html"
}
]
}
}
I've followed the instructions from this website: https://firebase.google.com/docs/hosting/functions
Using my browser, if I go to https://my-server-my-project.cloudfunctions.net/admin everything works an looks fine. But if I go to https://example.com/admin, this is what I get instead:
Does anyone know a good way to put a static Firebase site into maintenance mode while performing some database upgrade?
I've tried to configure the rewrite with custom headers but it's not working. Firebase hosting appears to return both the default status (200) and the custom status (503) in the response.
My firebase.json:
{
"hosting": {
"public": "public",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
],
"headers": [
{
"source": "**",
"headers": [
{
"key": "status",
"value": "503"
}
]
}
]
}
}
Response headers from chrome:
This is my firebase.json file:
{
"hosting": {
"target": "md-viewer",
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "/",
"destination": "create_md.html"
},
{
"source": "/view/*",
"destination": "show_md.html"
}]
}
}
When running firebase serve, the rewrites work as expected. However, deploying and opening my app ("appname.firebaseapp.com") returns 404. The deployment is succesful since I can customize the 404 page, and access my files by asking for them directly (appname.firebaseapp.com/show_md.html, for example).
What's wrong? Shouldn't firebase serve mirror online behaviour?
If the "destination" key on the rewrite rule is a file, it has to be referenced with an absolute path:
"rewrites": [
{
"source": "/",
"destination": "/create_md.html"
},
{
"source": "/view/**",
"destination": "/show_md.html"
}]
Also, the "/view" rewrite needs two asterisks, according to the documentation.
I have rules as follows, but I want this to only work if origin is any other domain except the current domain.
If my domain is friends.com, everything should go to index, otherwise be handled like below. e.g, if origin is from Google, with a path like friends.com/user, that should call an firebase https function instead of going to index.
{
"hosting": {
"public": "y",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [{
"source": "/user",
"function": "user"
},
{
"source": "/post",
"function": "post"
},
{
"source": "/*",
"destination": "/index.html"
}
],
"headers": [{
"source": "/css/**",
"headers": [{
"key": "Cache-Control",
"value": "max-age=0"
}]
}]
}
}