IE9 + RichFaces 渲染问题答案

【问题标题】：IE9 + RichFaces Rendering problemIE9 + RichFaces 渲染问题
【发布时间】：2011-08-24 02:51:24
【问题描述】：

我有一个在 JSF 2.0 + Richfaces 3.3.3 上运行的网络应用程序。在除 IE9 之外的所有浏览器上看起来都很棒。

在没有兼容模式的 IE9 中（有，没问题）它看起来像这样（忽略涂黑的文本）：

注意所有组件是如何被框起来的，而 CSS 是如何被忽略的（没看到？）

JSP 看起来像这样（仅相关的东西）：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<link rel="stylesheet" href="css/pageStyle.css" type="text/css" >
</head>

<body>
...
</body>

css 位于C:\apache\tomcat\webapps\MyWebApp\css\pageStyle.css

有人知道吗？谢谢！

更新通过使用network 选项卡捕获数据包，对“开发人员工具”进行了一些研究。 css 文件使用 Type=text/html 而不是 text/css 发送。我猜这就是this question 的问题。

但我仍然不知道为什么会这样。可以看到，文件类型在<link>标签中明确标注为type="text/css。

另一个有趣的观察 - 在 Chrome 开发者工具中检查同一个对象，内容类型是 text/css 所以它可能是一个 IE9 错误。我很困惑...

【问题讨论】：

浏览器（js控制台、开发者工具）是否有错误？
感谢@Matt Handy。请参阅问题中的更新。
你能在服务器上检查 .css 文件的 MIME 类型吗？我非常怀疑这是问题所在，除非有人在摆弄。只是为了记录，链接标签应该是自动关闭的，因为你有 xhtml 文档类型（与元标签相同）。我也会尝试看看哪些有效，哪些无效。诸如重新排序属性之类的东西，以便类型位于 href 属性之前。谁知道？什么事情都可能发生。这已经是一个足够奇怪的错误了。
我会考虑更新到 Richfaces 4 final 和 mojarra 2.1.1（如果您使用的是 mojarra）。我在以前版本的 Richfaces/JSF 中遇到了 IE9 问题，但它们似乎在最新版本中得到了解决。
@Dave - 谢谢。由于我们在旧项目中使用 JSP，因此迁移到 xhtml 的成本太大。

标签： css jsf richfaces internet-explorer-9

【解决方案1】：

问题在于 IE9 需要对 css 文件的 http 响应定义了 Content-Type 标头。您的 http 响应标头应如下所示：

Content-Type: text/css

可能的解决方案：您可以创建一个 Servlet 来捕获 http 请求并使用 Content-Type 值装饰响应标头。

【讨论】：

【解决方案2】：

RichFaces 3.x 不支持 IE9（也没有计划推出），参考这个话题： http://community.jboss.org/thread/156720

您可以升级到 RF 4，

或者实现一个过滤器来强制 IE9 在兼容模式下运行：

public void doFilter(final ServletRequest request, final ServletResponse response, final FilterChain chain) throws IOException, ServletException {
    HttpServletResponse resp = (HttpServletResponse) response;
    resp.addHeader("X-UA-Compatible", "IE=EmulateIE8");
    chain.doFilter(request, resp);
}

【讨论】：

【解决方案3】：

Richfaces 3.3 早于 IE9 的测试版，因此可能会存在一些兼容性问题，因为该版本可能没有针对 IE9 进行测试。

好消息是您使用的是 JSF 2，因此您没有理由不能升级到绝对支持 IE9 的 Richfaces 4 Final。

话虽如此，您使用的 JSF 版本似乎也很重要。我正在使用 mojarra，在 2.0.4 版中，当使用 mojarra.ab (f:ajax) 重新加载许多 Richfaces 组件时，我遇到了问题。升级到 2.1.1 似乎已经解决了所有这些问题，现在我的 Richfaces 代码在生产中对 IE9 用户表现良好。

我建议您查看升级路径，看看是否可行。

【讨论】：

谢谢戴夫。虽然它不能直接解决我的问题，但很高兴知道:-)