fix(builders): send X-Forwarded headers when using ssr-dev-server

Fixes: #1459
angular · Jan 22, 2020 · 1f055d5 · 1f055d5
1 parent 01356cd
commit 1f055d5
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 18 deletions.
diff --git a/modules/builders/src/ssr-dev-server/index.spec.ts b/modules/builders/src/ssr-dev-server/index.spec.ts
@@ -40,6 +40,26 @@ describe('Serve SSR Builder', () => {
   });
 
   it('works', async () => {
+    host.writeMultipleFiles({
+      'src/app/app.component.ts': `
+      import { Component, Optional, Inject } from '@angular/core';
+      import { REQUEST } from '@nguniversal/express-engine/tokens';
+      import { Request } from 'express';
+
+      @Component({
+        selector: 'app-root',
+        template: '{{ headers | json }}',
+      })
+      export class AppComponent {
+        headers: any;
+
+        constructor(@Optional() @Inject(REQUEST) private request: Request) {
+          this.headers = this.request.headers;
+        }
+      }
+      `
+    });
+
     const run = await architect.scheduleTarget(target);
     runs.push(run);
     const output = await run.result as SSRDevServerBuilderOutput;
@@ -54,8 +74,9 @@ describe('Serve SSR Builder', () => {
             : timer(200);
         }),
       )),
-    ).toPromise();
-    expect(await (response as any).text()).toContain('app is running!');
+    ).toPromise() as any;
+
+    expect(await response.text()).toContain(`"x-forwarded-host": "localhost:4200"`);
   });
 
   it('works with port 0', async () => {

diff --git a/modules/builders/src/ssr-dev-server/index.ts b/modules/builders/src/ssr-dev-server/index.ts
@@ -125,8 +125,8 @@ export function execute(
           }
         }),
         debounce(([builderOutput]) => builderOutput.success
-        ? waitUntilServerIsListening(nodeServerPort)
-        : EMPTY)
+          ? waitUntilServerIsListening(nodeServerPort)
+          : EMPTY)
       );
     }),
     concatMap(([builderOutput, nodeServerPort]) => {
@@ -214,14 +214,18 @@ async function initBrowserSync(
   const bsOptions: browserSync.Options = {
     proxy: {
       target: `localhost:${nodeServerPort}`,
+      proxyOptions: {
+        xfwd: true
+      },
       proxyRes: [
         proxyRes => {
           if ('headers' in proxyRes) {
             proxyRes.headers['cache-control'] = undefined;
           }
         },
       ]
-    },
+      // proxyOptions is not in the typings
+    } as browserSync.ProxyOptions & { proxyOptions: { xfwd: boolean } },
     host,
     port: bsPort,
     ui: false,
@@ -247,13 +251,13 @@ async function initBrowserSync(
     const path = hasPathname ? pathname + defaultSocketIoPath : defaultSocketIoPath;
 
     bsOptions.socket = {
-        namespace,
-        path,
-        domain: url.format({
-            protocol,
-            hostname,
-            port,
-        }),
+      namespace,
+      path,
+      domain: url.format({
+        protocol,
+        hostname,
+        port,
+      }),
     };
 
     // When having a pathname we also need to create a reverse proxy because socket.io
@@ -278,12 +282,12 @@ async function initBrowserSync(
 
   return new Promise((resolve, reject) => {
     browserSyncInstance.init(bsOptions, (error, bs) => {
-        if (error) {
-          reject(error);
-        } else {
-          resolve(bs);
-        }
-      });
+      if (error) {
+        reject(error);
+      } else {
+        resolve(bs);
+      }
+    });
   });
 }