谷歌应用引擎以错误的MIME类型提供静态CSS文件

Question

我一直在开发一个新网站，将其托管在Google App Engine上。我已经将应用部署到开发项目，并在这里进行托管：

开发环境：https://herdboss-dev.appspot.com/

它可以正常工作。

但是，当我拿相同的代码并将其部署到另一个项目中以用作实际的生产网站时，一些CSS文件会被作为application/octet-stream而不是text/css提供，因此这些文件无法被浏览器解析，导致我的大部分CSS在生产网站上无法工作：

生产环境：https://herdboss-prod.appspot.com/

更奇怪的是，其中有些CSS是正确提供的。/css/normalize.css作为text/css提供，但/css/site.css则被作为application/octet-stream提供。

https://herdboss-prod.appspot.com/css/normalize.css

https://herdboss-prod.appspot.com/css/site.css

https://herdboss-prod.appspot.com/js/jquery-ui-1.12.1.custom-theme/jquery-ui.min.css

我的app.yaml为CSS文件设置了静态处理程序：

- url: /css
  static_dir: css
  secure: always

我尝试添加mime_type，但并没有改变任何内容：

- url: /css
  static_dir: css
  mime_type: 'text/css'
  secure: always

编辑：

在尝试实验时，我将我的 site.css 缩减了一半，部署后，它开始正确地提供服务。然后我恢复了完整大小的 site.css，重新部署……现在它仍然可以正确提供服务。

但我的 jquery-ui.min.css 仍然作为 octet-stream 提供服务，这太疯狂了。

编辑2：

我的 svg 文件也以错误的 mime 类型提供服务。

GAE 中的 MIME 类型是否被彻底破坏了？如果是这样，为什么在开发 GAE 上它还有效呢？

- Kenny Wyland

---

我在GAE上有十几个项目，其中一些已经运行了多年。从未遇到过CSS或任何其他文件的MIME类型问题。问题不在GAE方面。 - Andrei Volgin

顺便说一下，我打开了你的生产网站，所有的CSS都正确加载了。希望这意味着你已经解决了问题。 - Andrei Volgin

我现在正在一个已经运行多年的GAE平台Python项目中遇到这个问题（并且没有对CSS文件进行修改），所有样式表都停止工作，以八位字节流MIME类型提供服务。Safari诊断：“在严格模式下不允许非CSS MIME类型。” Chrome和FF也停止工作了。哎呀，这太糟糕了！ - cat

似乎在缓存服务器（服务器：Google Frontend）中出现了故障，直接访问每个版本URL都运行良好，没有问题。它会将相同的文件作为text/css提供，而另一个站点则将其作为octet-stream提供，两者都返回服务器：Google Frontend。真希望能有一些清除缓存的函数！ - cat

最近我们的项目出现了一个变化：一些静态JavaScript文件以text/plain MIME类型提供，因此浏览器不会执行它们。幸运的是，这只影响了QA项目，而尚未影响生产环境。我认为这需要谷歌的紧急干预，因为它具有灾难性的潜力。 - ACEGL

Answer 1

我的解决方案是：

1. 复制有问题的文件并重命名
2. 更改一个字节（否则它将无法上传/更新）
3. 验证它作为样式表下载
4. 在您的HTML中使用重命名的、更改后的CSS文件
5. 等待原始文件被正确提供：大约24小时后，问题自行解决

GAE问题跟踪器上存在一个问题：https://issuetracker.google.com/issues/186012458

最初，我测试了一个解决方法，但这个解决方法在一天后就失效了：我修改了我的HTML，从版本服务器加载样式表，基本上是跨站点的（hxxps://VERSION-dot-SERVER.appspot.com/static/stylesheet.css）。版本服务器提供了正确的MIME类型...但只有一段时间。

我怀疑问题是由于极其罕见的竞争条件（缓存访问/刷新期间的上传）导致的错误MIME类型。根本不可能欺骗Google前端刷新文件。即使附加.../styles.css?x=1或切换回旧的代码版本也无法触发刷新。

文件及其MIME类型似乎是基于它们的哈希值存储的，因此即使仅仅是重命名，重新上传具有相同内容的文件也没有任何效果。如果您部署了一个包含重复文件的版本，您将看到一个“已上传0个文件”的消息。必须更改并重命名该文件。

- cat

Answer 2

我已经检查了你们两个网站：https://herdboss-prod.appspot.com/，https://herdboss-prod.appspot.com/

我可以看到你们有几个CSS文件：normalize.css、jquery-ui.min.css、base-min.css、grids-min.css、grids-responsive-custom.css、css?family=Open+Sans、site.css、ie-is-terrible.css、css_compiled.css。

所有这些文件都正确地作为样式表(Type: stylesheet)提供。

如果你遇到这个问题，我建议进行以下测试：

1. 在开发者控制台中检查内容类型>网络，并选择禁用缓存选项>重新加载页面。如果有帮助：清除浏览器缓存。
2. 在不同的浏览器中检查页面内容，因为内容可能根据渲染引擎而有所不同。
3. 如果第1步和第2步都不起作用，并且你正在使用nginx，则很可能是配置问题。将文件/etc/nginx/conf.d/default.conf更改为/etc/nginx/mime.types并放入“http”部分：

http / {
    include /etc/nginx/mime.types;
    default_type application/octet-stream;
    ....
}  

如果还是不行，把它移到位置部分。

location / {
 include       /etc/nginx/mime.types;
 ...
}

- Pawel Czuczwara

---

你的回答没有帮助。由于问题同时出现在不同的计算机上，且在FF、Chrome和Safari上都有问题，因此无法更改Google App Engine标准环境的配置文件，也不涉及客户端缓存。 - cat