0

我有一个单页网站在使用 angular cli 编写的 apache web 服务器上运行。我有一个主页和多个使用 routerlink 标签进行导航的链接，它们可以正常工作。但是，例如，当我单击“关于”时，它会导航到 website.net/about 并且一切都很完美，直到页面重新加载或者我在抛出 404 错误时手动输入 website.net/about。

这是主要的应用程序代码：

索引.html：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Title</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
</body>
</html>

app.module.ts：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule} from '@angular/router';

import { AppComponent } from './app.component';
import { ProgramsComponent } from './programs/programs.component';
import { AboutComponent } from './about/about.component';

@NgModule({
  declarations: [
    AppComponent,
    ProgramsComponent,
    AboutComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot([{
        path: 'programs',
        component: ProgramsComponent
      },
      {
        path: 'about',
        component: AboutComponent
      }
    ])
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts：

import { Component } from '@angular/core';
import {ProgramsComponent} from './programs/programs.component';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Title';
}

app.component.html：

<div id="header" style="text-align:Left">
  <header>
    <a href="../index.html">
      <h1>
        {{ title }}
      </h1>
    </a>
    <nav>
      <div class="nav-comp">
        <a routerLink="/about">About</a>
        <a routerLink="/programs">Programs</a>
      </div>
    </nav>
  </header>
</div>
<router-outlet></router-outlet>

任何帮助和/或链接将不胜感激，如果可以使用 apache Web 服务器修复它，我愿意以这种方式修复它，但不希望

4

2 回答 2

0

好的，所以我不得不做一些挖掘工作，我想感谢 reddit 上的 u/vaskemaskine 为这篇文章.htaccess提供文件和 sci buff，但我走了

所以首先/var/www/html我必须创建一个名为的文件.htaccess并将此代码放入其中

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) /index.html [NC,L]

然后为了允许这种情况发生，由于 Apache 2.4 的变化，我AllowOverrides不得不/etc/apache2/apache2.conf改变

<Directory />
        Options FollowSymLinks
        AllowOverride None
        Require all denied
</Directory>

<Directory /usr/share>
        AllowOverride None
        Require all granted
</Directory>

<Directory /var/www/>
        Options Indexes FollowSymLinks
        AllowOverride None
        Require all granted
</Directory>

至

<Directory />
        Options FollowSymLinks
        AllowOverride All
        Require all denied
</Directory>

<Directory /usr/share>
        AllowOverride All
        Require all granted
</Directory>

<Directory /var/www/>
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
</Directory>

然后我运行时出现错误，因为它没有安装，但只需在终端中RewriteEngine运行就可以清除它sudo a2enmod rewrite && sudo service apache2 restart

于 2018-05-28T23:16:46.800 回答
0

我猜问题出在您的 apache 配置中，显然您的代码没有问题。

于 2018-05-27T02:50:27.047 回答