If you need to deploy an Angular application on a server running Apache, and are making use of routing for navigation, you can’t just upload the built application onto the server and be done with it. As soon as you navigate to another path, the Apache server will try to look for that resource on the server and most likely will give you an 404 Not Found error.
You need to rewrite all the URLs to the index.html
so that the Angular application can take care of it. Your server needs to support mod_rewrite
for that. If that is the case, you can upload a file .htaccess
with the following content to your directory where the Angular application resides in.
RewriteEngine on
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !^/assets/(.+)$
RewriteRule ^(.+)$ index.html?path=$1 [L]
This will rewrite all requests to the index.html
file and append any extra path to it. Unless, the request is for an existing file or directory on the server, then it will not rewrite it. This is necessary for the additional resources that will need to be loaded, such as CSS and JS files and images.
In order to get the necessary feedback when a resource is requested that does not exist, the third condition excludes to rewrite any request located inside the assets folder.
thank you.. this is the first blog that I found .. and it’s works
Hi This is not working for apache 2.4 any reason.
What exactly does not work? Do you get an error message?
Life saver!!!! Totally works on shared host 1&1!!!
hello sir could you guide how to deploy this project in apache server when you convert your project in seo friendly using universal toolkit and by running npm run build:ssr it is working fine on localhost port localhost:8000 and it create dist/browser and server folder and server.js directories how to upload it on apache server in proper way and create seo friendly tags. please help your kindness
This isn’t working on localhost port 5500
superb…works well…
however, I had to make one small change to the last line:
RewriteRule ^(.+)$ my-app/index.html?path=$1 [L]
This is propably because I am having my app under the ‘my-app’ folder in the document root…
In the RewriteBase line u didn’t add that /my-app/ like this?
If you have
RewriteBase /
you shouldn’t need the/
at the beginning.