Configure region for firebase function generated by Framework-aware Hosting

Created an Angular project following this Firebase doc and from what I can see there is no way to set a region for the generated ssr function. Currently my function defaults to us-central1 (as expected) but I need to move it to another region. (‘europe-west3’).

To test / try the issue just generate a project based on the Firebase doc from above.

Is there any way to configure the region for the generated ssr function form angular.json or any other config file? (I do not want to use firebase deploy –only functions –region ‘europe-west3’ as this project is also deployed using Github Actions and the deploy command is different there)

My issue has nothing to do with the AngularFire package, there is a doc in their github repo here), this sets the region for functions that don’t handle ssr, it’s just used to call other functions deployed on Firebase.

Also, this won’t work, because the ssr function is auto-generated.

I noticed that there is a file called functions.yaml that is autogenerated in .firebase/project-name/functions that has the region in it. But if i change it in that file, it is overwritten at build (as expected).

functions.yaml looks like this (the ‘region’ field is of interest, but overwritten when running firebase deploy):

{
  "endpoints": {
    "ssrangulartest": {
      "platform": "gcfv2",
      "region": [
        "us-central1"
      ],
      "labels": {},
      "httpsTrigger": {},
      "entryPoint": "ssr"
    }
  },
  "specVersion": "v1alpha1",
  "requiredAPIs": []
}

I have also checked other stack overflow posts like this one but I cannot set the region in that way in my server.ts file, due to the reasons specified above (the ssr function is somehow autogenerated (please try to generate a project using the documentation provided by firebase in the first link).

For not wasting you time with generating an entire project, this is the server.ts file that is created after following the steps from the Firebase doc:

import 'zone.js/node';

import { APP_BASE_HREF } from '@angular/common';
import { ngExpressEngine } from '@nguniversal/express-engine';
import * as express from 'express';
import { existsSync } from 'fs';
import { join } from 'path';

import { AppServerModule } from './src/main.server';

// The Express app is exported so that it can be used by serverless Functions.
export function app(): express.Express {
  const server = express();
  const distFolder = join(process.cwd(), 'dist/hosting/browser');
  const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';

  // Our Universal express-engine (found @ https://github.com/angular/universal/tree/main/modules/express-engine)
  server.engine('html', ngExpressEngine({
    bootstrap: AppServerModule,
  }));

  server.set('view engine', 'html');
  server.set('views', distFolder);

  // Serve static files from /browser
  server.get('*.*', express.static(distFolder, {
    maxAge: '1y'
  }));

  // All regular routes use the Universal engine
  server.get('*', (req, res) => {
    res.set('Cache-Control', 'public, max-age=12000, s-maxage=12000');
    res.render(indexHtml, {req, providers: [ {provide: APP_BASE_HREF, useValue: req.baseUrl} ]});
  });

  return server;
}

function run(): void {
  const port = process.env['PORT'] || 4000;

  // Start up the Node server
  const server = app();
  server.listen(port, () => {
    console.log(`Node Express server listening on http://localhost:${port}`);
  });
}

// Webpack will replace 'require' with '__webpack_require__'
// '__non_webpack_require__' is a proxy to Node 'require'
// The below code is to ensure that the server is run only when not requiring the bundle.
declare const __non_webpack_require__: NodeRequire;
const mainModule = __non_webpack_require__.main;
const moduleFilename = mainModule && mainModule.filename || '';
if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
  run();
}

export * from './src/main.server';

I also tried wrapping app() in something like this:

export const api = functions
  .region("europe-west3")
  .https.onRequest((request, response) => {
    app(request, response);
  });

but that also didn’t work. (because the ssr function is somehow auto-generated)

Note: this is web frameworks with Hosting, i’m not talking about configuring the function region for ‘normal’ functions.