CSS 只为我的电脑渲染 - production_environment答案

【问题标题】：CSS only rendering for my computer - production_environmentCSS 只为我的电脑渲染 - production_environment
【发布时间】：2016-12-30 21:03:36
【问题描述】：

我已经使用 Apache 部署了我的 Rails 应用程序，现在可以通过访问 myappname.com 查看我的项目。当我从我的个人计算机的浏览器中查看该项目时，它会显示带有正确 CSS 的应用程序，但是当我从任何其他设备查看它时，没有附加 CSS 并且页面被反汇编。

这是我第一次使用 Apache 部署到 Ubuntu 16.04 droplet，我想知道是否有一些配置我错过了设置？

因为这是我第一次不知道我应该发布哪些文件，所以如果有什么我应该检查的，请告诉我，我也会在更新中发布。

更新：

在我的计算机上，CSS 偶尔不会呈现背景图像，但仍有所有其他 CSS 代码。其他设备仍然没有 CSS 渲染。

更新：

似乎 Ubuntu 服务器正在尝试从 localhost 提取资产。这里的问题是我已经对我的站点进行了硬编码，以尝试从访问该站点的任何人的本地计算机而不是服务器本身检索文件。根据我看到的错误：

http://localhost:3000/assets/jquery-ui/accordion.self-h3h497h7h34f7832987h4f8237h4f872h34f78923847fh82397h4f78h2348h3h4.css?body=1 Failed to load resource: net::ERR_CONNECTION_REFUSED

因为那里显示“localhost”，所以尝试加载该页面的每个人都会尝试在本地计算机上加载一些内容。因此，在这种情况下，实际上是我的计算机在侦听端口 3000。我需要调整我的网站的编码方式，以便它从自身而不是本地主机中提取这些 CSS 资产。

1 问题：我不知道该怎么做。当我找到解决方案时会再次更新。

【问题讨论】：

您是否在部署框中预编译了资产？
是的，我在本地环境和 Droplet 的项目根目录中运行了 bundle exec rake assets:precompile。
在这种情况下，您能展示一下您是如何设置 apache 和 rails 的吗？你有rail的公共目录作为你的文档根目录吗？最后，您如何在生产环境中服务资产？
我正在关注此文档digitalocean.com/community/tutorials/…。我只做了它所指示的。这是一个在 div 类容器中使用的 CSS 示例：main_hero {background: url("/assets/myappname_hero_bg.png") no-repeat center center fixed;}。此图片不会出现在<div class="main_hero">Hello World</div>

标签： css ruby-on-rails apache ubuntu

【解决方案1】：

您必须在 scss 文件中使用 rails 帮助程序，在这种情况下为 image_path

.main_hero {
  background: url(image_path("myappname_hero_bg.png")) no-repeat center center fixed;
}

【讨论】：

这在开发中破坏了图像，并且在生产中不起作用。
我正在使用 .css，也许这就是原因？
当我从本地计算机上的项目目录的根目录运行rails s 时，浏览器上的图像是可见的，但是当我关闭服务器时，它们不再可见！这是什么魔法？
图片是否在子文件夹中？
您必须使用.scss 才能编译文件。