5

我们有一些 HTML 页面（本地的，而不是 Web 服务器上的），它们使用 BASE 元素来识别包含一堆常见样式表和图像的特定基本目录。下面是一个例子（页面存放在c:\temp\html\test.html，资源目录是c:\temp\resources）：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <base href="file:///c:/temp/resources/"></base>
    </head>
    <body>
        <p><img src="image.jpg" /></p>
    </body>
</html>

这在我测试过的所有当前浏览器（Firefox、Chrome、IE9）中运行良好，并且在 Quirks 模式下的 IE8 中运行良好。但是在 IE8 标准模式下运行的 IE8 中（此页面的默认值 - 在实际页面中是必需的模式），任何样式表、脚本或图像引用都被破坏了 - 就好像元素被完全忽略了一样。

我已经尝试过元素的其他变体 -<base href="file:///c:/temp/resources/">或者<base href="file:///c:/temp/resources/"/>各种不同的文件 url，例如 file:///c:/temp/resources/test.html 等，以及基础的相对 href，但似乎没有说服图像/样式表/脚本加载。

我知道上面的例子似乎微不足道，但在我们的实际场景中，我们必须在 IE8 标准模式下加载 IE8 中的页面，并且必须设置一个特定的，所以我真的想找出一个解决方案，如果有的话。

我确实在早期的 IE8 版本中找到了一些与该元素相关的错误的引用，但它们在很久以前就被标记为修复，我正在一个干净的 Windows 7 VM 上测试这个并应用了所有 IE8 更新。

4

2 回答 2

9

状态更新：   使用：<base href="\\c:\temp\resources\" />

这是我在创建此解决方案时使用的过程，以允许IE8将基本属性用于本地文件。

澄清一下：这个经过W3C验证的解决方案适用于IE7、IE8和所有现代浏览器！


**参考截图：**：
在这里你可以看到***IE8地址栏***不像其他现代浏览器那样操作：斜杠***颠倒***并且没有`file:// /` 协议可见。但是，**IE8** 会在页面刷新时在**浏览器的状态栏** 中显示 `file:///` 协议！

在此处输入图像描述

参考截图：
由于IE8对本地文件的处理方式不同，因此了解IE8协议file:///很重要。

要了解可用的语法方法，查看本地 Intranet的Internet 选项（安全选项卡）将为我们提供该信息。这里实际上没有进行任何更改，请仅使用语法：

在此处输入图像描述

在上图中，本地 Intranet 窗口确认需要反斜杠。

此外，它表明该file:\\协议与此斜杠语法相关联。由于IE8file:///自动隐含了协议（之前提到过：请参阅浏览器的状态栏并注意斜线呈现正确！！）。在标签中 定义这个协议是个问题。解决方案是不使用协议！

file:Base


**参考链接 1：** [**无协议 URL 方案：**](http://encosia.com/cripple-the-google-cdns-caching-with-a-single-character/)
> 是不完全是简单的阅读，但 [**第 4.2 节 RFC 3986**][3] 为完全限定的 URL 提供了 > 完全省略协议（HTTP 或 HTTPS） >。当省略 URL 的协议时，浏览器将使用 > 底层文档的协议。
**参考链接 2：** [**了解 Paul Irish 的网络路径参考：**](http://paulirish.com/2010/the-protocol-relative-url/)

*当然，如果您在本地查看文件，它会尝试使用file://协议请求文件。


上面的参考资料解释了使用 `//` 将允许任何浏览器在访问文件或资产时使用当前已知的 **URL Scheme**。由于 **IE8** 改变了游戏规则，使用 **`\\`** 而不是 `//` 将适用于 Base 标签，因为所有浏览器都会将其转换/解释为标准的 `file:///` URL Scheme（*隐含本地文件*），包括浏览器**IE7**！
**完整的 HTML 标记 | 工作演示：** 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Using Base Tag with Local Files IE8 and Modern Browser DEMO</title>

  <!-- The name of this file is:  test.html  -->
  <!-- The location of this HTML file on the hard drive is:  C:\temp\html\test.html  -->

  <!-- This unusually constructed Base attribute tag uses two rules to have it work for Locally Hosted IE8 Files that are not server based. -->
  <!-- First, the "URL Scheme" is based on "Network Path Reference" which means no Protocol is used. -->
  <!-- Second, the "forward slashes" are changed to "back slashes". It's the syntax IE8 actually expects. -->
  <!-- This entire method is also friendly for modern browsers showing these local files that are not server based. -->
  <base href="\\c:\temp\resources\" />
    
</head>
<body>

  <p>
    <!-- The location of this "image.jpg" on the hard drive is at:  C:\temp\resources\image.jpg  -->
    <img src="image.jpg" alt="image" />
  </p>

</body>
</html>
于 2012-07-07T04:15:44.123 回答
0

不幸的是，看起来 IE8 的标准模式不处理 BASE 元素中的 file:// URI。

如果您可以在本地页面中运行脚本，我建议您使用一些简单的 javascript 来遍历所有外部元素（SCRIPT、IMG、LINK、IFRAME、FRAME）并修复任何无方案的 URI（那些不't contains "://") 使用您想要的 BASE。

于 2012-07-02T00:29:35.520 回答