I am following this
https://firebase.google.com/docs/hosting/functions (Use a Web Framework)
in order to rewrite a url in the form of http://<mycustom_domain>/<api_name> on Firebase hosting to the respective Cloud Functions that use Express(). The endpoint for the API is https://<google_cloud_function_url>/app/<api_name>
This rewrite works:
"rewrites": [ {
"source": "**",
"function": "app"
} ]
What I want to do is rewrite http://<mycustom_domain>/app/<api_name> to
https://<google_cloud_function_url>/app/<api_name>.
I have tried a few things such as
"rewrites": [ {
"source": "/app/**",
"function": "app"
} ]
In the hope that whatever path comes after /app is passed onto express as the API name but this does not work and express returns something like
Cannot GET /app/<api_name>
Any ideas how the rewrite should be written for this to work?
Related
How can I use SvelteKit and firebase hosting? firebase hosting requires the html file to be called Index.html while SvelteKit calls it app.html. I think it has something to do with SvelteKit adaptors
You can configure Firebase to serve the file you want.
"hosting": {
// ...
// Serves app.html for requests to files or directories that do not exist
"rewrites": [ {
"source": "**",
"destination": "/app.html"
} ]
}
I'm trying to configure a web app to use hosting for all static resources, such as jpegs, pngs, etc. But I want to route all requests to a cloud function to monitor traffic for various security reasons.
I managed to achieve this for all routes except the home route using this:
"hosting": {
"public": "public", //without this everything goes through function, with it the base url is treated like a static get for index.html
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"function": "sendWebApp"
}
]
}
The problem I'm facing is with the home route/base url request. It's ignoring the rewrite for "myurl.com" but uses the rewrite for "myurl.com/whatever-I-type-here". How can I get it to route to the function for the base url as well?
(For clarity.)
EDIT: How can I get firebase hosting not to treat the base url as a static request for index.html?
Firebase Hosting by default will always send index.html from the declared public folder when a request is made to the base URL. The only way to override this is to remove the index.html or don't include the "public" declaration in firebase.json's hosting configuration.
Because static files ignore the rewrites configuration, you can simplify your rewrites to just:
"hosting": {
// ... other props ...
// Serves the function for requests to files or directories that do not exist
"rewrites": [ {
"source": "**",
"function": "sendWebApp"
} ]
}
Importantly, if you are accessing a directory of your site, like / or /dashboard/, the index.html in those directories will be served if they exist. This means that your configured rewrite rules will never be checked in these cases.
I want to rewrites all URL end with "api/(funcName)" to call cloud function (funcName).
In firebase.json I set rewrites rules as follows.
"rewrites": [
{
"source": "api/:funcName",
"function": ":funcName"
},
{
"source": "**",
"destination": "/index.html"
}
]
but it's not working.
I got
Error: Forbidden
Your client does not have permission to get URL /:funcName/api/(funcName) from this server.
(funcName) is the real function name I don't want to show here.
Your rewrite should include the exact name of the function. The rewrite system doesn't support named wildcard routes like you use in Express. If you want to wildcard all URLs with a prefix, use the glob syntax supported by Firebase Hosting as described in the documentation.
{
"source": "api/**",
"function": "funcName"
},
Where "funcName" is the name of your function as exported by your code.
I'm not exactly sure how you got it to throw that error message, but from what I can quickly see the error message comes from Cloud Functions, or from something between Firebase Hosting and your Cloud Function.
Given where the error message comes from, Firebase Hosting won't be able to hide it for the response.
I have a Firebase hosted single page app.
I also have 3 Firebase functions (contact, plans, features) that the app and external sources make requests of.
My app has a custom domain, which I'd like to access my functions via.
This is my current firebase.json config
{
"hosting": {
"public": "www",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
}
}
So currently all traffic goes to my app and routing is handled via my SPA. Access to my functions currently has to be done via the cloudfunctions.net URL which isn't ideal.
How can I add URL rewrite entries to this config so that my functions are accessible via my custom domain and my single page app handles the rest of the routes?
I have tried the following for the features endpoint:
"rewrites": [
{
"source": "/features/**",
"function": "features"
},
{
"source": "!/features/**",
"destination": "/index.html"
}
]
Where in my functions index.js I have:
...
exports.plans = functions.https.onRequest(plansApi);
exports.features = functions.https.onRequest(featuresApi);
exports.contact = functions.https.onRequest(contactApi);
But I receive 404 Cannot GET /features/123 as the response?
A few things:
Make sure that your featuresApi handler is matching for the full URL path (e.g. /features/123 not /123). Firebase Hosting forwards the full path to the function, not just the ** part.
Rewrites are resolved in order, so there's no need to do !/features/** for your second rewrite source. ** should be fine since if it matches /features/** it will already match the first rewrite and resolve to the function.
Based on the error message, it seems likely that (1) is the culprit here.
I've deployed my single page vue js web application on Google Firebase. When the source files are requested, firebase returns index.html instead of the .js files the app needs to run. I tried reconfiguring the rewrite for the web application
Old, matches all requests to index.html:
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
New, intended to match all requests except file requests to index.html:
"rewrites": [
{
"source": "!**/*.#(js|css|jpg|jpeg|png)",
"destination": "/index.html"
}
]
Now, whenever I go to the link for a js file, i get a 404 error.
Any ideas?
Ok so after many hours of struggling, I discovered the solution was to upgrade Firebase CLI from 4.1.0 to 4.1.1