angular - Apache2 Angular11 应用程序不会路由到新页面

问题描述

我制作了一个在 apache2 服务器上运行的 Angular 应用程序。一切都在本地运行良好，但在 apache 中我被困在“root/login”页面上。我看到它向后端发送了一个登录请求，但它没有被路由到“主页”页面。我在 URL 中使用了 # 哈希，因为我读到这可以解决问题。我还尝试激活 apache 站点中的符号链接启用配置，但没有运气。

我使用 ng build --prod 来构建应用程序并将文件从 dist 文件夹粘贴到 var/www/html 用于 apache。登录页面渲染良好，但没有转到主页。它只是停留在登录页面上，我没有收到任何错误。

我的角度路由模块：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { WelcomeComponent } from './components/welcome/welcome.component';
import { LoginComponent } from './components/welcome/login/login.component';
import { RegisterComponent } from './components/welcome/register/register.component';
import { HomeComponent } from './components/home/home.component';
import { AuthGuard } from './auth/auth.guard';

const routes: Routes = [
  { path: 'home', component: HomeComponent, canActivate: [AuthGuard] },
  { path: '', component: WelcomeComponent, pathMatch: 'full' },
  { path: 'login', component: LoginComponent },
  { path: 'register', component: RegisterComponent },
];

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

我的 apache2 000-degault.conf 文件：

<VirtualHost *:80>
    # The ServerName directive sets the request scheme, hostname and port that
    # the server uses to identify itself. This is used when creating
    # redirection URLs. In the context of virtual hosts, the ServerName
    # specifies what hostname must appear in the request's Host: header to
    # match this virtual host. For the default virtual host (this file) this
    # value is not decisive as it is used as a last resort host regardless.
    # However, you must set it for any further virtual host explicitly.
    #ServerName www.example.com

    #ServerAdmin webmaster@localhost
    #DocumentRoot /var/www/html
    DocumentRoot /var/www/html
    
    # redirect 404 to index page
    ErrorDocument 404 /index.html

    Options +FollowSymLinks
    #RewriteEngine on
    
    ProxyPreserveHost On
    ProxyPass /api http://127.0.0.1:8080/
    ProxyPassReverse /api http://127.0.0.1:8080/
    
    # Available loglevels: trace8, ..., trace1, debug, info, notice, warn,
    # error, crit, alert, emerg.
    # It is also possible to configure the loglevel for particular
    # modules, e.g.
    #LogLevel info ssl:warn
    
    <Directory /var/www/html>
    options Indexes FollowSymLinks MultiViews
    AllowOverride All
    Require all granted
    </Directory>

    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined

    # For most configuration files from conf-available/, which are
    # enabled or disabled at a global level, it is possible to
    # include a line for only one particular virtual host. For example the
    # following line enables the CGI configuration for this host only
    # after it has been globally disabled with "a2disconf".
    #Include conf-available/serve-cgi-bin.conf
</VirtualHost>

我需要在 Apache 或 Angular 中修复什么吗？

标签： angularapacheapache2

angular - Apache2 Angular11 应用程序不会路由到新页面

问题描述

解决方案

推荐阅读