如何获取Active Storage图片的url

问题描述 投票:0回答:8

我想通过 api 获取带有附加图像作为链接或文件的记录列表。

我有一个简单的模型:

class Category < ApplicationRecord
  has_one_attached :image
  validates :name, presence: true, uniqueness: true
end

下一步行动:

  def index
    @categories = Category.all.with_attached_image

    render json: @categories.to_json(include: { image_attachment: { include: :blob } })
  end

这是我获取图像对象的唯一方法。

我看到了下一个结果:

{"id":4,"name":"Cat1","description":""},
{"id":1,"name":"Cat2","description":"","image_attachment":
  {"id":8,"name":"image","record_type":"Category","record_id":1,"blob_id":8,"created_at":"2018-06-09T13:45:40.512Z","blob":
  {"id":8,"key":"3upLhH4vGxZEhhf3TaAjDiCW","filename":"Screen Shot 2018-06-09 at 20.43.24.png","content_type":"image/png","metadata":
  {"identified":true,"width":424,"height":361,"analyzed":true},"byte_size":337347,"checksum":"Y58zbYUVOlZRadx81wxOJA==","created_at":"2018-06-09T13:45:40.482Z"}}},
...

我可以在这里看到文件名。但文件位于不同的文件夹中,对我来说这似乎不是获取和链接到文件的便捷方法。

我找不到任何相关信息。

已更新

根据 iGian 解决方案,我的代码变成:

  def index
    @categories = Category.all.with_attached_image

    render json: @categories.map { |category|
      category.as_json.merge({ image: url_for(category.image) })
    }
  end
ruby-on-rails ruby ruby-on-rails-5 rails-activestorage
8个回答
52
投票

对于我的

User
,其中
has_one_attached :avatar
,我可以使用
<%= image_tag url_for(user.avatar) %>
在我的视图中获取网址。 所以,在控制器中我只会使用
url_for(user.avatar)

对于

Category
其中
has_one_attached :image

url_for(category.image)

17
投票

也可以尝试

@object.image.service_url
。这将为您提供保存图像的 URL。 IE。亚马逊 s3 存储的 url。


4
投票

请按照此操作获取图像(如果您使用has_many_attached

Model.images.map{|img| ({ image: url_for(img) })}

4
投票

这对我来说适用于多个图像

class PostSerializer < ActiveModel::Serializer
  include Rails.application.routes.url_helpers

  attributes :id, :content , :images

  def images
    images = object.images.map do |image|
      rails_blob_path(image , only_path: true) if object.images.attached?
    end
  end
end

2
投票

我让它与

rails_blob_url(@object.image)
一起工作。请注意,我正在使用助手调用 _url 而不是 _path


2
投票

如果您想在前端获取此网址,请尝试以下操作:

<%= url_for(category.image) %>

并用于显示图像:

<%= image_tag url_for(category.image) %>

1
投票

以下是我如何将主动存储与 AWS S3 存储桶结合使用,并将带有域的图像 URL 附加到 JSON 响应:

活动记录


class Imageable < ApplicationRecord
  has_many_attached :images

  def image_urls
    images.map(&:service_url)
  end

  def attributes
    super.merge({
                  image_urls: image_urls
                })
  end
end

application_controller.rb

class ApplicationController < ActionController::Base
  before_action :set_active_storage_current_host
  
  def set_active_storage_current_host
    ActiveStorage::Current.host = request.base_url
  end
end

imageables_controller.rb

class ImageablesController < ApplicationController
  include ImageablesHelper
  def update
    imageable = find_or_create
    imageable.update imageables_params
    imageable.images.purge
    imageable.images.attach imageable_params[:images]
    imageable.save!
    render json: imageable
  end
end

imageables_helper.rb

module ImageablesHelper
  def imageables_params
    params.require(:imageable).permit(:other_attributes, images: [])
  end
end

0
投票

我们可以直接使用

<%= image_tag url_for(user.avatar) %>

显示 Turbo Stream 中的任何图像。

例如,使用 Turbo Stream 显示实时发布通知,我们可以使用以下代码来发布部分

<!-- app/views/notifications/_post.html.erb -->
<div class="flex items-start space-x-4 bg-white p-4 rounded-lg shadow-md">
  <% if notification.item.user.avatar.attached? %>
    <%= image_tag url_for(notification.item.user.avatar), class: 'w-10 h-10 rounded-full' %>
  <% end %>
  <div class="flex-grow">
    <p class="text-gray-700">
      <span class="font-semibold text-gray-900"><%= notification.item.user.username %></span>
      added a new post:
    </p>
    <p class="mt-1 text-gray-600">
      <%= link_to notification.item.content.truncate(100), notification.item, class: "underline text-blue-600 hover:text-blue-800 font-medium" %>
    </p>
    <p class="text-sm text-gray-400 mt-1">
      <%= time_ago_in_words(notification.item.created_at) %> ago
    </p>
  </div>
  <% if notification.item.image.attached? %>
    <div class="flex-shrink-0">
      <%= image_tag url_for(notification.item.image), class: 'w-20 h-20 object-cover rounded-lg' %>
    </div>
  <% end %>
</div>
© www.soinside.com 2019 - 2024. All rights reserved.