提交表单后使用 Carrierwave/Sidekiq 显示上传到 S3 的图像答案

【问题标题】：Display image uploaded to S3 with Carrierwave/Sidekiq after form submit提交表单后使用 Carrierwave/Sidekiq 显示上传到 S3 的图像
【发布时间】：2015-04-04 16:36:36
【问题描述】：

我正在使用 Sidekiq 与 CarrierWave 和 CarrierWaveBackgrounder 在后台将我的图像上传到 S3。这工作正常，除了一件事：在我提交表单后，图像在 Sidekiq 中排队并处理，但页面重新加载的速度比后台作业快，导致上传的图像出现 404。再次刷新页面后，通常会显示图像。

我想知道是否有一种方法可以显示 tmp 文件（我的数据库中有一个 image_tmp 列，它似乎在处理/上传文件时存储了文件的路径），或者在处理后重新加载我的图像完成。

我可以轮询我的数据库以将“image_processing”更改为 true，但这似乎有点浪费请求。

我的用户类的相关部分：

mount_uploader :profile_image, ProfileImageUploader

process_in_background :profile_image
store_in_background :profile_image

ProfileImageUploader 包括后台程序

class ProfileImageUploader < CarrierWave::Uploader::Base

  include ::CarrierWave::Backgrounder::Delay
  include CarrierWave::MiniMagick

我的数据库有profile_image_processing 和profile_image_tmp 的字段，当然还有profile_image 列。

【问题讨论】：

标签： ruby-on-rails amazon-s3 carrierwave sidekiq

【解决方案1】：

我通过轮询image_processing 属性解决了这个问题。我的图片上传部分如下所示：

.form-group{ :class => (f.error field) ? "has-feedback has-error" : nil }
  = f.label field, :class => "col-md-3 control-label"

  .col-md-9
    = f.label field do
      = image_tag('ajax-loader.gif', class: 'image-loader hidden')
      - unless resource.image.blank?
        %p= image_tag(resource.image.thumb.url, data: { poll: resource.image_processing })
      - else
        %p No image uploaded yet.

      = f.input_field field, :as => :file
    %span.help-inline
      = f.error field, :class => "help-inline"

然后我使用以下 CoffeeScript 类连接到 data-pollattribute：

$ ->

  class ImagePoller

    constructor: (@$el) ->
      @$loader      = @$el.prev('.image-loader')
      @timer        = null
      @processing   = JSON.parse @$el.attr('data-poll')

      @resourcePath = "#{window.location.href}.json"

      @startPolling() if @processing

    startPolling: =>
      if @processing
        @toggleLoader()
        @$el.hide()
        @timer = setInterval =>
          promise = $.getJSON @resourcePath
          promise.done (data) =>
            @processing = data.image_processing
            @fetchImage(data.image.thumb.url) if not @processing
        , 100

    fetchImage: (image) ->
      clearInterval @timer
      @toggleLoader()
      @$el.attr 'src', image
      @$el.show()

    toggleLoader: ->
      @$loader.toggle()

  $('[data-poll]').each ->
    new ImagePoller $(@)

对于我的目的来说似乎可以正常工作。

【讨论】：