Chrome警告静态资源（css/gif/png/js）问题

Question

每当网页加载时，我会在调试器中收到以下警告：

资源已解释为样式表，但传输的 MIME 类型为纯文本。

当浏览器请求 js、css、gif 和 png 文件时，我都会收到以上警告。

您有什么解决方法吗？

- Niger

Answer 1

出错信息已经说明了问题。

你的Web服务器发送了错误/丢失的Content-Type HTTP Header。

使用HTTP Header Check并输入你的js/css/gif/png的URL，检查服务器发送的Content-Type头部（我猜可能根本没有或者是text/plain）。

然后修复服务器以发送正确的MIME类型，或联系服务器管理员。

正确的Content-Type值应该是：

text/css -> .css文件

image/gif -> .gif文件

image/jpeg -> .jpg/.jpeg文件

application/javascript -> .js文件

image/png -> .png文件

算你幸运; )。现在这只是Chrome中的一个警告，在早期版本的Chrome中当设置/发送错误/丢失的Content-Type标头时，例如CSS根本不会应用。

- jitter

---

.js 的 MIME 类型根据 RFC 实际上是 application/javascript。http://www.rfc-editor.org/rfc/rfc4329.txt - Sarkie

Answer 2

我发现Django的开发Web服务器也会使用不正确的标头来服务所有的图片/ CSS等。虽然Jitter的响应仍然是解决这个问题的最佳方法，但修复服务器并不总是可行的。

我发现你可以在Chrome中隐藏警告，并且只有在控制台窗口中ctrl + 单击两个标题（ERRORS和LOGS）时才能查看错误和日志; 从本质上讲，隐藏了所有警告。

这是一个简单的技巧，但确实使在Django中进行调试更加简洁和方便。

- PKKid

---

很高兴知道这只是因为我处于开发模式。 - Valchris

@Valchris，在生产环境中，Django 不应该提供静态文件服务，而是应该由你的 Web 服务器（Apache/Nginx）来处理。我假设你已经正确地做到了这一点，但是为了新手 Django 开发者能够更好地理解，我想要明确一下这一点。 - PKKid

这指的是控制台底部，有一个水平多选错误、警告和日志。 - fastmultiplication

对我来说，在控制台的“过滤器”图标下检查“隐藏网络消息”可以隐藏消息。 - Felix

Answer 3

您可以通过将以下代码添加到您的JS中来隐藏警告：

console.groupCollapsed(' ');console.log('just example');console.groupEnd(); console.log('b')

- Shluch

---

这个怎么解决问题的？这只是在搞控制台，但肯定不能解决OP遇到的问题。 - andr

Answer 4

我也遇到了这些问题，当我使用HTTP Header Check工具检查出现错误的资源时，返回了一个有效的Content-Type头，并且请求的资源的mime类型是正确的。我还使用Firefox / Live HTTP headers以及wget验证了这些头文件。

我在想这是否实际上是Chrome中的一个bug，导致它忽略了这些类型文件的特定头文件。

- rbieber

Answer 5

这是您的服务器配置问题。您可能有一些杂散的.htaccess文件正在与MIME类型发生冲突。

- aviraldg

Answer 6

我在我的/public/目录中重命名一个文件夹后遇到了这个问题。Chrome浏览器的缓存仍然从旧目录中加载文件，而该目录现在返回的是错误页面，而不是图片。因此就会出现期望 .jpg 文件但实际接收到 text/html 文件的错误提示。

- Dean Rather