Firebase hosting rewrites to functions not working as expected

Question

I am building a static website with HTML, CSS & JS and hosted on firebase hosting and connected a custom domain. The only serverside function I need is to send mail from the contact form. For this, I am trying to use Firebase cloud function. I have initialized functions on the same project and trying to use firebase hosting rewrites to rewrite the request to mydomain.com/contact to the contact function. But when I try to access the mydomain.com/contact in the browser it shows the below 403 Forbidden error message.

Error: Forbidden
Your client does not have permission to get URL /contact/contact from this server.

firebase.json

{
  "hosting": {
    "public": "build",
    "rewrites": [{
      "source": "/contact",
      "function": "contact"
    }],
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  },
  "functions": {
    "predeploy": [
      "npm --prefix \"$RESOURCE_DIR\" run lint",
      "npm --prefix \"$RESOURCE_DIR\" run build"
    ]
  }
}

The cloud function (not implemented the actual logic)

import * as functions from 'firebase-functions';

exports.contact = functions.https.onRequest((request, response) => {
    response.send("<h1>Contact<h1>");
});

I am using Firebase spark plan.

Sreeram Padmanabhan Sreeram Padmanabhan · Accepted Answer · 2019-06-27T10:09:54

This works for me:

"rewrites": [
    {
      "source": "**",
      "function": "myApp"
    }
  ]

And in the express function,

import * as functions from 'firebase-functions';
import express from 'express';
const app = express();

app.get('/contact', (req, res) => {
  res.send("<h1>Contact<h1>");
};

export const myApp = functions.https.onRequest(app);

Firebase hosting rewrites to functions not working as expected

2 Answers