Firebase с Angular 6 не перенаправляет на index.html - PullRequest
Новая
       15

Firebase с Angular 6 не перенаправляет на index.html

0 голосов
/ 01 сентября 2018

У меня приложение Angular 6, развернутое в Firebase, однако, когда я перехожу к URL-адресу, на котором развернуло мое приложение, оно не перенаправляется в index.html. Показывает только страницу документации просмотра.

Однако, если я напишу адрес с помощью /index.html, он будет работать безупречно.

Вот мой FireBase JSON: 

{
  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

Вот мой угловой маршрут: 

const appRoutes: Routes = [
  { path: 'home', component: HomeComponent },
  { path: 'add-recipe', component: AddrecipeComponent },
  { path: 'edit-recipe/:id', component: EditrecipeComponent },
  { path: 'recipe-detail/:id',      component: RecipedetailComponent },
  { path: 'shopping-list',      component: ShoppinglistComponent },
  { path: '',
    redirectTo: '/home',
    pathMatch: 'full'
  },
  { path: '**', component: HomeComponent }
];

И в моем файле index.html это мой базовый href: 

<base href="/">

Во время настройки я установил, что это одностраничное приложение.

Спасибо за вашу помощь.

РЕДАКТИРОВАТЬ: когда я тестирую его с localhost, он перенаправляет безупречно.

Ответы [ 2 ]

0 голосов
/ 01 сентября 2018

Решение проблемы для всех, кто сталкивался с этой проблемой: HomeComponent был определен дважды в appRoutes, и хотя у localhost нет проблем с ним, Firebase сделал.

В соответствии с угловой документацией , вам не нужно определять дубликаты маршрутов.

Чтобы просто решить проблему, я убрал строку 

{ path: 'home', component: HomeComponent },

и проблема исчезла.

Другим способом решения этой проблемы является принятый ответ, который на самом деле является лучшим решением.

0 голосов
/ 01 сентября 2018

redirectTo должно иметь значение route, т.е. path с '/'.

Изменить redirectTo: 'home', на redirectTo: '/home',

Кроме того, я думаю, что последние два сегмента в конфигурации маршрута являются избыточными. Пожалуйста, измените его на следующее: 

const appRoutes: Routes = [
  { path: 'home', component: HomeComponent },
  { path: 'add-recipe', component: AddrecipeComponent },
  { path: 'edit-recipe/:id', component: EditrecipeComponent },
  { path: 'recipe-detail/:id',      component: RecipedetailComponent },
  { path: 'shopping-list',      component: ShoppinglistComponent },
  { path: '**', redirectTo: '/home' }
];
...