Угловая статическая база URl и маршрутизация с хешем верна - PullRequest
Новая
       7

Угловая статическая база URl и маршрутизация с хешем верна

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

Я использую Angular 6, я хочу, чтобы мое приложение имело статический базовый URL для конфигурации обратного прокси.

В моем index.html я установил базовый URL 

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>APM</title>
  <base href="/my-base">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <pm-root></pm-root>
</body>
</html>

В моем app.module.ts у меня настроена таблица маршрутизации 

import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

import { AppComponent } from './app.component';
import { WelcomeComponent } from './home/welcome.component';

@NgModule({
  declarations: [
    AppComponent,
    WelcomeComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    RouterModule.forRoot([
      { path: "welcome", component: WelcomeComponent },
      { path: "", redirectTo: "welcome", pathMatch: "full" },
      { path: "**", redirectTo: "welcome", pathMatch: "full" }
    ], { useHash: true })
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

После запуска приложения я заметил, что URL-адрес http://localhost:4200/my-base#/welcome, после my-base есть *.

Если я изменил код в маршрутизации на useHash: false, то # после моего базового URL-адреса и станет http://localhost:4200/my-base/welcome#/welcome

Я не смогу найти много информации, что именно означает useHash: false, что такоеследствие?

1 Ответ

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

Простая сводка

Основным отличием является то, прост ли сервер для реализации механизма перенаправления

useHash: true проще, чем useHash: false

Принцип

когда вы устанавливаете useHash: false, он использует PathLocationStrategy , он использует HTML5 pushstate, который требует поддержки сервера

Когда вы вводите URL для браузера 

localhost:4200/my-base/welcome/

Сервер должен перенаправить localhost: 4200 / my-base / welcome / на ваш index.html

useHash: true, он использует HashLocationStrategy

вам нужно добавить # после вашего base-href ('my-base'), URL-адрес 

localhost:4200/my-base/#/welcome/

Сервер напрямую отправляет запрос на localhost: 4200 / my-base / в ваш index.html, это легко реализовать на стороне сервера.

Reference

Angular Howдля работы на стороне сервера (IIS, Nginx) с помощью PathLocationStrategy (useHash: false)

...