Angular 2与Auth0路由错误404

我在Angular 2应用程序中使用Auth0身份验证。Angular 2与Auth0路由错误404

在运行本地主机的应用程序中一切正常，但是当我在服务器上运行它时（在我的域中），我卡住了。

我的问题似乎在路线中，但我知道的一切是：我猜。

问题：

我可以做我的角应用通过Auth0登录（没问题，本地主机都和服务器 - 也注销）。登录后，应用程序重定向到我的控制页面，没有问题，并在应用程序内我有菜单，我的其他页面与他们的路线等

在localhost确定，但在服务器上登录后，我可以在我的应用中浏览页面一切都出错了，我刚刚得到了一个404页（即使刚刚刷新）。

我也在使用JQuery和Materialise CSS。在我刷新它的加载并且效果起作用后，JQuery不加载。

代码：

app.routing.ts：

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

import { AuthGuard } from './auth/auth.guard'; 

import { HomeComponent } from './components/home/home.component'; 
import { PainelComponent } from './components/painel/painel.component'; 
import { ReunioesComponent } from './components/reunioes/reunioes.component'; 
import { AssociadosComponent } from './components/associados/associados.component'; 
import { CalendarioComponent } from './components/calendario/calendario.component'; 
import { TesourariaComponent } from './components/tesouraria/tesouraria.component'; 
import { DocumentosComponent } from './components/documentos/documentos.component'; 

const appRoutes: Routes = [ 
    { 
     path: '', 
     component: HomeComponent 
    }, 
    { 
     path: 'painel', 
     component: PainelComponent, 
     canActivate: [AuthGuard] 
    }, 
    { 
     path: 'associados', 
     component: AssociadosComponent, 
     canActivate: [AuthGuard] 
    }, 
    { 
     path: 'calendario', 
     component: CalendarioComponent, 
     canActivate: [AuthGuard] 
    }, 
    { 
     path: 'reunioes', 
     component: ReunioesComponent, 
     canActivate: [AuthGuard] 
    }, 
    { 
     path: 'tesouraria', 
     component: TesourariaComponent, 
     canActivate: [AuthGuard] 
    }, 
    { 
     path: 'documentos', 
     component: DocumentosComponent, 
     canActivate: [AuthGuard] 
    } 
]; 

export const appRoutingProviders: any[] = []; 
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes, {useHash: false})

auth.service.ts：

import { Injectable } from '@angular/core'; 
import { Router } from '@angular/router'; 
import { tokenNotExpired } from 'angular2-jwt'; 

declare var Auth0Lock: any; 

@Injectable() 
export class Auth { 
    lock = new Auth0Lock('SECRET', 'SECRET.auth0.com', {}); 

    constructor(private router: Router) { 
     this.lock.on("authenticated", (authResult) => { 
      this.lock.getProfile(authResult.idToken, (err, profile) => { 
       if(err) 
        throw new Error(err) 

       localStorage.setItem('profile', JSON.stringify(profile)); 
       localStorage.setItem('id_token', authResult.idToken); 

       this.router.navigate(['/painel']) 
      }) 
     }); 
    } 

    public login() { 
     this.lock.show() 
    } 

    public authenticated() { 
     return tokenNotExpired() 
    } 

    public logout() { 
     localStorage.removeItem('id_token'); 
     localStorage.removeItem('profile') 
    } 
}

sidenav.partial.html：

<ul id="slide-out" class="side-nav fixed"> 
    <li><a href="/associados"><i class="material-icons">group</i>Associados</a></li> 
    <li><a href="/calendario"><i class="material-icons">event</i>Calendário</a></li> 
    <li><a href="/painel"><i class="material-icons">new_releases</i>Calendário Próximo</a></li> 
    <li><a href="/reunioes"><i class="material-icons">forum</i>Reuniões</a></li> 
    <li><a href="/tesouraria"><i class="material-icons">monetization_on</i>Tesouraria</a></li> 
    <li><a href="/documentos"><i class="material-icons">attach_file</i>Documentos</a></li> 
    <li><br></li> 
    <li class="show-on-med-and-down hide-on-large-only"> 
     <a href="#!" (click)="auth.logout()"><i class="material-icons">close</i>Sair</a> 
    </li> 
</ul>

谢谢！

来源

2017-04-05 Paulo Tokarski Glinski

噢，我想我只是明白你的问题......你运行的是什么Web服务器？ – n00dl3

请在问题本身[mcve]中提供所有相关代码，而不仅仅是在第三方网站上。 –

Mike McCaughan我补充说，谢谢你的警告。我希望能帮助更多的人在代码中遇到同样的问题。问题解决了Jack Clancy。 –