Chrome 不呈现由 Python/WebApp2 提供的样式表答案

【问题标题】：Chrome not rendering stylesheets served by Python/WebApp2Chrome 不呈现由 Python/WebApp2 提供的样式表
【发布时间】：2012-12-12 14:24:19
【问题描述】：

我不知道我做错了什么。

我在前端使用带有基本页面的 Twitter Bootstrap，并在后端使用 Python / WebApp2（不是 Google App Engine）提供所有服务。

如果我在 Internet Explorer 8 中从服务器加载页面，就会出现样式。

如果我在 Chrome 中从 C:/ 加载页面，就会出现样式。

如果我在 Chrome 中从服务器加载页面，样式不会出现。

我检查了所有的 mime 类型，比较了 C:/ 和服务器页面，一切看起来都一样。

我一生都无法弄清楚为什么 Chrome 在 Python / WebApp2 提供服务时不呈现样式表。

我无法弄清楚如何在没有实际处理的情况下将代码放入此文本框中，因此我使用的页面与此处显示的示例基本相同： http://twitter.github.com/bootstrap/getting-started.html

有什么想法吗？

用于 css 的 Python 脚本

非样式化 - 由 Python / Webapp2 提供服务，在 Chrome 中查看

样式化 - 从 C 中提取，在 Chrome 中查看

无样式 - Chrome 资源选项卡

样式化 - Chrome 资源选项卡

我可以在 Chrome 资源选项卡中提取 CSS 文件并查看 CSS 文件的内容。没有警告它在控制台中被解释为 text/xml。

【问题讨论】：

能否列出Chrome从服务器下载的CSS文件内容？我唯一的其他建议是清除 Chrome 中的缓存并重试。
我可以通过 Chrome 的资源标签查看 CSS 文件的内容。我编辑了原始问题来解决这个问题。谢谢。

标签： python css google-chrome internet-explorer-8 webapp2

【解决方案1】：

GAAAH，我刚刚想通了！

在我的 python 代码中，你可以看到我正在使用'self.response.headers.add_header'。我猜每当你使用“self.response.out.write”函数时，默认情况下它都有一个“text/html”内容类型。如果你“添加标题”，那么它会在最终的“text/html”标题之前添加一个“text/css”标题。 Chrome 然后读取最后一个标题并将其用作样式表的内容类型。我猜 IE 和 Opera 使用第一个？无论如何：修复，使用：

self.response.headers['Content-Type'] = "text/css"

作为一个整体

def css(self, css_dir, filename, extension):
    self.response.headers['Content-Type'] = "text/css"
    self.response.out.write(open(css_dir + filename + extension,"rb").read())

耶！

【讨论】：

【解决方案2】：

我更喜欢using webapp templates，而不是直接响应代码的 HTML 输出。

只需用

创建 index.html

<html>
<head>
 <link rel="stylesheet" href="{{path_to_css}}" type="text/css" />
</head>
<!-- body.. -->

然后您可以从代码中设置path_to_css。使用这种方法，您可以将 HTML、CSS 从代码逻辑中分离出来。

【讨论】：