Heroku上的Rails4应用程序，Bootstrap工作

Question

这是我关于Stackoverflow的第一个问题。

我正在开发基于RailsTutorial.org的Rails Web应用程序。我终于成功地在yurilliam.heroku.com上在线部署了我的应用程序。然而，似乎我只能在Safari上查看我的理想版本。似乎Bootstrap在IE，​​Chrome和Firefox上丢失了。

我可以做些什么来解决这个问题。

Answer 1

我可以在开发者控制台中清楚地看到一些mixed content警告。如果您修复它们，您的应用应该按预期开始工作。

替换

href="http://fonts.googleapis.com/css?family=Cookie"
href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"

使用

href="https://fonts.googleapis.com/css?family=Cookie"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"

理想情况下，不要为您的资产指定协议，以便浏览器可以根据请求选择协议。所以你也可以使用像

这样的东西

href="//fonts.googleapis.com/css?family=Cookie"
href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"

Answer 2

如果您打开Mozilla Firefox控制台，安全选项卡会抛出以下错误：

Blocked loading mixed active content "http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"

和Learn more链接。

解决方案是将bootstrap.min.css添加到heroku中的文件中，而不再使用CDN。另一种方法是使用 https 来使用CDN链接的安全版本。那是https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css

如果有帮助，请+1并接受。