I have a URL structure to a "project detail" page that looks like this: john/project/eRdKn6 (where "john" is the username and "eRdKn6" is the project id). I want this to be rewritten to the file project.html, where I parse the document.location and load the appropriate data. So the username and the project id should be dynamic.
The rule in firebase.json that I have looks like this:
{
"source": "*/project/*",
"destination": "/project.html"
}
However, Firebase 404's when I try to load http://example.com/john/project/eRdKn6.
I've tried to make only the last part dynamic, as a test (e.g. {"source": "john/project/*", "destination": "/project.html"} but I also get a 404.
The project.html is in the public folder.
Here is my full firebase.json file:
{
"firebase": "example",
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{"source": "*/project/*", "destination": "/project.html"}
]
}
It seems the issue is that source requires a starting slash, e.g. /*/project/*. My full firebase.json now looks like this:
{
"firebase": "example",
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{"source": "/*/project/*", "destination": "/project.html"}
]
}
This seems a documentation issue, since none of the examples cover this use case.
Related
I'm using firebase hosting. I have index.html file.
It's opening via Both Firebase URL and Custom Domain.
If anyone tries open example.com it should open index.html
But if anyone try to open example.com/?link=https://google.com it should dynamically open the URL in link parameter.
I don't know what I'm doing wrong. Even if the link parameter is present. It still opens the index.html file.
Here is my firebase.json
{
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"appAssociation": "AUTO",
"rewrites": [
{
"source": "/?link**",
"dynamicLinks": true
},
{
"source": "!/?link**",
"destination": "/index.html"
}
]
}
}
You should remove the rewrite rule for index.html
{
"source": "!/?link**",
"destination": "/index.html"
}
and remove ? on the dynamicLinks rewrite rule source. It should look like this.
{
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"appAssociation": "AUTO",
"rewrites": [{
"source": "/link**",
"dynamicLinks": true
}]
}
}
Deploy the changes again and this should set https://example.com/link as your Dynamic Link domain. You can test if the FDL domain functional by manually adding FDL parameters on the domain.
i.e. https://example.com/link?link=https://google.com
Let's say I have a domain example.com. And I created a second website through hosting and cli as sub.example.com.
{
"hosting": [
{
"target": "app",
"public": "public",
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
},
{
"target": "promos",
"public": "public",
"appAssociation": "AUTO",
"rewrites": [
{
"source": "**",
"dynamicLinks": true
}
]
}
]
}
Now when I go to create Dynamic Link for sub.example.com without any path prefix, it gives me a red flag saying:
It looks like you already have content served on this path. Specify a different path prefix to avoid conflicts with existing content.
What am I doing wrong?
Also, if this subdomain is only for links, I still have to put public field? I don't want to show anything on it, just links...
I fixed it by adding (or rather ignoring) the public folder for the dynamic links subdomain.
"ignore": [
"*"
],
I saw this post: https://github.com/firebase/firebase-tools/issues/566 and someone asked similar question for functions and the answer was to delete dist/index.html. But since my actual site depends on it, I tried just ignoring it and it seems to work.
I fixed the same issue with #cocacrave's answer. Just sharing the full firebase.json file. * There should be a public folder and settings but my public folder is empty.
{
"hosting": {
"public": "public",
"ignore": [
"*"
],
"appAssociation": "AUTO",
"rewrites": [
{
"source": "/**",
"dynamicLinks": true
}
]
}
}
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:
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 need to serve dynamic content by using path parameters to fetch an id from the URL when hosting on firebase. For example:
mydomain.com/apps/4480023
In this scenario, I'd like to extract 4480023 as the ID of the resource I'm looking for. I tried the following changes in the firebase.json file:
{
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
},
{
"source": "/apps/**",
"destination": "/apps.html"
}
],
"cleanUrls": true
}
}
In which case, I can use a javascript function to retrieve the ID from the URL when the user browses to that resource. My problem is, this rewrite doesn't work and it directs the user to the index.html page and all the CSS/JS files end up not functioning correctly.
How can I modify this to enable this functionality?
The rewrites are checked in order. This means your first rewrite, which matches all requests, is always going to be served by index.html.
All you have to do is change the order of the rewrites to allow /apps/** to have a possibility of matching before /** captures everything else.
"rewrites": [
{
"source": "/apps/**",
"destination": "/apps.html"
},
{
"source": "**",
"destination": "/index.html"
}
]