Angular - 在此服务器上找不到请求的URL / home

时间:2017-12-14 13:12:35

标签: angular url http-status-code-404

我会非常简短。

我有一个带有简单导航菜单(routerLinks)的Angular项目。 如果它是在本地主机上,由角度cli驱动,一切都按预期工作。

但是当我将它部署在真实服务器上时(我没有任何VPS或任何其他服务器,只有我可以放置文件的文件夹)奇怪的事情开始发生。

该应用程序功能正常,导航功能正常,路由链接路由,但是当我刷新浏览器或尝试手动将某些内容写入URL行时,每次我找到404 Not found。 (所以我在[domain] / home - 一切都很好,但是当我刷新浏览器时,我找不到404 / home。

也许我在一个不好的地方寻找问题,这不是有角度的问题,而是关于HTTP请求(我不太了解它)。

你知道我应该从哪里开始吗?

谢谢你,Pavel F.

项目我所谈论的内容:http://www.pavel-challenge.cz(不,这不是广告:D)

  

APP-routing.module.ts

    Select Case a

        Case 0
            a += 1
        Case 1
            a += 2
        Case 2
            a += 4
        Case 3
            a += 8
        Case 4
            a += 16
        Case 5
            a += 32
        Case 6
            a += 64
        Case Else
            a + = 128
    End Select
  

navbar.component.html

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { PassionsComponent } from './passions/passions.component';
import { QuestionComponent } from './question/question.component';
import { AboutComponent } from './about/about.component';
import { HomeComponent } from './home/home.component';
import { KnowledgeComponent } from './knowledge/knowledge.component';

const routes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent },
  { path: 'about', component: AboutComponent },
  { path: 'knowledge', component: KnowledgeComponent },
  { path: 'questions', component: QuestionComponent },
  { path: 'passions', component: PassionsComponent },
  { path: '**', redirectTo: '/home', pathMatch: 'full' }
];

@NgModule({
  imports: [ RouterModule.forRoot(routes) ],
  exports: [ RouterModule ]
})
export class AppRoutingModule {}

4 个答案:

答案 0 :(得分:19)

FIXED :(对于Apache HTTP服务器)

我创建了.htaccess文件并将其放在提供者端的根文件夹中。

  

的.htaccess

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

答案 1 :(得分:2)

问题出在您的HTTP服务器配置中。

您必须在主机名指向嵌入角度应用程序的HTML资源后创建所有URL。

就像NGINX:

 location / {
       root <path to index.html>;
       try_files $uri  /index.html =404;
( if ressource exist serves it, likes images, else load index.html to load angular app )
    }

here is the official documentation

在初始加载后导航时,角度路由器取得领先,并在没有http请求的情况下动态更改位置后显示数据。

但如果您直接加载到&lt; ...&gt; / home,http服务器肯定会尝试加载文件home.html,然后发送404.

答案 2 :(得分:0)

如果要在Apache上进行部署,则应启用mod_rewrite模块:

sudo a2enmod重写

然后重新启动Apache, sudo systemctl restart apache2

然后按照先前的答案对.htaccess进行建议的更改

答案 3 :(得分:0)

退房

  

https://angular.io/docs/ts/latest/guide/deployment.html

它解释了为什么需要配置生产服务器,并为普通服务器提供了大量示例配置。