All requests are not found (404) when the application runs on an external server

up vote
0
down vote

favorite

My application works fine when served with the ng serve command or with the ng serve --prod command, but when I build it for production with the ng build --prod command and then serve it with the http-server -p 8080 -c-1 dist/ng-zero command or with the live-server --entry-file=dist/index.html command, any request has a 404 response.

I had a look at different questions and their answers here, but nothing helped. I tried the HashLocationStrategy suggestion, I tried the useHash: true one too, to no success.

The Http server starting the application:

$ http-server -p 8080 -c-1 dist/ng-zero

Starting up http-server, serving dist/ng-zero

Available on:

  http://127.0.0.1:8080

  http://192.168.0.7:8080

  http://172.19.0.1:8080

Hit CTRL-C to stop the server

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says:

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

The Lite server starting the application:

$ ll dist/index.html 

-rw-rw-r-- 1 stephane 925 oct.  12 19:35 dist/index.html

[stephane@stephane-ThinkPad-X201 ng-zero (master)]

$ live-server --entry-file=dist/index.html

Serving "/home/stephane/dev/js/projects/angular/ng-zero" at http://127.0.0.1:8080

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says nothing at all.

The index.html file:

$ cat src/index.html

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>NgZero</title>

  <base href="/">



  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="icon" type="image/x-icon" href="favicon.ico">

  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

  <link rel="manifest" href="manifest.json">

  <meta name="theme-color" content="#1976d2">

</head>

<body class="mat-app-background">

  <app-root></app-root>

  <noscript>Please enable JavaScript to continue using this application.</noscript>

</body>

</html>

EDIT:

Here is the folder structure:

$ tree 

.

├── app

│   ├── app.component.css

│   ├── app.component.html

│   ├── app.component.spec.ts

│   ├── app.component.ts

│   ├── app-gui.module.ts

│   ├── app.module.ts

│   ├── app-preloading-strategy.ts

│   ├── app-routing.module.ts

│   ├── core

│   │   ├── auth

│   │   │   ├── auth-guard.service.ts

│   │   │   ├── auth.interceptor.ts

│   │   │   ├── auth.module.ts

│   │   │   ├── auth.service.ts

│   │   │   ├── keycloak-client.service.spec.ts

│   │   │   ├── keycloak-client.service.ts

│   │   │   ├── keycloak.interceptor.ts

│   │   │   ├── token.service.spec.ts

│   │   │   └── token.service.ts

│   │   ├── error

│   │   │   ├── error.component.html

│   │   │   ├── error.component.scss

│   │   │   ├── error.component.ts

│   │   │   ├── error-custom-handler.ts

│   │   │   ├── error.module.ts

│   │   │   ├── error-request-interceptor.ts

│   │   │   ├── error-routing.module.ts

│   │   │   ├── error.service.ts

│   │   │   └── index.ts

│   │   ├── login

│   │   │   ├── login.component.css

│   │   │   ├── login.component.html

│   │   │   ├── login.component.spec.ts

│   │   │   ├── login.component.ts

│   │   │   ├── login-dialog.component.html

│   │   │   └── login-dialog.component.ts

│   │   ├── messages

│   │   │   ├── messages.component.css

│   │   │   ├── messages.component.html

│   │   │   ├── messages.component.spec.ts

│   │   │   ├── messages.component.ts

│   │   │   ├── message.service.spec.ts

│   │   │   └── message.service.ts

│   │   └── service

│   │       ├── http.service.ts

│   │       ├── notification.service.ts

│   │       ├── pagination.service.ts

│   │       └── utils.service.ts

│   ├── core.module.ts

│   ├── material.module.ts

│   └── views

│       ├── dashboard

│       │   ├── dashboard.component.css

│       │   ├── dashboard.component.html

│       │   ├── dashboard.component.spec.ts

│       │   └── dashboard.component.ts

│       ├── home

│       │   ├── home.component.css

│       │   ├── home.component.html

│       │   ├── home.component.spec.ts

│       │   ├── home.component.ts

│       │   ├── home.module.ts

│       │   └── home-routing.module.ts

│       └── user

│           ├── search.component.css

│           ├── search.component.html

│           ├── search.component.spec.ts

│           ├── search.component.ts

│           ├── user.component.css

│           ├── user.component.html

│           ├── user.component.spec.ts

│           ├── user.component.ts

│           ├── users.component.css

│           ├── users.component.html

│           ├── users.component.spec.ts

│           ├── users.component.ts

│           ├── user.service.spec.ts

│           ├── user.service.ts

│           └── user.ts

├── assets

│   └── icons

│       ├── icon-128x128.png

│       ├── icon-144x144.png

│       ├── icon-152x152.png

│       ├── icon-192x192.png

│       ├── icon-384x384.png

│       ├── icon-512x512.png

│       ├── icon-72x72.png

│       └── icon-96x96.png

├── environments

│   ├── environment.prod.ts

│   └── environment.ts

├── favicon.ico

├── index.html

├── main.ts

├── manifest.json

├── polyfills.ts

├── styles.css

├── test.ts

├── tsconfig.app.json

├── tsconfig.spec.json

└── typings.d.ts

I'm on Angular 7 ^7.0.0-rc.0

edited 20 hours ago

Goncalo Peres

8931311

asked Oct 12 at 20:23

Stephane

2,290114875

Is your application not served at all, and you're getting a 404 from the HTTP server? or is your Angular router returning its route not found handler?
– Brandon
Oct 12 at 20:40

I don't really understand what you mean when you say not served.
– Stephane
Oct 13 at 9:17

I added more information in the question.
– Stephane
Oct 13 at 9:23

add a comment |

up vote
0
down vote

favorite

I had a look at different questions and their answers here, but nothing helped. I tried the HashLocationStrategy suggestion, I tried the useHash: true one too, to no success.

The Http server starting the application:

$ http-server -p 8080 -c-1 dist/ng-zero

Starting up http-server, serving dist/ng-zero

Available on:

  http://127.0.0.1:8080

  http://192.168.0.7:8080

  http://172.19.0.1:8080

Hit CTRL-C to stop the server

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says:

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

The Lite server starting the application:

$ ll dist/index.html 

-rw-rw-r-- 1 stephane 925 oct.  12 19:35 dist/index.html

[stephane@stephane-ThinkPad-X201 ng-zero (master)]

$ live-server --entry-file=dist/index.html

Serving "/home/stephane/dev/js/projects/angular/ng-zero" at http://127.0.0.1:8080

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says nothing at all.

The index.html file:

$ cat src/index.html

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>NgZero</title>

  <base href="/">



  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="icon" type="image/x-icon" href="favicon.ico">

  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

  <link rel="manifest" href="manifest.json">

  <meta name="theme-color" content="#1976d2">

</head>

<body class="mat-app-background">

  <app-root></app-root>

  <noscript>Please enable JavaScript to continue using this application.</noscript>

</body>

</html>

EDIT:

Here is the folder structure:

$ tree 

.

├── app

│   ├── app.component.css

│   ├── app.component.html

│   ├── app.component.spec.ts

│   ├── app.component.ts

│   ├── app-gui.module.ts

│   ├── app.module.ts

│   ├── app-preloading-strategy.ts

│   ├── app-routing.module.ts

│   ├── core

│   │   ├── auth

│   │   │   ├── auth-guard.service.ts

│   │   │   ├── auth.interceptor.ts

│   │   │   ├── auth.module.ts

│   │   │   ├── auth.service.ts

│   │   │   ├── keycloak-client.service.spec.ts

│   │   │   ├── keycloak-client.service.ts

│   │   │   ├── keycloak.interceptor.ts

│   │   │   ├── token.service.spec.ts

│   │   │   └── token.service.ts

│   │   ├── error

│   │   │   ├── error.component.html

│   │   │   ├── error.component.scss

│   │   │   ├── error.component.ts

│   │   │   ├── error-custom-handler.ts

│   │   │   ├── error.module.ts

│   │   │   ├── error-request-interceptor.ts

│   │   │   ├── error-routing.module.ts

│   │   │   ├── error.service.ts

│   │   │   └── index.ts

│   │   ├── login

│   │   │   ├── login.component.css

│   │   │   ├── login.component.html

│   │   │   ├── login.component.spec.ts

│   │   │   ├── login.component.ts

│   │   │   ├── login-dialog.component.html

│   │   │   └── login-dialog.component.ts

│   │   ├── messages

│   │   │   ├── messages.component.css

│   │   │   ├── messages.component.html

│   │   │   ├── messages.component.spec.ts

│   │   │   ├── messages.component.ts

│   │   │   ├── message.service.spec.ts

│   │   │   └── message.service.ts

│   │   └── service

│   │       ├── http.service.ts

│   │       ├── notification.service.ts

│   │       ├── pagination.service.ts

│   │       └── utils.service.ts

│   ├── core.module.ts

│   ├── material.module.ts

│   └── views

│       ├── dashboard

│       │   ├── dashboard.component.css

│       │   ├── dashboard.component.html

│       │   ├── dashboard.component.spec.ts

│       │   └── dashboard.component.ts

│       ├── home

│       │   ├── home.component.css

│       │   ├── home.component.html

│       │   ├── home.component.spec.ts

│       │   ├── home.component.ts

│       │   ├── home.module.ts

│       │   └── home-routing.module.ts

│       └── user

│           ├── search.component.css

│           ├── search.component.html

│           ├── search.component.spec.ts

│           ├── search.component.ts

│           ├── user.component.css

│           ├── user.component.html

│           ├── user.component.spec.ts

│           ├── user.component.ts

│           ├── users.component.css

│           ├── users.component.html

│           ├── users.component.spec.ts

│           ├── users.component.ts

│           ├── user.service.spec.ts

│           ├── user.service.ts

│           └── user.ts

├── assets

│   └── icons

│       ├── icon-128x128.png

│       ├── icon-144x144.png

│       ├── icon-152x152.png

│       ├── icon-192x192.png

│       ├── icon-384x384.png

│       ├── icon-512x512.png

│       ├── icon-72x72.png

│       └── icon-96x96.png

├── environments

│   ├── environment.prod.ts

│   └── environment.ts

├── favicon.ico

├── index.html

├── main.ts

├── manifest.json

├── polyfills.ts

├── styles.css

├── test.ts

├── tsconfig.app.json

├── tsconfig.spec.json

└── typings.d.ts

I'm on Angular 7 ^7.0.0-rc.0

edited 20 hours ago

Goncalo Peres

8931311

asked Oct 12 at 20:23

Stephane

2,290114875

Is your application not served at all, and you're getting a 404 from the HTTP server? or is your Angular router returning its route not found handler?
– Brandon
Oct 12 at 20:40

I don't really understand what you mean when you say not served.
– Stephane
Oct 13 at 9:17

I added more information in the question.
– Stephane
Oct 13 at 9:23

add a comment |

up vote
0
down vote

favorite

I had a look at different questions and their answers here, but nothing helped. I tried the HashLocationStrategy suggestion, I tried the useHash: true one too, to no success.

The Http server starting the application:

$ http-server -p 8080 -c-1 dist/ng-zero

Starting up http-server, serving dist/ng-zero

Available on:

  http://127.0.0.1:8080

  http://192.168.0.7:8080

  http://172.19.0.1:8080

Hit CTRL-C to stop the server

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says:

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

The Lite server starting the application:

$ ll dist/index.html 

-rw-rw-r-- 1 stephane 925 oct.  12 19:35 dist/index.html

[stephane@stephane-ThinkPad-X201 ng-zero (master)]

$ live-server --entry-file=dist/index.html

Serving "/home/stephane/dev/js/projects/angular/ng-zero" at http://127.0.0.1:8080

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says nothing at all.

The index.html file:

$ cat src/index.html

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>NgZero</title>

  <base href="/">



  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="icon" type="image/x-icon" href="favicon.ico">

  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

  <link rel="manifest" href="manifest.json">

  <meta name="theme-color" content="#1976d2">

</head>

<body class="mat-app-background">

  <app-root></app-root>

  <noscript>Please enable JavaScript to continue using this application.</noscript>

</body>

</html>

EDIT:

Here is the folder structure:

$ tree 

.

├── app

│   ├── app.component.css

│   ├── app.component.html

│   ├── app.component.spec.ts

│   ├── app.component.ts

│   ├── app-gui.module.ts

│   ├── app.module.ts

│   ├── app-preloading-strategy.ts

│   ├── app-routing.module.ts

│   ├── core

│   │   ├── auth

│   │   │   ├── auth-guard.service.ts

│   │   │   ├── auth.interceptor.ts

│   │   │   ├── auth.module.ts

│   │   │   ├── auth.service.ts

│   │   │   ├── keycloak-client.service.spec.ts

│   │   │   ├── keycloak-client.service.ts

│   │   │   ├── keycloak.interceptor.ts

│   │   │   ├── token.service.spec.ts

│   │   │   └── token.service.ts

│   │   ├── error

│   │   │   ├── error.component.html

│   │   │   ├── error.component.scss

│   │   │   ├── error.component.ts

│   │   │   ├── error-custom-handler.ts

│   │   │   ├── error.module.ts

│   │   │   ├── error-request-interceptor.ts

│   │   │   ├── error-routing.module.ts

│   │   │   ├── error.service.ts

│   │   │   └── index.ts

│   │   ├── login

│   │   │   ├── login.component.css

│   │   │   ├── login.component.html

│   │   │   ├── login.component.spec.ts

│   │   │   ├── login.component.ts

│   │   │   ├── login-dialog.component.html

│   │   │   └── login-dialog.component.ts

│   │   ├── messages

│   │   │   ├── messages.component.css

│   │   │   ├── messages.component.html

│   │   │   ├── messages.component.spec.ts

│   │   │   ├── messages.component.ts

│   │   │   ├── message.service.spec.ts

│   │   │   └── message.service.ts

│   │   └── service

│   │       ├── http.service.ts

│   │       ├── notification.service.ts

│   │       ├── pagination.service.ts

│   │       └── utils.service.ts

│   ├── core.module.ts

│   ├── material.module.ts

│   └── views

│       ├── dashboard

│       │   ├── dashboard.component.css

│       │   ├── dashboard.component.html

│       │   ├── dashboard.component.spec.ts

│       │   └── dashboard.component.ts

│       ├── home

│       │   ├── home.component.css

│       │   ├── home.component.html

│       │   ├── home.component.spec.ts

│       │   ├── home.component.ts

│       │   ├── home.module.ts

│       │   └── home-routing.module.ts

│       └── user

│           ├── search.component.css

│           ├── search.component.html

│           ├── search.component.spec.ts

│           ├── search.component.ts

│           ├── user.component.css

│           ├── user.component.html

│           ├── user.component.spec.ts

│           ├── user.component.ts

│           ├── users.component.css

│           ├── users.component.html

│           ├── users.component.spec.ts

│           ├── users.component.ts

│           ├── user.service.spec.ts

│           ├── user.service.ts

│           └── user.ts

├── assets

│   └── icons

│       ├── icon-128x128.png

│       ├── icon-144x144.png

│       ├── icon-152x152.png

│       ├── icon-192x192.png

│       ├── icon-384x384.png

│       ├── icon-512x512.png

│       ├── icon-72x72.png

│       └── icon-96x96.png

├── environments

│   ├── environment.prod.ts

│   └── environment.ts

├── favicon.ico

├── index.html

├── main.ts

├── manifest.json

├── polyfills.ts

├── styles.css

├── test.ts

├── tsconfig.app.json

├── tsconfig.spec.json

└── typings.d.ts

I'm on Angular 7 ^7.0.0-rc.0

edited 20 hours ago

Goncalo Peres

8931311

asked Oct 12 at 20:23

Stephane

2,290114875

I had a look at different questions and their answers here, but nothing helped. I tried the HashLocationStrategy suggestion, I tried the useHash: true one too, to no success.

The Http server starting the application:

$ http-server -p 8080 -c-1 dist/ng-zero

Starting up http-server, serving dist/ng-zero

Available on:

  http://127.0.0.1:8080

  http://192.168.0.7:8080

  http://172.19.0.1:8080

Hit CTRL-C to stop the server

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says:

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:19:38 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36"

[Sat Oct 13 2018 11:20:51 GMT+0200 (CEST)] "GET /" Error (404): "Not found"

The Lite server starting the application:

$ ll dist/index.html 

-rw-rw-r-- 1 stephane 925 oct.  12 19:35 dist/index.html

[stephane@stephane-ThinkPad-X201 ng-zero (master)]

$ live-server --entry-file=dist/index.html

Serving "/home/stephane/dev/js/projects/angular/ng-zero" at http://127.0.0.1:8080

It does open a new browser tab on http://127.0.0.1:8080/ but it is blank and the console says nothing at all.

The index.html file:

$ cat src/index.html

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>NgZero</title>

  <base href="/">



  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="icon" type="image/x-icon" href="favicon.ico">

  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

  <link rel="manifest" href="manifest.json">

  <meta name="theme-color" content="#1976d2">

</head>

<body class="mat-app-background">

  <app-root></app-root>

  <noscript>Please enable JavaScript to continue using this application.</noscript>

</body>

</html>

EDIT:

Here is the folder structure:

$ tree 

.

├── app

│   ├── app.component.css

│   ├── app.component.html

│   ├── app.component.spec.ts

│   ├── app.component.ts

│   ├── app-gui.module.ts

│   ├── app.module.ts

│   ├── app-preloading-strategy.ts

│   ├── app-routing.module.ts

│   ├── core

│   │   ├── auth

│   │   │   ├── auth-guard.service.ts

│   │   │   ├── auth.interceptor.ts

│   │   │   ├── auth.module.ts

│   │   │   ├── auth.service.ts

│   │   │   ├── keycloak-client.service.spec.ts

│   │   │   ├── keycloak-client.service.ts

│   │   │   ├── keycloak.interceptor.ts

│   │   │   ├── token.service.spec.ts

│   │   │   └── token.service.ts

│   │   ├── error

│   │   │   ├── error.component.html

│   │   │   ├── error.component.scss

│   │   │   ├── error.component.ts

│   │   │   ├── error-custom-handler.ts

│   │   │   ├── error.module.ts

│   │   │   ├── error-request-interceptor.ts

│   │   │   ├── error-routing.module.ts

│   │   │   ├── error.service.ts

│   │   │   └── index.ts

│   │   ├── login

│   │   │   ├── login.component.css

│   │   │   ├── login.component.html

│   │   │   ├── login.component.spec.ts

│   │   │   ├── login.component.ts

│   │   │   ├── login-dialog.component.html

│   │   │   └── login-dialog.component.ts

│   │   ├── messages

│   │   │   ├── messages.component.css

│   │   │   ├── messages.component.html

│   │   │   ├── messages.component.spec.ts

│   │   │   ├── messages.component.ts

│   │   │   ├── message.service.spec.ts

│   │   │   └── message.service.ts

│   │   └── service

│   │       ├── http.service.ts

│   │       ├── notification.service.ts

│   │       ├── pagination.service.ts

│   │       └── utils.service.ts

│   ├── core.module.ts

│   ├── material.module.ts

│   └── views

│       ├── dashboard

│       │   ├── dashboard.component.css

│       │   ├── dashboard.component.html

│       │   ├── dashboard.component.spec.ts

│       │   └── dashboard.component.ts

│       ├── home

│       │   ├── home.component.css

│       │   ├── home.component.html

│       │   ├── home.component.spec.ts

│       │   ├── home.component.ts

│       │   ├── home.module.ts

│       │   └── home-routing.module.ts

│       └── user

│           ├── search.component.css

│           ├── search.component.html

│           ├── search.component.spec.ts

│           ├── search.component.ts

│           ├── user.component.css

│           ├── user.component.html

│           ├── user.component.spec.ts

│           ├── user.component.ts

│           ├── users.component.css

│           ├── users.component.html

│           ├── users.component.spec.ts

│           ├── users.component.ts

│           ├── user.service.spec.ts

│           ├── user.service.ts

│           └── user.ts

├── assets

│   └── icons

│       ├── icon-128x128.png

│       ├── icon-144x144.png

│       ├── icon-152x152.png

│       ├── icon-192x192.png

│       ├── icon-384x384.png

│       ├── icon-512x512.png

│       ├── icon-72x72.png

│       └── icon-96x96.png

├── environments

│   ├── environment.prod.ts

│   └── environment.ts

├── favicon.ico

├── index.html

├── main.ts

├── manifest.json

├── polyfills.ts

├── styles.css

├── test.ts

├── tsconfig.app.json

├── tsconfig.spec.json

└── typings.d.ts

I'm on Angular 7 ^7.0.0-rc.0

angular request angular7

edited 20 hours ago

Goncalo Peres

8931311

asked Oct 12 at 20:23

Stephane

2,290114875

edited 20 hours ago

Goncalo Peres

8931311

asked Oct 12 at 20:23

Stephane

2,290114875

edited 20 hours ago

Goncalo Peres

8931311

edited 20 hours ago

Goncalo Peres

8931311

edited 20 hours ago

Goncalo Peres

8931311

asked Oct 12 at 20:23

Stephane

2,290114875

asked Oct 12 at 20:23

Stephane

2,290114875

asked Oct 12 at 20:23

Stephane

2,290114875

Is your application not served at all, and you're getting a 404 from the HTTP server? or is your Angular router returning its route not found handler?
– Brandon
Oct 12 at 20:40

I don't really understand what you mean when you say not served.
– Stephane
Oct 13 at 9:17

I added more information in the question.
– Stephane
Oct 13 at 9:23

add a comment |

Is your application not served at all, and you're getting a 404 from the HTTP server? or is your Angular router returning its route not found handler?
– Brandon
Oct 12 at 20:40

I don't really understand what you mean when you say not served.
– Stephane
Oct 13 at 9:17

I added more information in the question.
– Stephane
Oct 13 at 9:23

Is your application not served at all, and you're getting a 404 from the HTTP server? or is your Angular router returning its route not found handler?
– Brandon
Oct 12 at 20:40

I don't really understand what you mean when you say not served.
– Stephane
Oct 13 at 9:17

I added more information in the question.
– Stephane
Oct 13 at 9:23

add a comment |

1 Answer
1

active

oldest

votes

up vote
0
down vote

accepted

The ng build --prod command pushes all required files under the /dist folder. You just need to copy those files in the server.

If you want to serve the content from the /dist folder

install angular-http-server

serve the application as in angular-http-server --path dist/

edited Oct 13 at 10:19

Stephane

2,290114875

answered Oct 12 at 20:40

Sunil Singh

5,4571625

Why should I copy these files at all ? The server, from where I start it, can find these files.
– Stephane
Oct 13 at 9:15

NodeJS will not be aware that if it should run the compiled files ( ready for production ). It will keeping using the development source file. So once the files are generated you can put those files in any web server IIS or Apache.
– Sunil Singh
Oct 13 at 9:31

1

Please refer this stackoverflow.com/questions/43389539/…
– Sunil Singh
Oct 13 at 9:34

I had followed these instructions https://angular.io/guide/service-worker-getting-started where it says ng build --prod and http-server -p 8080 -c-1 dist/<project-name>
– Stephane
Oct 13 at 9:49

I can now serve the application fine using the angular-http-server as in angular-http-server --path dist/ but I'd like to have it work under the other servers too.
– Stephane
Oct 13 at 9:53

|
show 1 more comment

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f52786539%2fall-requests-are-not-found-404-when-the-application-runs-on-an-external-server%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

up vote
0
down vote

accepted

The ng build --prod command pushes all required files under the /dist folder. You just need to copy those files in the server.

If you want to serve the content from the /dist folder

install angular-http-server

serve the application as in angular-http-server --path dist/

edited Oct 13 at 10:19

Stephane

2,290114875

answered Oct 12 at 20:40

Sunil Singh

5,4571625

Why should I copy these files at all ? The server, from where I start it, can find these files.
– Stephane
Oct 13 at 9:15

NodeJS will not be aware that if it should run the compiled files ( ready for production ). It will keeping using the development source file. So once the files are generated you can put those files in any web server IIS or Apache.
– Sunil Singh
Oct 13 at 9:31

1

Please refer this stackoverflow.com/questions/43389539/…
– Sunil Singh
Oct 13 at 9:34

I had followed these instructions https://angular.io/guide/service-worker-getting-started where it says ng build --prod and http-server -p 8080 -c-1 dist/<project-name>
– Stephane
Oct 13 at 9:49

I can now serve the application fine using the angular-http-server as in angular-http-server --path dist/ but I'd like to have it work under the other servers too.
– Stephane
Oct 13 at 9:53

|
show 1 more comment

up vote
0
down vote

accepted

The ng build --prod command pushes all required files under the /dist folder. You just need to copy those files in the server.

If you want to serve the content from the /dist folder

install angular-http-server

serve the application as in angular-http-server --path dist/

edited Oct 13 at 10:19

Stephane

2,290114875

answered Oct 12 at 20:40

Sunil Singh

5,4571625

Why should I copy these files at all ? The server, from where I start it, can find these files.
– Stephane
Oct 13 at 9:15

NodeJS will not be aware that if it should run the compiled files ( ready for production ). It will keeping using the development source file. So once the files are generated you can put those files in any web server IIS or Apache.
– Sunil Singh
Oct 13 at 9:31

1

Please refer this stackoverflow.com/questions/43389539/…
– Sunil Singh
Oct 13 at 9:34

I had followed these instructions https://angular.io/guide/service-worker-getting-started where it says ng build --prod and http-server -p 8080 -c-1 dist/<project-name>
– Stephane
Oct 13 at 9:49

I can now serve the application fine using the angular-http-server as in angular-http-server --path dist/ but I'd like to have it work under the other servers too.
– Stephane
Oct 13 at 9:53

|
show 1 more comment

up vote
0
down vote

accepted

The ng build --prod command pushes all required files under the /dist folder. You just need to copy those files in the server.

If you want to serve the content from the /dist folder

install angular-http-server

serve the application as in angular-http-server --path dist/

edited Oct 13 at 10:19

Stephane

2,290114875

answered Oct 12 at 20:40

Sunil Singh

5,4571625

The ng build --prod command pushes all required files under the /dist folder. You just need to copy those files in the server.

If you want to serve the content from the /dist folder

install angular-http-server

serve the application as in angular-http-server --path dist/

edited Oct 13 at 10:19

Stephane

2,290114875

answered Oct 12 at 20:40

Sunil Singh

5,4571625

edited Oct 13 at 10:19

Stephane

2,290114875

edited Oct 13 at 10:19

Stephane

2,290114875

edited Oct 13 at 10:19

Stephane

2,290114875

answered Oct 12 at 20:40

Sunil Singh

5,4571625

answered Oct 12 at 20:40

Sunil Singh

5,4571625

answered Oct 12 at 20:40

Sunil Singh

5,4571625

Why should I copy these files at all ? The server, from where I start it, can find these files.
– Stephane
Oct 13 at 9:15

NodeJS will not be aware that if it should run the compiled files ( ready for production ). It will keeping using the development source file. So once the files are generated you can put those files in any web server IIS or Apache.
– Sunil Singh
Oct 13 at 9:31

1

Please refer this stackoverflow.com/questions/43389539/…
– Sunil Singh
Oct 13 at 9:34

I had followed these instructions https://angular.io/guide/service-worker-getting-started where it says ng build --prod and http-server -p 8080 -c-1 dist/<project-name>
– Stephane
Oct 13 at 9:49

I can now serve the application fine using the angular-http-server as in angular-http-server --path dist/ but I'd like to have it work under the other servers too.
– Stephane
Oct 13 at 9:53

|
show 1 more comment

Why should I copy these files at all ? The server, from where I start it, can find these files.
– Stephane
Oct 13 at 9:15

NodeJS will not be aware that if it should run the compiled files ( ready for production ). It will keeping using the development source file. So once the files are generated you can put those files in any web server IIS or Apache.
– Sunil Singh
Oct 13 at 9:31

1

Please refer this stackoverflow.com/questions/43389539/…
– Sunil Singh
Oct 13 at 9:34

I had followed these instructions https://angular.io/guide/service-worker-getting-started where it says ng build --prod and http-server -p 8080 -c-1 dist/<project-name>
– Stephane
Oct 13 at 9:49

I can now serve the application fine using the angular-http-server as in angular-http-server --path dist/ but I'd like to have it work under the other servers too.
– Stephane
Oct 13 at 9:53

Why should I copy these files at all ? The server, from where I start it, can find these files.
– Stephane
Oct 13 at 9:15

NodeJS will not be aware that if it should run the compiled files ( ready for production ). It will keeping using the development source file. So once the files are generated you can put those files in any web server IIS or Apache.
– Sunil Singh
Oct 13 at 9:31

Please refer this stackoverflow.com/questions/43389539/…
– Sunil Singh
Oct 13 at 9:34

I had followed these instructions https://angular.io/guide/service-worker-getting-started where it says ng build --prod and http-server -p 8080 -c-1 dist/<project-name>
– Stephane
Oct 13 at 9:49

I can now serve the application fine using the angular-http-server as in angular-http-server --path dist/ but I'd like to have it work under the other servers too.
– Stephane
Oct 13 at 9:53

|
show 1 more comment

draft saved

draft discarded

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

Search This Blog

Ufyukyu