title: 404 (Not Found) error on calling local backend APIs in angular universal
body: <p>I have implemented angular universal in my project for performance and SEO reasons! every thing works fine when I 'run ng serve' , the app can communicate with backend , but when I run 'npm run build:ssr 'and then 'ng run serve:ssr' it gives me the 404 (Not Found) for all API calls and does not render the entire app.
  I would appreciate it if someone could help me .
  thanks.</p>
  <p><a href="https://i.stack.imgur.com/pxIkc.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/pxIkc.jpg" alt="enter image description here" /></a></p>
  <p>this is my server.ts file</p>
  <pre><code>import 'zone.js/dist/zone-node';
  
  import { ngExpressEngine } from '@nguniversal/express-engine';
  import * as express from 'express';
  import { join } from 'path';
  
  import { AppServerModule } from './src/main.server';
  import { APP_BASE_HREF } from '@angular/common';
  import { existsSync } from 'fs';
  
  // 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/angular-universal/browser');
    const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
  
    // Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
    server.engine('html', ngExpressEngine({
      bootstrap: AppServerModule,
    }));
  
    server.set('view engine', 'html');
    server.set('views', distFolder);
  
    // Example Express Rest API endpoints
    // server.get('/api/**', (req, res) =&gt; { });
    // Serve static files from /browser
    server.get('*.*', express.static(distFolder, {
      maxAge: '1y'
    }));
  
    // All regular routes use the Universal engine
    server.get('*', (req, res) =&gt; {
      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, () =&gt; {
      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 &amp;&amp; mainModule.filename || '';
  if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
    run();
  }
  
  export * from './src/main.server';
  </code></pre>