Search code examples
node.jsfirebaseexpressgoogle-cloud-functionsfirebase-hosting

Firebase - Cloud Functions not running when deployed


I'm developing a blog application with firebase. I'm using express with ejs on this project.

PROBLEM - The project is working perfectly when I run them using the emulator, but doesn't work on firebase's hosting.

I've tried changing my code and re-deploying all the files many times. The function is visible in the 'functions' tab in firebase, and doesn't log any errors when I open the page.

I've checked the following ->

1) Firebase functions SDK, npm modules, and the CLI updated to the latest version.

// >>package.json<<

{
  "name": "functions",
  "description": "Cloud Functions for Firebase",
  "scripts": {
    "serve": "firebase emulators:start --only functions",
    "shell": "firebase functions:shell",
    "start": "npm run shell",
    "deploy": "firebase deploy --only functions",
    "logs": "firebase functions:log"
  },
  "engines": {
    "node": "10"
  },
  "dependencies": {
    "ejs": "^3.1.3",
    "express": "^4.17.1",
    "firebase-admin": "^8.10.0",
    "firebase-functions": "^3.7.0"
  },
  "devDependencies": {
    "firebase-functions-test": "^0.2.0"
  },
  "private": true
}

2) The project is running on node 10.
3) I've added rewrites to my function in firebase.json

//>>firebase.json<<

 "firestore": {
    "rules": "firestore.rules",
    "indexes": "firestore.indexes.json"
  },
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [ {
      "source": "**",
      "function": "app"
    } ]
  },

4) Tried the Port Numbers, and cross-checked other essential configurations.
5) My project is linked to google cloud, which has an active payment account.
6) Works fine when tested locally in a firebase emulator.

This is my function

// >>index.js<<
const functions = require('firebase-functions');
const express = require('express');
const app = express(); // express initialize

//firestore
const admin = require('firebase-admin');
admin.initializeApp();
const db = admin.firestore();

app.listen(443); // listen for requests

// register view engine
app.set('view engine', 'ejs');
app.set('views', './views');


// middleware & static files
app.use(express.static('stats'));


// HANDLING REQUESTS
app.get('/', (req, res) => {
  res.render('index', { title: "Blog by Zeal For Good" });
})
app.get('/index', (req, res) => {
  res.redirect('/');
})

app.use((req, res) => {
  res.status(404).render('404', { title: '404' });
});

exports.app = functions.https.onRequest(app);



I'm getting this message when I'm opening my website (https://zealforgood-blog.web.app/) ->
enter image description here


Solution

    1. Install Express on 'functions' folder.

    2. Install all modules that you need of the ExpressJs on 'functions' folder.

    3. The Firebase with Cloud Functions need 'Cors' module running in ExpressJs. Install it.

    4. The System needs a 'public' folder on project's base folder, another 'public' folder on the 'functions' folder.

    5. After, run 'npm install' in project's base folder and on the 'fuctions' folder

    6. delete 'index.html' and '404.html' on the 'public' folders genereted for Default by Firebase

    7. change your files .html to .ejs;

    8. Adjust your project like this:

    // in firebase.json use: //

    "source": "/**",
    

    // in index.js: //

    const   cors              = require('cors');
    
    ...
    
    const app = express();
    
    ...
    
    // set view engine setup EJS
    app.set('views', path.join(__dirname, 'views'));
    app.set('view engine', 'ejs');
    // set this line below too
    app.engine('ejs', require('ejs').__express);
    
    
    app.use(cors({ origin: true }));
    

    Note: This line below is a copy from the japanese site that do EJS render on Cloud Functions (https://qiita.com/kingpanda/items/aa9bdef2706857720058).

    app.engine('ejs', require('ejs').__express);
    

    Works to me!

    Good Luck!