HTML <base>标签中空href的含义是什么？

Question

假设我的页面 URL 是：http://example.com/path/to/dir/index.html，我通过 http://proxyserver.com/path/to/dir/index.html 进行代理。同样，我希望页面中的所有相对 URL 都由 proxyserver.com 解析，而不是 example.com。应该设置什么适当的 <base> href 值呢？

我希望页面上的相对 URL 如下：

- newfile.html 解析为 http://proxyserver.com/path/to/dir/newfile.html - /newfile.html 解析为 http://proxyserver.com/newfile.html - #hash 解析为 http://proxyserver.com/path/to/dir/file.html#hash 在页面中设置 <base href="" /> 可以正确地完成此工作，但它是否有一些影响？在不同的浏览器中是否有不同的解释？空的 href 值实际上意味着什么？它是否适用于所有框架，如 Angular？

我听说 <base> 标签对于 Angular 应用程序来说是必需的，因此删除 <base> 标签可能无法正常工作。

注意：网站可能已经包含一些 <base> 标签，我希望始终覆盖它们。

我还尝试过 <base href="/" />，但它会将相对 URL 解析为：

- newfile.html 解析为 http://proxyserver.com/newfile.html - #hash 解析为 http://proxyserver.com/#hash 这是错误的。

非常感谢您的帮助。

- Vaibhav Nigam

---

这是基础工作原理，我不明白问题在哪里。 - Marco Salerno

@MarcoSalerno 我找不到任何文档说明 <base> 标签的 href 空值意味着什么。它是与未设置相同还是删除现有的 <base> 标签？但是，这会导致必须使用 <base> 的 Angular 应用程序出现问题。 - Vaibhav Nigam

空的意思是根，就像每一门技术一样。 - Marco Salerno

Answer 1

基本URL或基本位置是网站的唯一根URL，相对URL可以转换为绝对URL。不可能有多个基础URL。

更复杂、不一致的策略可以通过重定向规则来强制执行。这项任务属于Web服务器。列举几个例子，NginX、Apache和IIS都有设置重定向规则的能力。在那里，您可以使用正则表达式做任何您想做的事情。

由于这个问题被标记为Angular，因此，由于客户端只有在Web服务器解析http请求后才能访问页面，所以您必须为每种错误情况创建一个重定向到正确页面的空白页面。这当然比让Web服务器处理重定向更糟糕。

- Attersson

Answer 2

<base href="" />定义了所有相对路径的基础。并且它遵循《猛将无敌》原则（“只能有一个”） :-)

只是为了确认我是否正确理解了你的目标。你写道：

• newfile.html将解析为http://proxyserver.com/path/to/dir/newfile.html
• /newfile.html将解析为http://proxyserver.com/newfile.html

所以您不想有一个基本路径，而是希望浏览器检查多个路径是否存在所需文档？

这不容易实现（从浏览器角度看）。原因是浏览器不知道这些路径的内容。他必须向那些服务器发出请求：“嘿，好的服务器，你在目录中有“newfile.html”吗？没有？ 好的，谢谢。”

正如@Attersson所说，如果您想实现这一点，您必须在您的Web服务器中创建过滤器和路由。这对客户端来说不是一个工作。

关于Angular的问题。 在Angular 6中，您需要在index.html中编写<base href="/">。 然后在Angular.json中配置您真正想要的基本路径：

...
"architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
             ...
            "baseHref": "/myLovedPath/",
...

因此，Angular将构建应用程序并将<base href="/">更改为<base href="/myLovedPath/">

敬祝安好

- JanRecker

---

如果在Angular中，我写<base href="">即空的href值，会出现什么问题吗？ - Vaibhav Nigam

@lazyvab，您需要在您的Web服务器中使用重定向。这不是要在客户端（Angular）处理的。无论如何，空基础意味着当前主机。 - Attersson

Answer 3

标签指定文档中所有相对URL的基本URL/目标。 一个文档中最多只能有一个元素，并且它必须在元素内。

如果您的域名是http://proxyserver.com，则基本URL将为/，但如果域名 像这样http://proxyserver.com/appname/，那么基本URL将像/appname/一样，并且您通常会在使用angular cli部署时设置基本URL，如下所示

ng build --prod --bh=/appname/

在这种情况下，您必须使用**HashLocationStrategy**来处理路由。

app.module.ts

@NgModule({
  imports: [
    RouterModule.forRoot(routes)
  ],
  exports: [
    RouterModule  
  ],
  providers: [
    { provide: LocationStrategy, useClass: HashLocationStrategy } 
  ]
})
export class AppRoutingModule { }

{ provide: LocationStrategy, useClass: HashLocationStrategy }

{提供：LocationStrategy，使用类：HashLocationStrategy}

- Muhammed Albarmavi