Angular路由器将URL更改为基本href

Question

简而言之我的问题：

为什么散列模式下的角度路由器会将 url 路径的基础更改为我为基础 href 设置的内容？以及如何防止这种行为？

有关我的用例的更多详细信息...

我在 Angular 8 应用程序中使用哈希路由。

在我的 index.html 页面（这是在服务器上生成的 MVC 页面）中，我必须指定一个基本 href，以便我的 html 页面知道在哪里加载由 angular-cli 构建生成的所有 js 和 css 文件.加载 Angular 应用程序后，地址栏中 url 中的基本路径更改为我在 index.html 中指定的基本 href。当我尝试重新加载页面时，这会导致问题，因为 url 不再指向我第一次加载应用程序时请求的原始 url。

我的问题是：如何关闭这种行为或防止 Angular 像这样更改 url？如果我使用哈希路由，我觉得 Angular 不应该关心哈希之前的 url 中的任何内容。我搜索了 Angular 代码库，但找不到原因。

（这不是我看到的默认浏览器行为。就其本身而言，当您加载一个指定了基本 href 的简单 html 文件时，浏览器不会更改您最初请求的 url。我对此进行测试只是为了确保我没有发疯）。

我可以通过提供自己的LocationStrategy 来实施解决方法。我这样做没有任何问题，但我觉得我不应该采取额外的步骤来维护默认的浏览器行为，而 Angular 无论如何都不应该关心。作为一种解决方法，我还可以在构建应用程序时删除基本 href 并提供 --deploy-url ，但这又是一个额外的步骤，当浏览器可以自行正确加载文件并且不会弄乱网址。

我使用一个基本示例创建了this repo，该示例重现了问题并提供了更多细节。我知道快递服务器可能没有“正确”配置。它只是为了说明我必须如何处理我的用例中的文件。请关注文章开头所述的角度问题，而不是辅助细节。

更新

我打开了一个 Angular 问题，因为这似乎是 Angular 代码库中某处的缺陷。 https://github.com/angular/angular/issues/33000.

Answer 1

您使用的是 Angular 8，并且存在与此相关的问题： https://github.com/angular/angular/issues/30835.

1) 您必须配置 express 服务器 才能正确获取静态文件。基本上，您必须设置根。

2) 你不需要使用 base href。因为根据您的 express 服务器，您的静态文件位于根目录中。

3) 关于 Angular 8 问题，您必须在 TS 配置中设置 es5（阅读上面的链接）。 Tsconfig: "target": "es5",

最后，请去掉base标签，然后用这个配置做express：

"use strict";

const express = require('express')
const app = express()
const port = 3000
const _app_folder = 'dist/ng-hash-router-problem';

app.get('*.*', express.static(_app_folder, {maxAge: '1y'}));

app.all('*', function (req, res) {
  res.status(200).sendFile(`/`, {root: _app_folder});
});

app.listen(port, () => console.log(`listening on port ${port}`))

参考：https://itnext.io/express-server-for-an-angular-application-part-1-getting-started-2cd27de691bd