質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.13%

ActionController::RoutingError (No route matches [GET] "/groups/41/[object"):教えてください。。。

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 216

nemutai_

score 7

railsでajaxを用いて自動更新を実装しようとしていましてなんとかローカルサーバーで無事繋がり自動更新自体はされているのですが、データがうまく送れていないのかこの「ActionController::RoutingError (No route matches [GET] "/groups/41/[object"):」
が出てしまいます。どこを修正もしくは加えたら直りますか。

class Api::MessagesController < ApplicationController
  def index
    group = Group.find(params[:group_id])
    last_message_id = params[:id].to_i
    @messages = group.messages.includes(:user).where("id > #{last_message_id}")
  end
end
$(function() {

  function buildHTML(message) {
    var image = message.image? `<img src= ${ message.image }>` : "";
    var html = `<div class="message" data-message="${message.id}">
                  <div class="upper-message">
                    <div class="upper-message__user-name">
                      ${message.user_name}
                    </div>
                    <div class="upper-message__date">
                      ${message.date}
                    </div>
                  </div>
                  <div class="lower-message">
                    <p class="lower-message__content">
                      ${message.content}
                    </p>
                    ${image}
                </div>`
    return html;
  }
  $('#new_message').on ('submit', function(e){
    e.preventDefault();
    var formData = new FormData(this);
    var url = $(this).attr('action')

    $.ajax({
      url: url,
      type: "POST",
      data: formData,
      dataType: 'json',
      processData: false,
      contentType: false
    })

    .done(function(data) {
      var html = buildHTML(data);
      $('.messages').append(html);
      $('#new_message')[0].reset();
      $('.messages').animate({ scrollTop: $('.messages')[0].scrollHeight});
    })

    .fail(function(data) {
      alert('メッセージを入力してください')
    })

    .always(function(data) {
      $('.form__submit').prop('disabled', false);
    })
  });

  var reloadMessages = function() {
    if (window.location.href.match(/\/groups\/\d+\/messages/)){
      var last_message_id = $('.message:last').data("message-id")
      $.ajax({
        url: 'api/messages',
        type: 'get',
        dataType: 'json',
        data: {id: last_message_id}
      })
      .done(function(messages) {
        var insertHTML = '';
        messages.forEach(function(message){
          insertHTML = buildHTML(message);
          $('.messages').append(insertHTML);
          $('.messages').animate({ scrollTop: $('.messages')[0].scrollHeight});
        })
      })
       .fail(function() {
        alert('自動更新に失敗しました!');
      });
    }
  };
  setInterval(reloadMessages, 5000);
});
json.array! @messages do |message|
  json.content    message.content
  json.image      message.image
  json.created_at message.created_at
  json.user_name  message.user.name
  json.id         message.id
end
.message{"data-message-id": "#{message.id}"}
  .upper-message
    .upper-message__user-name
      = message.user.name
    .upper-message__date
      = message.created_at.strftime("%Y/%m/%d %H:%M")
  .lower-message
    - if message.content.present?
      .lower-message__content
        = message.content
    = image_tag message.image.url, class: 'lower-message__image' if message.image.present?
Rails.application.routes.draw do
  devise_for :users
  root 'groups#index'
  resources :users, only: [:index,:edit, :update]
  resources :groups, only: [:new, :create, :edit, :update] do
    resources :messages, only: [:index, :create]
    namespace :api do
      resources :messages, only: :index, defaults: { format: 'json' }
    end
  end
end

追記

[1]こちらのコードを突っつかれますと、、

.message{"data-message-id": "#{message.id}"}


[2]同じgroup.idの場合のみここの処理がされ、、、

var reloadMessages = function() {
    if (window.location.href.match(/\/groups\/\d+\/messages/)){
      var last_message_id = $('.message:last').data("message-id")
      $.ajax({
        url: 'api/messages',
        type: 'get',
        dataType: 'json',
        data: {id: last_message_id}
      })
      .done(function(messages) {
        var insertHTML = '';
        messages.forEach(function(message){
          insertHTML = buildHTML(message);
          $('.messages').append(insertHTML);
          $('.messages').animate({ scrollTop: $('.messages')[0].scrollHeight});
        })
      })
       .fail(function() {
        alert('自動更新に失敗しました!');
      });
    }
  };
  setInterval(reloadMessages, 5000);
});


[3]このapi/index.controller.rbが始まります。

class Api::MessagesController < ApplicationController
  def index
    group = Group.find(params[:group_id])
    last_message_id = params[:id].to_i
    @messages = group.messages.includes(:user).where("id > #{last_message_id}")
  end
end

[#]こちらがconfig/routes.rbになります。

Rails.application.routes.draw do
  devise_for :users
  root 'groups#index'
  resources :users, only: [:index,:edit, :update]
  resources :groups, only: [:new, :create, :edit, :update] do
    resources :messages, only: [:index, :create]
    namespace :api do
      resources :messages, only: :index, defaults: { format: 'json' }
    end
  end
end
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • winterboum

    2019/08/11 10:22

    読み解くのもこの暑さ辛いので、
    1) haml のどの要素を突っつくと、
    2) どのfunctionが呼ばれ
    3) controllerのどれに送るつもりなのか

    config/routes.rb

    教えて下さい。
    # コメントでなく、質問本文に追記で

    キャンセル

  • nemutai_

    2019/08/11 14:54

    追記をいたしました。
    わかりづらいままの投稿にも関わらずありがとうございます。
    自分なりに情報は絞ったつもりなのですが、聞かれていることマッチしてない可能性もあるかもしれませんがよろしくお願いします。

    キャンセル

回答 1

checkベストアンサー

+1

きちんと読んでいませんが、気になる所がいくつかあります
1)エラーメッセージの No route matches [GET] "/groups/41/[object"
の、最後 "[object"。 ここはactionが入るところなので、そこがおかしい。この部分のURLの作り方を間違えているのでは、と どのfunctionが呼ばれているのかを確認しました。
JSは苦手なので読みそこねているかもですが、この $.ajax({}) で "/groups/41/[object" となるのがはて。この [object というのは JSが期待している値を返しておらず object 某というのを返しそれが出て来ているのでは?と思いました。$.ajax({}) が使う変数の値をalertなどで確認してみて下さい。

2)url: 'api/messages' で呼んでいるのに /groups/41/ が無いと言っている。本当にそのfunctionが反応していますか?

3) /api/messages のindexからこのfunctionが呼ばれる で合ってます?
すると url "api/messages" は /api/messages/api/messages を呼びませんか?

4)このroutes.rb で /api/messages を呼ぶroutesができます?
rails routs で確かめて下さい

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/11 19:45

    お返事遅くなりすみません。
    [2]に関しては今一度確認してみたら何かおかしいと思いました。
    [4]に関しましてはしっかり呼び出せるように設定してあります。


    もらったお返事をもとに調べながらやってみようと思います。
    お忙し中ありがとうございました!

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.13%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる