How do I serve firebase functions from a custom domain?

Question

I have a website that I'm already running on firebase hosting using a google domain. I would like to now show all calls to my firebase function being made through a url such as api.mydomain.com, instead of the default firebase domain. How is it that I may be able to do this?

I read the firebase tutorial on hosting cloud functions, and I also came across this article on creating multiple sites. So could someone please tell how is it that I can set up the workflow such that my site is still running at mydomain.com, but my APIs are now being called through api.mydomain.com? What would be the target name for

If possible, I Would like all requests to be shown as requests to api.mydomain.com, and not to api.mydomain.com/endpoint - so that what endpoint is being hit is also hidden from public

Sorry, I am new to this.

Answer 1

Let's say your main project has an ID of example-app. To serve requests as api.mydomain.com, you would have to use a Cloud Function that makes use of express (or some other similar route handler).

1. Create the secondary site for your project using the Firebase CLI, (with an id of example-app-api, example-api, etc.)

firebase hosting:sites:create example-app-api

2. Connect your hosting targets to your resources

firebase target:apply hosting app example-app
firebase target:apply hosting api example-app-api

3. Modify your firebase.json file (located at the root of the firebase project) to suit the targets above.

{
  "hosting": [
    {
      // app is linked to example-app, served as mydomain.com
      "target": "app",

      // contents of this folder are deployed to the site "example-app"
      "public": "public",

      // ... other settings ...
    },
    {
      // api is linked to example-app-api, served as api.mydomain.com
      "target": "api",

      // Contents of this folder are deployed to the site "example-app-api"
      // Any file here will be returned instead of calling your Cloud Function.
      // Recommended contents:
      //   - favicon.ico        (website icon for bookmarks, links, etc)
      //   - robots.txt         (instructions for bots and scrapers)
      // Optional contents:
      //   - service-worker.js  (empty file, used to prevent triggering cloud function)
      //   - humans.txt         (details about who you/your company are & how to report bugs)
      "public": "api-static-resources",  

      // ... other settings ...

      "rewrites": [
        {
          // redirect all calls to the function called "api"
          "source": "**",
          "function": "api"
        }
      ]
    }
  ]
}

4. Deploy the api hosting config using the Firebase CLI

firebase deploy --only hosting:api

5. Open Hosting Settings for your project, click "View" for example-app-api then click "Custom Domain" following these instructions.

6. You should now be able to trigger your Cloud Function by calling it at api.mydomain.com.

api.mydomain.com/getPost?id=someId
api.mydomain.com/favicon.ico
api.mydomain.com/robots.txt