nakamitsu-nozomi
commented
3 years ago 新しい画像の追加投稿機能について
どうすれば、 元画像だけでなく、新しい画像の追加投稿機能を実装できるか全くわからず困ってます。
やりたいこと
元画像だけでなく、新しい画像も追加で投稿できるようにしたい
現状（下記コードの状態）
- 元画像も新規画像も再投稿できない
エラー文#<ActiveRecord::RecordNotFound: Couldn't find Medium with ID=65 for Tweet with ID=>
- 写真のように元画像の数だけモーダルフォームができる
試したこと
- fields_forを使って、form_for内で異なるモデル（Medium)を編集できるようにした。
- binding.pryを使って、post_params[:media_attributes]の中に
<ActionController::Parameters {"0"=><ActionController::Parameters {"media_url"=>#<ActionDispatch::Http::UploadedFile:0x00007fb52cc37e70 @tempfile=#<Tempfile:/var/folders/l8/5109jjgs36v7tcj0hjjnlb0c0000gn/T/RackMultipart20201227-3440-pgr17q.png>, @original_filename="couch_color.png", @content_type="image/png", @headers="Content-Disposition: form-data; name=\"tweet[media_attributes][0][media_url]\"; filename=\"couch_color.png\"\r\nContent-Type: image/png\r\n">, "id"=>"65"} permitted: true>, "1"=><ActionController::Parameters {"id"=>"66"} permitted: true>, "2"=><ActionController::Parameters {"id"=>"67"} permitted: true>} permitted: true>
が入っていること確認。
-コードは以下のように書きました。
tweet_controller
def show
@tweet = Tweet.find(params[:id])
@tweet.media.build
redirect_to root_path if @tweet.user_id != current_user.id
end
def post_create
# @tweet = Tweet.new(post_params)
@tweet = current_user.tweets.build(post_params)
@tweet_data_all = Tweet.find(params[:id])
@tweet_new_media = post_params[:media_attributes]
# 投稿画像のURLを取得
@tweet_media = @tweet_data_all.media.pluck(:media_url)
@img = @tweet_media.map { |img_url| URI.parse(img_url).open }
@client.update_with_media("#{@tweet.text}\r", @img)
@tweet_data_all.tweet_flag = true
@tweet_data_all.save
redirect_to tweet_path(params[:id]), success: "再投稿に成功しました"
rescue StandardError => e
redirect_to tweet_path(params[:id]), danger: "再投稿に失敗しました#{e} "
binding.pry
end
def post_params
params.require(:tweet).permit(:text, :tweet_id, media_attributes: %i[media_url tweet_id id])
end
tweet.rb
has_many :media, dependent: :destroy
accepts_nested_attributes_for :media
_tweet_modal.html.erb
<div class="modal fade" id="modal2" tabindex="-1"
role="dialog" aria-labelledby="label1" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="label1">再投稿する</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<%= form_with model: @tweet,method: :post, url: "/tweets/#{params[:id]}/post_create", local:true,multipart: true do |f| %>
<div class="modal-body">
<div class="p-2">
<p><%= f.label :label_old_tweet, "元投稿内容" %></p>
<p><%= f.text_area :text,maxlength: 140 ,:required => true, class: "form-control", rows: 4, value: @tweet.text %></p>
</div>
<div class="p-2">
<p><%= f.label :label_show_image, "画像" %></p>
<%= f.fields_for :media, local: true do |i| %>
<%= i.file_field :media_url %>
<%= i.hidden_field :tweet_id, value: @tweet.id %>
<% end %>
<% @tweet.media.each_with_index do |media,index| %>
<% if index==0 %>
<%= image_tag media.media_url.to_s,class: "mordal-image " %>
<% end %>
<% end %>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<%= f.hidden_field :tweet_id, value: @tweet.tweet_id %>
<%= f.submit "再投稿する", class: "btn btn-primary" %>
</div>
<% end %>
</div>
</div>
</div>モーダルフォームから入力した画像のURLがわかれば、元画像を再投稿するのと同じ方法でTwitterに投稿できるのかなと思い上記コードを書いてみましたが全く上手くいかず困ってます。モーダルフォームから入力した画像のURLをどうやって取得したらいいのかわかりません。
そもそもの実装方法に迷走してます。 アドバイスいただけたら嬉しいです。よろしくお願い致します。
great084
domi10momo
closes62
目的・概要
元ツイート画像の再投稿機能実装
実装内容
UI変更概要
画面キャプチャ
稼働確認チェック
参考資料
連絡事項
元画像だけでなく、新規画像を追加したり削除する 機能を挑戦しましたが、実装できませんでした。