title: Angular PWA app getting 504 (Gateway Timeout) calling Node JS/Express API, but only when running from device
body: <p><strong>Error</strong></p>
  
  <p>POST <a href="http://localhost:3000/api/user" rel="nofollow noreferrer">http://localhost:3000/api/user</a> 504 (Gateway Timeout)</p>
  
  <p>ERROR Server Error Code: 504 Message: Http failure response for <a href="http://localhost:3000/api/user" rel="nofollow noreferrer">http://localhost:3000/api/user</a>: 504 Gateway Timeout</p>
  
  <p><strong>Description</strong></p>
  
  <p>I am getting a 504 (Gateway Timeout) error when running this code on a device.  The POST request works if running with with "ng serve" on 4200.  The request also works if running with "http-server -p 8080 -c-1 dist/test504" on 8080 and testing with browser. I only get the 504 error when running with http-server and testing through an Android device, using Chrome (so I can inspect what is going on).  I imagine the difference is the Service Worker is proxying the call, but that's not helping me figure it out.  Also, tested API directly with Postman and it works fine.</p>
  
  <p>One thing to note is that the 504 error happens sub-second. It doesn't seem like it's waiting for anything.  It just times out immediately.</p>
  
  <p>I've created a simplified front and back-end, which still has the issue.  </p>
  
  <p><strong>Angular app.compoment.ts</strong></p>
  
  <p>saveUser() calls a Node JS/Express API running on localhost:3000.  </p>
  
  <pre><code>import { Component } from '@angular/core';
  import { HttpClient} from '@angular/common/http';
  import { Iuser } from './user';
  import { catchError } from 'rxjs/operators';
  import { throwError} from 'rxjs';
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  
  export class AppComponent {
    user: Iuser = {
      email: '',
      firstName: ''
    };
    result: any;
  
    constructor(private http: HttpClient) {}
  
    saveUser() {
      let nbr: number;
      let email: string;
  
      nbr = Math.floor(Math.random() * Math.floor(100));
      email = 'email' + nbr + '@gmail.com';
      this.user.email = email;
      this.user.firstName = 'test';
      console.log('user=', this.user);
  
      this.postUser(this.user)
      .pipe(
        catchError (this.handleError)
      )
      .subscribe(data =&gt; {
        console.log('result=', data);
        this.result =  JSON.stringify(data);
      });
    }
  
    private postUser(user: Iuser) {
      return this.http.post('http://localhost:3000/api/user', user);
    }
  
    private handleError(error) {
      let errorMessage = '';
      if (error.error instanceof ErrorEvent) {
          // client-side error
          errorMessage = `Client Error: ${error.error.message}`;
      } else {
          // server-side error
          errorMessage = `Server Error Code: ${error.status}\nMessage: ${error.message}`;
      }
      return throwError(errorMessage);
    }
  }
  </code></pre>
  
  <p><strong>Node JS/Express API</strong></p>
  
  <pre><code>const express = require('express');
  const bodyParser = require('body-parser');
  const mongoose = require('mongoose');
  
  const User = require('./models/user');
  
  const app = express();
  
  mongoose.connect(process.env.MONGO_CONNECT)
    .then(() =&gt; {
      console.log('Connected to database');
    })
    .catch(() =&gt; {
      console.log('Connection failed');
    });
  
  app.use(bodyParser.json());
  
  app.use((req,res, next) =&gt; {
    res.setHeader('Access-Control-Allow-Origin', process.env.CORS_ORIGIN);
    res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PATCH, DELETE, OPTIONS');
    next();
  });
  
  
  app.post('/api/user', (req, res,next) =&gt; {
    const user = new User({
      firstName: req.body.firstName,
      email: req.body.email
    });
    console.log(user);
    user.save();
    res.status(201).json({
      message: 'Post added successfully'
    });
  });
  
  module.exports = app;
  </code></pre>
  
  <p><strong>Versions</strong></p>
  
  <pre><code>Package                           Version
  -----------------------------------------------------------
  @angular-devkit/architect         0.803.22
  @angular-devkit/build-angular     0.803.22
  @angular-devkit/build-optimizer   0.803.22
  @angular-devkit/build-webpack     0.803.22
  @angular-devkit/core              8.3.22
  @angular-devkit/schematics        8.3.22
  @angular/cli                      8.3.22
  @angular/pwa                      0.803.22
  @ngtools/webpack                  8.3.22
  @schematics/angular               8.3.22
  @schematics/update                0.803.22
  rxjs                              6.5.4
  typescript                        3.5.1
  webpack                           4.39.2
  
  Node JS version is 12.13.1
  </code></pre>