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。 –