使用活动存储上传的图像未显示在视图中答案

【问题标题】：Image uploaded with Active storage not showing in the view使用活动存储上传的图像未显示在视图中
【发布时间】：2020-02-19 15:00:52
【问题描述】：

我正在尝试使用ActiveStorage 将 Rails 应用程序升级到 RoR6。在视图中，我在@project 上使用名为“whiteboard_background”的附加图像上的image_tag。

它在浏览器中显示一个断开的链接： Link

环境：本地存储的开发和文件

型号：

class Project < ApplicationRecord

  has_one_attached :whiteboard_background

查看代码：

attachment: <%= @project.whiteboard_background.attached? %>
<p>image:
<%= image_tag @project.whiteboard_background if @project.whiteboard_background.attached? %>
</p>

服务器：

Started GET "/projects/6" for 127.0.0.1 at 2020-02-19 20:29:27 +0100
Processing by ProjectsController#show as HTML
  Parameters: {"id"=>"6"}
...
ActiveStorage::Attachment Load (2.8ms)  SELECT "active_storage_attachments".* FROM "active_storage_attachments" WHERE "active_storage_attachments"."record_id" = $1 AND "active_storage_attachments"."record_type" = $2 AND "active_storage_attachments"."name" = $3 LIMIT $4  [["record_id", 6], ["record_type", "Project"], ["name", "whiteboard_background"], ["LIMIT", 1]]
  ↳ app/views/projects/show.html.erb:94
  ActiveStorage::Blob Load (0.6ms)  SELECT "active_storage_blobs".* FROM "active_storage_blobs" WHERE "active_storage_blobs"."id" = $1 LIMIT $2  [["id", 13], ["LIMIT", 1]]
  ↳ app/views/projects/show.html.erb:96
  Location Load (0.5ms)  SELECT "locations".* FROM "locations" ....

我检查了@project.whiteboard_background.attached? 是true 并且在控制台中Project.last.whiteboard_background.metadata 提供了正确的图像数据，表明上传工作正常。

Firefox 检查器确实显示带有源路径的元素，但显示“无法加载图像”。 chrome中的相同行为

如果我从头开始在空白测试应用程序中重复该过程，它可以正常工作并且我可以显示图像。

有什么想法吗？

【问题讨论】：

您可以在使用此图像加载视图时从服务器发布日志吗？
添加了与Active Storage相关的服务器日志

标签： ruby-on-rails rails-activestorage

【解决方案1】：

错误是由于我的 rails 路线末端出现以下“catch all”： get "*path", to: redirect('/')

由于强制重定向到根目录，浏览器似乎无法使用活动存储提供的 URL 加载图像。这不是使用以前的上传方法（载波）的问题

从 routes.rb 中删除这一行修复了它。

【讨论】：

【解决方案2】：

对于本地存储上的图像，请使用此

<%= url_for(@project.whiteboard_background) %>

如果它正在生产中并且在 S3 之类的东西上，那么你可能想要这样的东西

<%= @project.whiteboard_background.service_url %>

【讨论】：

谢谢，试过了，但没有解决。 Firefox 检查器确实显示带有源路径的元素，但说“无法加载图像”。 chrome 中的行为相同。
那么文件存储在哪里，s3 或其他地方，听起来可能文件可能存在权限问题？
文件以默认设置存储在本地。我还尝试了几张不同类型的图像，它们在我刚刚尝试重现该过程的其他测试应用程序中看起来很好......
好的，您能否验证图像实际上已加载到您在检查器中看到的 URL 中链接到的文件夹中？我认为它通常会发送到/storage/../..so on。这些图像真的存在吗？
你的意思是在浏览器缓存中吗？使用检查器的 URL 跟踪 Firefox 缓存条目中的图像，我确实可以找到具有正确 URL 的记录，但它有 0kb！这样与检查器中的“无法加载图像”错误一致

【解决方案3】：

上传可能没有完成。上传由activestorage/lib/active_storage/attached/model.rb 中的after_commit 回调完成。

如果您有其他可能与此冲突的回调，您可以签入您的代码。

如果原因不同，您可以从那里开始调查和调试任何上传问题。

【讨论】：