如何在 JS 框中显示带有 Active Storage 的图像变体？

Question

在我看来，我可以像这样在弹出窗口中显示我附加到带有 Active Storage 的模型的文件：

<a href="<%= rails_blob_path(@image.file, disposition: 'inline') %>" rel="example_group"><%= image_tag @image.variant('small') %></a>

运行良好。

问题是当我想在 link:

中使用变体时

<a href="<%= url_for(@image.variant('high')) %>" rel="example_group"><%= image_tag @image.variant('small') %></a>

使用的变体代码是：

file.variant(resize:size).processed.service_url

link 看起来不错，但是当我点击图片时，图片并没有像以前那样在我的 JS 弹出窗口中打开，而是在新的浏览器中打开 window。这很奇怪。

我缩短了link。

https://bucket.s3.eu-west-3.amazonaws.com/variants/MmsLY3rf8yR9/38a77a69d170464c472f6d36fb3fbc28b284af0cadaa533?response-content-disposition=inline%3B%20filename%3D%22chateau.jpeg%22%3B%20filename%2A%3DUTF-8%27%27chateau-lynch.jpeg&response-content-type=image%2Fjpeg&Signature=29fe7d85fe369ea2335fa8b333d4868d8c2f2c22e1efe

这是一个 "content-disposition" 问题吗？

Answer 1

好吧，这就是我所做的：

在我的图像模型中，我添加了一个动作并使用了 url_helpers:

中的 rails_representation_url() 方法

include Rails.application.routes.url_helpers #

需要这个

  include Rails.application.routes.url_helpers 
  def get_variant(version="high", disposition="attachment")
    variant = file_variant(version)
    return rails_representation_url(variant, only_path: true, disposition: disposition)
  end

在我的 html 中，我可以调用带有附件配置的方法：

<a href="<%= @image.get_variant('high', 'attachment') %>" rel="example_group">

我也可以直接从我的控制器下载图像变体：

def download
    redirect_to @image.get_variant('high', 'attachment')
end

如果只想在浏览器中显示变体window，可以使用'inline':

redirect_to @image.get_variant('high', 'inline')

不确定这是最佳选择，但它确实有效。

如何在 JS 框中显示带有 Active Storage 的图像变体？

How to display the variant of an image with Active Storage in a JS box?

ruby-on-rails

variant

rails-activestorage