如何在 S3 上托管的 angular 4 网站中隐藏基本 href

Question

我有一个网站托管在用 Angular 4.

编写的 S3 存储桶上

我在 Route 53 上的 URL 指向 CloudFront 分配，它指向 S3 存储桶的 index.html（设置为无缓存）。

在 S3 存储桶中，我有每个版本示例的文件夹：

mywebsite.com
-> v1.0.0
   -> pricing.html
-> index.html

在我的 index.html 我有 <base href="/v1.0.0/">

这很完美，可以转到正确的页面，并且始终获取最新版本的网站，因为 index.html 未缓存。

然而，这让我的 url 看起来像：
https://www.mywebsite.com/v1.0.0/pricing

如何从 URL 中隐藏“/v1.0.0/”？

Answer 1

好吧，经过几个小时的努力，我终于明白了。以下是我为其他尝试这样做的人所做的：

进入您的 app.module.ts 文件并添加

import { APP_BASE_HREF } from '@angular/common';

接下来，在 "providers" 部分添加

  providers: [
[{provide: APP_BASE_HREF, useValue: '/'}]
],

然后当您上传网站时，编辑 index.html 以获得 base_href 版本文件夹：

<base href="/v1.0.9/">

现在它将从 /v1.0.9/ 文件夹中提取所有文件，但不会在 URL!

中显示

How to hide base href in angular 4 website hosted on S3