今している事
railsでAjaxを用いてコメント機能を実装しています。
JavaScriptファイルにAjaxのための記述を書いて試しにコメントを送信してみようと思ってみると以下のようなエラー画面が出てしまいました。
このページは動作していません
localhost から無効な応答が送信されました。
ERR_INVALID_REDIRECT
各コード
posts/show.html.erb
ruby
1<%= render "shared/header" %> 2 3<div class="posts"> 4 <div class="post"> 5 <div class="top-post"> 6 <%= link_to "投稿者 #{@post.user.nickname}", user_path(@post.user.id), class:"user-name-post" %> 7 <span><%= @post.created_at.to_s(:datetime_jp) %></span> 8 </div> 9 <div class="main-post"> 10 <div class="trash-edit"> 11 <% if user_signed_in? && current_user.id == @post.user_id %> 12 <div class="trash"> 13 <%= link_to(post_path(@post.id), method: :delete, class:"fa fa-trash fa-4x trash-btn", style: "display: flex;" ) do%> 14 <% end %> 15 </div> 16 <div class="edit"> 17 <%= link_to(edit_post_path(@post.id),class:"fa fa-edit fa-4x edit-btn",style: "display: flex;") do %> 18 <% end %> 19 </div> 20 <% end %> 21 </div> 22 <%= link_to(post_path(@post.id),class: "image-link") do %> 23 <%= image_tag @post.image, class: 'image-main-show' %> 24 <% end %> 25 </div> 26 <div class="footer-show"> 27 <%= link_to @post.user.nickname, user_path(@post.user.id), class:"user-name-post" %> 28 <hr> 29 <p class="caption"><%= @post.caption %></p> 30 <hr> 31 <p><%= "アイテムカテゴリー : #{@post.category.name}"%></p> 32 </div> 33 </div> 34 35<div class="comments"> 36 <div class="comment"> 37 <% if user_signed_in? %> 38 <%= form_with(model: [@post, @comment], local: true, class:"comment-form",id:"form") do |form| %> 39 <%= form.text_area :text, placeholder: "コメントを追加...",class:"comment-area", row: "1" %> 40 <%= form.submit "コメント",class:"comment-submit",id:"submit" %> 41 <% end %> 42 <% end %> 43 </div> 44</div> 45 46<%= @comments.each do |comment| %> 47 <ul> 48 <li><%= comment.text %></li> 49 </ul> 50<% end %> 51 52 53<%= render "shared/footer" %>
controllers/posts_controller.rb
ruby
1class PostsController < ApplicationController 2 before_action :authenticate_user!, only: [:new,:edit] 3 before_action :back_index, only: :edit 4 5 def index 6 @posts = Post.all.order("created_at DESC") 7 end 8 9 def new 10 @post = Post.new 11 end 12 13 def create 14 @post = Post.new(post_params) 15 if @post.save 16 redirect_to root_path 17 else 18 render :new 19 end 20 end 21 22 def show 23 @post = Post.find(params[:id]) 24 @comment = Comment.new 25 @comments = @post.comments.includes(:user) 26 end 27 28 def edit 29 @post = Post.find(params[:id]) 30 end 31 32 def update 33 @post = Post.find(params[:id]) 34 if @post.update(post_params) 35 redirect_to post_path(@post.id) 36 else 37 render :edit 38 end 39 end 40 41 def destroy 42 @post = Post.find(params[:id]) 43 @post.destroy 44 redirect_to user_path(current_user.id) 45 end 46 47 private 48 49 def post_params 50 params.require(:post).permit(:image,:caption,:category_id).merge(user_id: current_user.id) 51 end 52 53 def back_index 54 @post = Post.find(params[:id]) 55 if current_user.id != @post.user_id 56 redirect_to root_path 57 end 58 end 59 60end
controllers/comments_controller.rb
ruby
1class CommentsController < ApplicationController 2 3 def create 4 Comment.create(comment_params) 5 redirect_to "posts/show" 6 end 7 8 private 9 def comment_params 10 params.require(:comment).permit(:text).merge(user_id: current_user.id, post_id: params[:post_id]) 11 end 12end
javascript/comment.js
javascript
1function post (){ 2 const submit = document.getElementById("submit"); 3 submit.addEventListener("click", () => { 4 const form = document.getElementById("form"); 5 const formData = new FormData(form); 6 const XHR = new XMLHttpRequest(); 7 XHR.open("POST","/posts/show",true); 8 XHR.responseType = "json"; 9 XHR.send(formData); 10 }); 11}; 12 13window.addEventListener('load', post);
コメントの送信ボタンを押した時データベースには保存されていました。
controllers/comments_controller.rbのshowアクションで定義してある保存されたら
redirect_to "posts/show"の部分に問題があるのでしょう?
それとも、そもそもjsファイルの方で間違った記述をしているのでしょうか。
あなたの回答
tips
プレビュー