Problem with URLs for thumbnails created using Shrine plugin on Rails 6

Question

I have been struggling with this for a couple of days and hoping someone can help. There may be something obvious that I am missing!

I am using Shrine plugin for Rails to upload PDF files and generate a thumbnail for the first page. The PDF is loading in the designated storage space and the thumbnail is also getting created and getting sorted in the same location. However I am not able to display the thumbnail in the view.

Initializer:

require "shrine"
require "shrine/storage/file_system"
#require "shrine/storage/memory"

Shrine.storages = {
    cache: Shrine::Storage::FileSystem.new("public", prefix: "uploads/cache"),
    store: Shrine::Storage::FileSystem.new("public", prefix: "uploads/store")
}

Shrine.plugin :activerecord    # loads Active Record integration
Shrine.plugin :cached_attachment_data # enables retaining cached file across form redisplays
Shrine.plugin :restore_cached_data  # extracts metadata for assigned cached files
Shrine.plugin :determine_mime_type
Shrine.plugin :validation_helpers
Shrine.plugin :validation
Shrine.plugin :derivatives
#Shrine.plugin :model, cache: false

Uploader:

require "image_processing/mini_magick"

class FileUploader < Shrine
 include ImageProcessing::MiniMagick

 plugin :processing # allows hooking into promoting
 plugin :versions   # enable Shrine to handle a hash of files
 plugin :derivatives
 plugin :default_url
# plugin :delete_raw # delete processed files after uploading

 Attacher.validate do
  validate_max_size 5*1024*1024, message: "is too large (max is 5 MB)"
  validate_mime_type %w[application/pdf]
 end

 Attacher.derivatives do |original|
  magick = ImageProcessing::MiniMagick.source(original).loader(page:0).convert("jpeg")
  {
   thumb: magick.resize_to_limit!(200, 200) 
  }

 end

end

Testing View:

<p id="notice"><%= notice %></p>

<p>
  <strong>Number:</strong>
  <%= @issue.number %>
</p>

<p>
  <strong>Title:</strong>
  <%= @issue.title %>
</p>

<p>
  <strong>Data:</strong>
  <%= @issue.file_data %>
</p>

<p>
  <strong>Issue Preview</strong>
  <embed src="<%= @issue.file_url %>" width="80" height="160" />
</p>

<p>
  <strong>Issue Thumbnail:</strong>
  <%= image_tag @issue.file_url(:thumb) if @issue.file %>
</p>

<p>
  <strong>Issue:</strong>
  <%= image_tag @issue.file_url if @issue.file %>
</p>

<%= link_to 'Edit', edit_issue_path(@issue) %> |
<%= link_to 'Back', issues_path %>

Also, when I look at data stored in the file_data field I see no information added for the thumbnail.

File Data: {"id":"fccd20a9323aa5b63fd912f4ca833ebb.pdf","storage":"store","metadata":{"filename":"pdf_sample.pdf","size":351987,"mime_type":"application/pdf"}}

Answer 1

You need to either enable automatic creation on attachment promotion to permanent storage:

Shrine.plugin :derivatives, create_on_promote: true

Or process the derivatives manually on attachment:

record.file_derivatives!

Answer 2

Finally figured it out. I solved the issue by adding the following to the _form.html.erb:

<%= form.hidden_field :image, value: @photo.cached_image_data %>