Angular Application only root path works on Apache Web Server

Question

I am deploying an Angular 4 application on an EC2 instance. I compiled the application with ng build --prod and moved the contents of the dist directory to /var/www/html. Furthermore, I have started the web service daemon with sudo service httpd start. The webpage works except that I can only access routes via the main page.

For example I can get to:

http://my-page.com/dashboard

only by first visiting

http://my-page.com

and then clicking on the dashboard button. However, I cannot access this portion of the application directly by navigating to http://my-page.com/dachboard as was possible in the the angular development environment (Angular CLI server).

I would like to know if this is possible and how to achieve this. The steps that I have taken to try to resolve this are

Enable mod_proxy by adding RewriteEnging On and adding ProxyPass * http://my-page.com/ and ProxyPassReverse * http://my-page.com/ to the httpd.conf file
Try to add AllowOverride All to the httpd.conf file
Configuring .htaccess to allow RewiteEngine.

Ugh, this thing that is HTML5 mode. I still fight it on different platforms. Haven't hit this one yet though, have you seen this? It sounds like you are on the right track. ngmilk.rocks/2015/03/09/…. Interesting note in there I hadn't thought of before, this can affect SEO. — Brian
– Brian, Commented Dec 14, 2017 at 0:44

Jon Deaton · Accepted Answer · 2017-12-14 01:20:01Z

1

Take a look at this article describing how to deploy an Angular application on Apache. The steps you missed are adding:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

to .htaccess and adding

<Directory "/var/www/html">
  AllowOverride All
</Directory>

to the <VirtualHost *:80> section of /etc/httpd/conf/httpd.conf file. That should do the trick.

answered Dec 14, 2017 at 1:20

Jon Deaton

4,4997 gold badges31 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jon Deaton Over a year ago

Someone remind me to mark this as the correct answer.

Collectives™ on Stack Overflow

Angular Application only root path works on Apache Web Server

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related