Halaman

    Social Items


I am gonna be very brief.

I have an Angular project with simple navigation menu (routerLinks). Everything work as it is supposed to if it is on localhost, powered by angular cli.

But when I deploy it on a real server (i don't have any VPS or any other server, just folder where I can put my files) weird thing starts happening.

The app is functional, navigation is functional, routeLinks routing, but when I refresh a browser or try to write something manually into URL line, every time I get 404 Not found. (so i am in [domain]/home - everything is ok, but when i refresh browser, i got 404 /home not found.

Maybe I am looking for a problem in a bad place and it is not a problem of angular but about HTTP requests (i don't know much about it).

Do you have any idea where I should start?


Solution :

For Apache HTTP server:

i created .htaccess file and put it into root folder on a provider side.

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

Follow this link to fix this issue Angular 2 Hosted on IIS: HTTP Error 404 or just

Step 1: Install IIS URL Rewrite Module

Step 2: Add a rewrite rule to web.config

<?xml version="1.0" encoding="utf-8"?>
    <configuration>
      <system.webServer>
        <rewrite>
          <rules>
            <rule name="AngularJS Routes" stopProcessing="true">
              <match url=".*" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />   
              </conditions>
              <action type="Rewrite" url="/" />
            </rule>
          </rules>
        </rewrite>
      </system.webServer>
    </configuration>

Angular - The requested URL /home was not found on this server


I am gonna be very brief.

I have an Angular project with simple navigation menu (routerLinks). Everything work as it is supposed to if it is on localhost, powered by angular cli.

But when I deploy it on a real server (i don't have any VPS or any other server, just folder where I can put my files) weird thing starts happening.

The app is functional, navigation is functional, routeLinks routing, but when I refresh a browser or try to write something manually into URL line, every time I get 404 Not found. (so i am in [domain]/home - everything is ok, but when i refresh browser, i got 404 /home not found.

Maybe I am looking for a problem in a bad place and it is not a problem of angular but about HTTP requests (i don't know much about it).

Do you have any idea where I should start?


Solution :

For Apache HTTP server:

i created .htaccess file and put it into root folder on a provider side.

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

Follow this link to fix this issue Angular 2 Hosted on IIS: HTTP Error 404 or just

Step 1: Install IIS URL Rewrite Module

Step 2: Add a rewrite rule to web.config

<?xml version="1.0" encoding="utf-8"?>
    <configuration>
      <system.webServer>
        <rewrite>
          <rules>
            <rule name="AngularJS Routes" stopProcessing="true">
              <match url=".*" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />   
              </conditions>
              <action type="Rewrite" url="/" />
            </rule>
          </rules>
        </rewrite>
      </system.webServer>
    </configuration>

No comments