Ruby On Railsでjs.erbから画像データを更新するとnilになります。

Question

Ruby On Railsでjs.erbから画像データを更新するとnilになります。

まずshow.html.erbからprepare_sample_img.js.erbに飛ばしてinnerHTMLでフォームを出現させています。

#/mypage/requests/show.html.erb

<div id='sample_img' class="request-detail">
   <% if @request.sample_img.present? %>
       <%= image_tag @request.sample_img, class: "floor-plan-img-in-mypage-requests-show" %>
   <% else %>
        なし
    <% end %>
    <%= link_to "変 更", prepare_sample_img_mypage_request_path(id: @request.id), class: "btn-modify", remote: true %>
 </div>

#/config/routes.rb

Rails.application.routes.draw do
  namespace :mypage do
    resources :requests do
      member do
        get 'prepare_sample_img'
        get 'update_sample_img'
      end
    end
  end
end

#/mypage/requests_controller.rb

class Mypage::RequestsController < Mypage::ApplicationController
  before_action :set_request, only: [:show, :prepare_sample_img,:update_sample_img]

def create
    @request = Request.new(request_params)
    @request.user_id = current_user.id
    respond_to do |format|
      if @request.valid?
        building = Building.where(name: @request.name).first_or_create do |row|
          row.name = @request.name
          row.address = @request.address
        end
        @request.building_id = building.id
        @request.save(validate: false)
        format.html { redirect_to mypage_requests_path, notice: '作成しました' }
        format.json { render :show, status: :created, location: @request }
      else
        format.html { render :new }
        format.json { render json: @request.errors, status: :unprocessable_entity }
      end
    end
  end

  def prepare_sample_img
  end

  def update_sample_img
    if @request.update(sample_img: params[:request][:sample_img])
      redirect_to mypage_request_path(@request), notice: "変更しました。"
    else
      redirect_to mypage_request_path(@request), alert: "変更できませんでした"
    end
  end

  private

    def request_params
      params.fetch(:request, {}).permit(:name, :no, :address, :floor, :station, :current, :schedule, :key_place, :person, :remark, :neighbor_flg, :panorama_flg, :floor_plan)
    end

    def set_request
      @request = Request.find_by(id: params[:id])
    end
end

#/mypage/requests/prepare_sample_img.js.erb

var sample_img = document.getElementById("sample_img");

sample_img.innerHTML = '<form style="height:32px; width:350px;"'+
                      'action="/mypage/requests/<%= @request.id %>/update_sample_ing" method="get">'+
                      '<input type="file" name="request[sample_img]" id="request_sample_img"  autocomplete="off">'+
                      '<input type="hidden" name="id" value="<%= @request.id %>">'+
                      '<input class="btn-submit2" type="submit" value="更 新"></form>'

上のフォームを送信するとparams[:request][:sample_img]は渡ってくるのですが、updateメソッド後のsample_imgを調べたところ、nilでした。

#model/request.rb

class Request < ActiveRecord::Base
  mount_uploader :sample_img, ImageUploader
end

#uploders/image_uploder.rb

class ImageUploader < CarrierWave::Uploader::Base
  include CarrierWave::MiniMagick
  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

  def extension_white_list
    %w(jpg jpeg gif png zip)
  end

  def filename
    "#{secure_token}.#{file.extension}" if original_filename.present?
  end

  protected
  def secure_token
    var = :"@#{mounted_as}_secure_token"
    model.instance_variable_get(var) or model.instance_variable_set(var, SecureRandom.uuid)
  end

end

createしたときは問題なくsample_imgカラムにデータが入るのですが、そのデータをshow.html.erbで別の画像に更新しようとしたところ、インスタンスのupdate自体は成功し、sample_imgはnilになってしまいます。

エラーログが出ず、ただsample_imgカラムがnilになるので解決策を見つけるのが難しいです。

何卒、間違いのご指摘の方よろしくおねがいいたします。

Answer 1

更新の場合はPUTもしくはPATCHでリクエストするようにしてください。
GETの場合、パラメータを渡してもクエリパラメータとして送信されるため文字数制限があり、
画像のようなデータは送ることができないかと。

Railsに届いているパラメータをログなどで確認して見てください。

あと、タイポもしくはコピーミスだと思いますが、

sample_img.innerHTML = '<form style="height:32px; width:350px;"'+
                      'action="/mypage/requests/<%= @request.id %>/update_sample_ing" method="get">'+
                      '<input type="file" name="request[sample_img]" id="request_sample_img"  autocomplete="off">'+
                      '<input type="hidden" name="id" value="<%= @request.id %>">'+
                      '<input class="btn-submit2" type="submit" value="更 新"></form>'

のactionで指定しているURLが間違ってるように見えます。

Comments

[s_diff]

ご返信ありがとうございます。
タイポミスです、申し訳ありません。（☓ update_sample_ing → ○ update_sample_imgです。）

具体的にどの部分のリクエストメソッドをPUTかPATCHに変えれば良いでしょうか？

何通りかの方法を試してみました。
1. ルーティングを変更（patch 'update_sample_img'）　→　handle_404がレンダリングされる
2. sample_img.innerHTML内のmethodを変更（method="patch"）→　更新しても変化なし
3. 1と2の両方　handle_404がレンダリングされる

patchをputにしても結果は同じでした。

またhttpメソッドを変更してもrailsサーバーのログには特に変化がないように見えます。

[s_diff]

次の点をご参考にしていただけると何かご指摘していただけることが見つかるかもしれません。

１．もともと画像があった場合、画像ファイルを選んで更新するとnilになる
→　js.erbを介したあとupdate_sample_imgメソッドの中でparams[:floor_plan]は渡って来ている。
→　コンソールを見る限りsaveした際にマウントはされている
→　一回マウントをコメントアウトして新しくリクエストしてみると当然アップロードされないが、画像のアイコンとactiondispatchが出る。 :floor_plan => "#<ActionDispatch::Http::UploadedFile:0x007f92e1439448>"
→　そこから更新すると選択したファイルのファイル名が入る。当然アップロードはされてない。
→　マウントをつけ直して画面を更新し、コンソールで確認するとマウントされた形跡がある。
→　一旦rails sやmysql等を全部消す
→　全部立て直してコンソールで確認するとマウントされてるしファイル名も正しいけどアップロードされてない
→　Request.last.sample_img.pathでパスが表示されるのにじっさいにはファイルはない
→　update_sample_imgの中を通るとアップロードされないのに画像が消える？

ということを試してみました。なにかご指摘していただけることがあれば、何卒よろしくおねがいします。