Почему мое приложение Angular 5 не работает с глубокими ссылками? - PullRequest
Новая
       22

Почему мое приложение Angular 5 не работает с глубокими ссылками?

0 голосов
/ 16 мая 2018

Я разрабатываю одно приложение Angular 5, развернутое в Служба приложений Azure .Моя проблема в том, что когда я пытаюсь получить доступ по прямой ссылке, мое приложение перенаправляет меня на домашнюю страницу.

Это маршруты моего приложения: 

// Imports
@NgModule({
  declarations: [
    // declaratins
  ],
  imports: [
    // modules
    RouterModule.forRoot([
    { path: 'login', component: LoginComponent },
    { path: 'home', component: HomeComponent, canActivate: [AuthGuard] },
    { path: 'search', component: SearchComponent, canActivate: [AuthGuard] },
    { path: '', redirectTo: 'home', pathMatch: 'full', canActivate: [AuthGuard] }
]),
    // modues
  ],
  providers: [
    // Imports
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Я следовал за Инструкция по развертыванию angular изменение web.config следующим образом: 

<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="Angular Routes" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
          </conditions>
          <action type="Rewrite" url="/index.html" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>

Когда я перемещаюсь внутри приложения, я могу правильно просмотреть изменение URL, но если я пытаюсь перейти непосредственно по ссылке, напримерhttps://host/search Я перенаправлю на https://host/home.

Как я могу решить эту проблему?Спасибо

Ответы [ 2 ]

0 голосов
/ 17 мая 2018

Ciao,

Я нашел проблему. @ Мартин Брандл ответ правильный и полезный, но в моем случае проблема заключалась в том, что внутри моего app.component был внутри onOnInit один редирект на домашнюю страницу. 

ngOnInit() {
    this.router.navigate(['home']);
}

Спасибо

0 голосов
/ 16 мая 2018

Я думаю, что проблема в том, что действие переписывается в /index.html, где оно должно быть переписано просто /.

Вы можете взглянуть на веб-конфигурацию здесь: Web.config для размещенияУгловое приложение в Azure Web App

...