feat: autogenerate default allowedHosts and trustProxyHeaders

README.md

@@ -127,8 +127,7 @@ export async function netlifyAppEngineHandler(request: Request): Promise<Respons
 
   // Example API endpoints can be defined here.
   // Uncomment and define endpoints as necessary.
-  // const pathname = new URL(request.url).pathname;
-  // if (pathname === '/api/hello') {
+  // if (context.url.pathname === '/api/hello') {
   //   return Response.json({ message: 'Hello from the API' });
   // }
 
@@ -147,14 +146,14 @@ If you are using Angular 19 and did not opt into the App Engine Developer Previe
 ```ts
 import { CommonEngine } from '@angular/ssr/node'
 import { render } from '@netlify/angular-runtime/common-engine.js'
+import type { Context } from '@netlify/edge-functions'
 
 const commonEngine = new CommonEngine()
 
-export async function netlifyCommonEngineHandler(request: Request, context: any): Promise<Response> {
+export async function netlifyCommonEngineHandler(request: Request, context: Context): Promise<Response> {
   // Example API endpoints can be defined here.
   // Uncomment and define endpoints as necessary.
-  // const pathname = new URL(request.url).pathname;
-  // if (pathname === '/api/hello') {
+  // if (context.url.pathname === '/api/hello') {
   //   return Response.json({ message: 'Hello from the API' });
   // }
 
@@ -181,9 +180,7 @@ The [`server.ts` file](https://angular.dev/guide/ssr#configure-server-side-rende
 
 ### Requirements
 
-To use the Angular Runtime while building and deploying with the CLI, you need to have `netlify-cli v26.0.0` installed (or a later version).
-
-Please also make sure to use `ntl deploy --build` (rather than `ntl build && ntl deploy`).
+To use the Angular Runtime while building and deploying with the CLI, you need to have `netlify-cli v26.0.0` installed (or a later version). To deploy the site via CLI, please use `netlify deploy`. Using `netlify deploy` with the `--no-build` flag is not supported.
 
 ## Getting Help
 

demo/package.json

@@ -11,16 +11,16 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "21.0.0",
-    "@angular/common": "21.0.0",
-    "@angular/compiler": "21.0.0",
-    "@angular/core": "21.0.0",
-    "@angular/forms": "21.0.0",
-    "@angular/platform-browser": "21.0.0",
-    "@angular/platform-browser-dynamic": "21.0.0",
-    "@angular/platform-server": "21.0.0",
-    "@angular/router": "21.0.0",
-    "@angular/ssr": "21.0.0",
+    "@angular/animations": "^21.2.11",
+    "@angular/common": "^21.2.11",
+    "@angular/compiler": "^21.2.11",
+    "@angular/core": "^21.2.11",
+    "@angular/forms": "^21.2.11",
+    "@angular/platform-browser": "^21.2.11",
+    "@angular/platform-browser-dynamic": "^21.2.11",
+    "@angular/platform-server": "^21.2.11",
+    "@angular/router": "^21.2.11",
+    "@angular/ssr": "^21.2.11",
     "@netlify/angular-runtime": "file:..",
     "@netlify/edge-functions": "^3.0.6",
     "express": "^4.21.0",
@@ -29,9 +29,9 @@
     "zone.js": "~0.15.0"
   },
   "devDependencies": {
-    "@angular/build": "21.0.0",
-    "@angular/cli": "21.0.0",
-    "@angular/compiler-cli": "21.0.0",
+    "@angular/build": "^21.2.11",
+    "@angular/cli": "^21.2.11",
+    "@angular/compiler-cli": "^21.2.11",
     "@types/express": "^4.17.21",
     "@types/jasmine": "~5.1.0",
     "@types/node": "^22.0.0",

demo/server.ts

@@ -1,9 +1,13 @@
 import { AngularAppEngine, createRequestHandler } from '@angular/ssr'
+import { getAllowedHosts, getTrustProxyHeaders } from '@netlify/angular-runtime/app-engine-config.js'
 import { getContext } from '@netlify/angular-runtime/context.js'
 
-const angularAppEngine = new AngularAppEngine()
+const angularAppEngine = new AngularAppEngine({
+  allowedHosts: getAllowedHosts(),
+  trustProxyHeaders: getTrustProxyHeaders(),
+})
 
-export const netlifyAppEngineHandler = async (request: Request): Promise<Response> => {
+export async function netlifyAppEngineHandler(request: Request): Promise<Response> {
   const context = getContext()
 
   const result = await angularAppEngine.handle(request, context)

package.json

@@ -20,6 +20,14 @@
     ".": {
       "default": "./src/index.js"
     },
+    "./app-engine-config": {
+      "types": "./src/app-engine-config.d.ts",
+      "default": "./src/app-engine-config.js"
+    },
+    "./app-engine-config.js": {
+      "types": "./src/app-engine-config.d.ts",
+      "default": "./src/app-engine-config.js"
+    },
     "./common-engine": {
       "types": "./src/common-engine.d.ts",
       "default": "./src/common-engine.js"
@@ -85,13 +93,14 @@
     "node": "^22.22.0 || ^24.13.1 || >=26.0.0"
   },
   "devDependencies": {
-    "@opentelemetry/api": "~1.8.0",
+    "@netlify/build": "^35.13.5",
+    "@netlify/edge-functions": "^3.0.6",
     "@netlify/eslint-config-node": "^7.0.1",
+    "@opentelemetry/api": "~1.8.0",
     "@types/node": "^24.0.0",
     "eslint-plugin-unicorn": "^49.0.0",
     "husky": "^9.1.7",
     "netlify-cli": "^26.0.1",
-    "@netlify/build": "^35.13.5",
     "npm-run-all2": "^8.0.4",
     "prettier": "^3.8.3"
   },

src/app-engine-config.d.ts

@@ -0,0 +1,2 @@
+export declare function getAllowedHosts(): string[]
+export declare function getTrustProxyHeaders(): string[]

src/app-engine-config.js

@@ -0,0 +1,49 @@
+import { env } from 'node:process'
+
+export function getAllowedHosts() {
+  const allowedHosts = []
+  const environmentVariables = ['DEPLOY_ID', 'DEPLOY_PRIME_URL', 'DEPLOY_URL', 'SITE_ID', 'SITE_NAME', 'URL']
+
+  for (const environmentVariable of environmentVariables) {
+    if (!env[environmentVariable] || env[environmentVariable] === 'undefined') {
+      console.warn(
+        `Missing Netlify-specific environment variable ${environmentVariable}. \`allowedHosts\` config might be incomplete.`,
+      )
+      return allowedHosts
+    }
+  }
+
+  const deployPrimeUrlHostname = new URL(env.DEPLOY_PRIME_URL).hostname
+
+  // <subdomain>.netlify.app OR <custom-domain>
+  // www handling is not required as Netlify will auto-redirect
+  allowedHosts.push(new URL(env.URL).hostname)
+  // <deploy-id>--<subdomain>.netlify.app
+  allowedHosts.push(new URL(env.DEPLOY_URL).hostname)
+  // <branch-name>--<subdomain>.netlify.app or <dp-#>--<subdomain>.netlify.app (supports ADS)
+  allowedHosts.push(deployPrimeUrlHostname)
+  // <subdomain>.netlify.app
+  // this will be duplicated for sites without custom domain
+  // but it's important to have in case a site's custom domain is removed after a deploy
+  allowedHosts.push(`${env.SITE_NAME}.netlify.app`)
+  // <site-id>.netlify.app
+  allowedHosts.push(`${env.SITE_ID}.netlify.app`)
+  // <deploy-id>--<site-id>.netlify.app
+  allowedHosts.push(`${env.DEPLOY_ID}--${env.SITE_ID}.netlify.app`)
+
+  // we need to extract the branch name or the deploy preview number
+  // so we can add the subdomain as well as site-id specific URLs
+  // this would be required for sites using ADS so that
+  // we can add netlify.app URLs as well
+  if (deployPrimeUrlHostname.includes('--')) {
+    const [branchNameOrDpNumber] = deployPrimeUrlHostname.split('--')
+    allowedHosts.push(`${branchNameOrDpNumber}--${env.SITE_NAME}.netlify.app`)
+    allowedHosts.push(`${branchNameOrDpNumber}--${env.SITE_ID}.netlify.app`)
+  }
+
+  return allowedHosts
+}
+
+export function getTrustProxyHeaders() {
+  return ['x-forwarded-for']
+}

src/context.d.ts

@@ -1 +1,3 @@
-export declare function getContext(): any
+import type { Context } from '@netlify/edge-functions'
+
+export declare function getContext(): Context | undefined

src/helpers/serverModuleHelpers.js

@@ -123,15 +123,15 @@ export async function fixServerTs({ angularVersion, siteRoot, failPlugin, failBu
   const angularRuntimeVersionInstalledByUser = await getAngularRuntimeVersion(siteRoot)
   if (!angularRuntimeVersionInstalledByUser) {
     failBuild(
-      "Angular@19 SSR on Netlify requires '@netlify/angular-runtime' version 2.2.0 or later to be installed. Please install it and try again.",
+      `Angular@${angularVersion} SSR on Netlify requires '@netlify/angular-runtime' version 2.2.0 or later to be installed. Please install it and try again.`,
     )
   } else if (!satisfies(angularRuntimeVersionInstalledByUser, '>=2.2.0', { includePrerelease: true })) {
     failBuild(
-      `Angular@19 SSR on Netlify requires '@netlify/angular-runtime' version 2.2.0 or later to be installed. Found version "${angularRuntimeVersionInstalledByUser}". Please update it to version 2.2.0 or later and try again.`,
+      `Angular@${angularVersion} SSR on Netlify requires '@netlify/angular-runtime' version 2.2.0 or later to be installed. Found version "${angularRuntimeVersionInstalledByUser}". Please update it to version 2.2.0 or later and try again.`,
     )
   }
 
-  // check whether project is using stable CommonEngine or Developer Preview AppEngine
+  // check whether project is using CommonEngine or AppEngine
   const serverModuleContents = await readFile(serverModuleLocation, 'utf8')
 
   const usedEngineBasedOnKnownSignatures = getEngineBasedOnKnownSignatures(serverModuleContents)

src/helpers/setUpEdgeFunction.js

@@ -102,13 +102,23 @@ export async function setUpEdgeFunction({ outputPath, constants, failBuild, used
     toPosix,
   )
 
-  // buy putting this into a separate module that's imported first,
+  // by putting this into a separate module that's imported first,
   // we ensure this is initialised before any other module
   const polyfills = `
   import process from "node:process"
 
-  globalThis.process = process
   globalThis.DenoEvent = globalThis.Event // storing this for fixup-event.mjs
+  globalThis.process = process
+
+  // setting \`undefined\` as environment variable is not allowed: https://nodejs.org/api/process.html#processenv
+  // so we set it as a string ourselves
+
+  globalThis.process.env.DEPLOY_ID = ${JSON.stringify(env.DEPLOY_ID ?? 'undefined')}
+  globalThis.process.env.DEPLOY_PRIME_URL = ${JSON.stringify(env.DEPLOY_PRIME_URL ?? 'undefined')}
+  globalThis.process.env.DEPLOY_URL = ${JSON.stringify(env.DEPLOY_URL ?? 'undefined')}
+  globalThis.process.env.SITE_ID = ${JSON.stringify(env.SITE_ID ?? 'undefined')}
+  globalThis.process.env.SITE_NAME = ${JSON.stringify(env.SITE_NAME ?? 'undefined')}
+  globalThis.process.env.URL = ${JSON.stringify(env.URL ?? 'undefined')}
   `
 
   // angular's polyfills override the global `Event` with a custom implementation.