Ajaxを用いたいいね機能の実装
解決したいこと
いいね機能をAjaxを用いて実装しようとしたところ、エラーが起こるようになりました。ページをリロードするといいねを押した処理は実行できているようですが非同期通信ができません。ターミナルでエラーが発生しています。
(概要)
Ruby on Railsでのようなレビューサイトをつくっています。
レビューのいいね機能をAjaxを用いて実装中にエラーが発生しました。
解決方法を教えて下さい。
発生している問題・エラー
いいねを押した際
Started POST "/flogs/3/likes" for 119.230.114.46 at 2022-05-29 20:52:22 +0000
Cannot render console from 119.230.114.46! Allowed networks: 127.0.0.1, ::1, 127.0.0.0/127.255.255.255
Processing by LikesController#create as JS
Parameters: {"flog_id"=>"3"}
WrritenFlog Load (0.2ms) SELECT "wrriten_flogs".* FROM "wrriten_flogs" WHERE "wrriten_flogs"."id" = ? LIMIT ? [["id", 3], ["LIMIT", 1]]
↳ app/controllers/likes_controller.rb:4
User Load (0.1ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."id" ASC LIMIT ? [["id", 1], ["LIMIT", 1]]
↳ app/controllers/likes_controller.rb:5
(0.1ms) begin transaction
↳ app/controllers/likes_controller.rb:6
WrritenFlog Load (0.1ms) SELECT "wrriten_flogs".* FROM "wrriten_flogs" WHERE "wrriten_flogs"."id" = ? LIMIT ? [["id", 3], ["LIMIT", 1]]
↳ app/controllers/likes_controller.rb:6
Like Create (0.5ms) INSERT INTO "likes" ("user_id", "wrriten_flog_id", "created_at", "updated_at") VALUES (?, ?, ?, ?) [["user_id", 1], ["wrriten_flog_id", 3], ["created_at", "2022-05-29 20:52:22.429112"], ["updated_at", "2022-05-29 20:52:22.429112"]]
↳ app/controllers/likes_controller.rb:6
(3.6ms) commit transaction
↳ app/controllers/likes_controller.rb:6
Rendering likes/create.js.erb
Rendered likes/create.js.erb (355.5ms)
Completed 500 Internal Server Error in 376ms (ActiveRecord: 4.6ms)
ActionView::Template::Error (undefined local variable or method `flog' for #<#<Class:0x00007f84018e4950>:0x00007f84019ca838>
Did you mean? Float):
1: $('#favorite_buttons_<%= flog.id %>').html("<%= j(render "flogs/like", flog: @flog) %>");
app/views/likes/create.js.erb:1:in `_app_views_likes_create_js_erb__3801333937122120956_70102469728340'
既にいいねを押している投稿にいいねを押した際
Processing by LikesController#destroy as JS
Parameters: {"flog_id"=>"3"}
WrritenFlog Load (0.2ms) SELECT "wrriten_flogs".* FROM "wrriten_flogs" WHERE "wrriten_flogs"."id" = ? LIMIT ? [["id", 3], ["LIMIT", 1]]
↳ app/controllers/likes_controller.rb:10
User Load (0.1ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."id" ASC LIMIT ? [["id", 1], ["LIMIT", 1]]
↳ app/controllers/likes_controller.rb:11
Like Load (0.2ms) SELECT "likes".* FROM "likes" WHERE "likes"."user_id" = ? AND "likes"."user_id" = ? AND "likes"."wrriten_flog_id" = ? LIMIT ? [["user_id", 1], ["user_id", 1], ["wrriten_flog_id", 3], ["LIMIT", 1]]
↳ app/controllers/likes_controller.rb:11
(0.0ms) begin transaction
↳ app/controllers/likes_controller.rb:12
Like Destroy (0.5ms) DELETE FROM "likes" WHERE "likes"."id" = ? [["id", 67]]
↳ app/controllers/likes_controller.rb:12
(3.7ms) commit transaction
↳ app/controllers/likes_controller.rb:12
Rendering likes/destroy.js.erb
Rendered likes/destroy.js.erb (316.7ms)
Completed 500 Internal Server Error in 339ms (ActiveRecord: 4.7ms)
Ajaxを用いるために使用しているコード
・いいね機能(共通テンプレートにしています) flogs/_like.html.erb
<%if current_user%>
<% if flog.liked_by?(current_user) %>
<p>
<%= link_to flog_likes_path(flog.id), method: :delete, class:'likes',remote: true do %>
♥ <%= flog.likes.count %>
<% end %>
</p>
<% else %>
<p>
<%= link_to flog_likes_path(flog.id), method: :post,remote: true do %>
♡ <%= flog.likes.count %>
<% end %>
</p>
<% end %>
<%else%>
<%= link_to new_user_session_path do %>
♡ <%= flog.likes.count %>
<% end %>
<%end%>
ボタンのある箇所のビュー flogs/show.html.erb
<div id="favorite_buttons_<%= flog.id %>", class="card-text">
<%= render "flogs/like", flog: flog %>
</div>
いいねに用いているコントローラー likes_controller
class LikesController < ApplicationController
def create
flog = WrritenFlog.find(params[:flog_id])
like = current_user.likes.new(user_id: current_user.id, wrriten_flog_id: params[:flog_id])
like.save
end
def destroy
flog = WrritenFlog.find(params[:flog_id])
like = current_user.likes.find_by(user_id: current_user.id, wrriten_flog_id: params[:flog_id])
like.destroy
end
end
Ajaxの部分
①likes/destroy.js.erb
$('#favorite_buttons_<%= flog.id %>').html("<%= j(render "flogs/like", flog: @flog) %>");
①likes/create.js.erb
$('#favorite_buttons_<%= flog.id %>').html("<%= j(render "flogs/like", flog: @flog) %>");
自分で試したこと
### 自分で試したこと
https://qiita.com/hapiblog2020/items/3ba7e7edc02f01d987b9
このサイトをもとに作成しました。なぜ自分のところでエラーが起こっているのか分からないです。
初学者のため本当に稚拙な質問かもしれませんが、よろしくお願いいたします。
0 likes