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

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

ただいまの
回答率

87.78%

Railsでログイン後に1分位するとHTMLコードが表示されてしまいます。

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,536

score 162

RailsでWebアプリを学習しながら作成しています。Topページからログインし、1分くらいするとHTMLコードが表示されてしまいます。
その後も、1分間隔くらいで更新されていてるみたいな動きをします。HTMLコードが表示されるようになってしまった原因が
わからずに困っております。
ログイン直後の画面
イメージ説明
1分くらい後の画面
イメージ説明
各機能は正常に機能します。
画面をクリックするとログイン直後の画面になりますが、また1分後くらいにHTMLコードが表示されます。
ログイン後のコマンドプロンプトに表示されたコード

Started GET "/" for 10.0.2.2 at 2017-08-30 01:51:50 +0000
Processing by Staff::TopController#index as HTML
  Parameters: {"host"=>"chibi.example.com"}
  StaffMember Load (0.6ms)  SELECT  `staff_members`.* FROM `staff_members` WHERE `staff_members`.`id` = 11 LIMIT 1
  Rendering staff/top/dashboard.html.erb within layouts/staff
  Rendered staff/top/dashboard.html.erb within layouts/staff (1.1ms)
   (1.2ms)  SELECT COUNT(*) FROM `messages` WHERE `messages`.`type` IN ('CustomerMessage') AND `messages`.`status` = 'new' AND `messages`.`deleted` = 0
  Rendered staff/shared/_header.html.erb (75.2ms)
  Rendered shared/_footer.html.erb (0.9ms)
Completed 200 OK in 426ms (Views: 407.3ms | ActiveRecord: 13.9ms)


HTMLコードが表示されたときにコマンドプロンプトに表示されたコード(これが1分間隔で繰り返し更新されていってます。

Started GET "/" for 10.0.2.2 at 2017-08-30 01:52:51 +0000
Processing by Staff::TopController#index as */*
  Parameters: {"host"=>"chibi.example.com"}
  StaffMember Load (1.5ms)  SELECT  `staff_members`.* FROM `staff_members` WHERE `staff_members`.`id` = 11 LIMIT 1
  Rendering staff/top/dashboard.html.erb within layouts/staff
  Rendered staff/top/dashboard.html.erb within layouts/staff (1.1ms)
   (0.6ms)  SELECT COUNT(*) FROM `messages` WHERE `messages`.`type` IN ('CustomerMessage') AND `messages`.`status` = 'new' AND `messages`.`deleted` = 0
  Rendered staff/shared/_header.html.erb (4.3ms)
  Rendered shared/_footer.html.erb (0.5ms)
Completed 200 OK in 307ms (Views: 300.3ms | ActiveRecord: 2.0ms)


ヘッダー部分に「新規問い合わせ」リンクがあり、1分ごとに新規問い合わせ件数を調べてヘッダーを更新するCoffeeScriptプログラムを
作りました。これが利いて更新されているのだと思います。

app/assets/javascripts/staff/messages.js.coffee

$(document).on 'turbolinks:load', ->
  if $('#number-of-unprocessed-messages').length
    setInterval(update_number_of_unprocessed_messages, 1000 * 60)

update_number_of_unprocessed_messages = ->
  $.get window.path_for("count_staff_messages"), (data) ->
    $('#number-of-unprocessed-messages').text "(#{data})"


出力されているHTMLコードにカーソルを当てると「新規問い合わせ」リンクのHTMLコードが出力され、更新されているみたいです。
機能的には問題が無いのでただ、HTMLコードが表示されなければ問題は無いのですが、どこを修正すればいいのか
わからないので、どなたか教えていただけませんでしょうか?
ファイルの量が多すぎて特定できないのですが、routs.rbが悪さしているのか、controllerなのか、viewなのか、modelなのか
それともjavaScriptなのか、このような現象はどこのファイルが原因なのでしょうか?教えてください。
宜しくお願いします。

追記:
countアクションを追加

app/controllers/staff/messages_controller.rb

class Staff::MessagesController < Staff::Base
  before_action :reject_non_xhr, only: [ :count ]

  def index
    @messages = Message.where(deleted: false).page(params[:page])
  end

  # GET
  def inbound
    @messages = CustomerMessage.where(deleted: false).page(params[:page])
    render action: 'index'
  end

  # GET
  def outbound
    @messages = StaffMessage.where(deleted: false).page(params[:page])
    render action: 'index'
  end

  # GET
  def deleted
    @messages = Message.where(deleted: true).page(params[:page])
    render action: 'index'
  end

  #GET
  def count
    render text: CustomerMessage.unprocessed.count
  end

  def show
    @message = Message.find(params[:id])
  end

  def destroy
    message = CustomerMessage.find(params[:id])
    message.update_column(:deleted, true)
    flash.notice = '問い合わせを削除しました。'
    redirect_back(fallback_location: root_path)
  end

  # POST/DELETE
  def tag
    message = CustomerMessage.find(params[:id])
    if request.post?
      message.add_tag(params[:label])
    elsif request.delete?
      message.remove_tag(params[:label])
    else
      raise
    end
    render text: 'OK'
  end
end


CutomerMessageモデルにunprocessedスコープを定義する。

app/models/customer_message.rb

class CustomerMessage < Message
  scope :unprocessed, -> { where(status: 'new', deleted: false) }
end


ヘッダ部分に「新規問い合わせ」リンクを表示するためのヘルパーメソッドnumber_of_unprocesser_messagesを定義。

app/helpers/staff_helper.rb

module StaffHelper
  include HtmlBuilder

  def number_of_unprocessed_messages
    markup do |m|
      m.a(href: inbound_staff_messages_path) do
        m << '新規問い合わせ'
        if (c = CustomerMessage.unprocessed.count) > 0
          anchor_text = "(#{c})"
        else
          anchor_text = ''
        end
        m.span(anchor_text, id: 'number-of-unprocessed-messages')
      end
    end
  end
end


ヘッダにリンクを設置。

app/view/staff/shared/_header.html.erb

<header>
  <%= link_to 'CHIBI', :staff_root, class: 'logo-mark' %>
  <%= content_tag(:span, flash.notice, class: 'notice') if flash.notice %>
  <%= content_tag(:span, flash.alert, class: 'alert') if flash.alert %>
  <%=
    if current_staff_member
      link_to 'ログアウト', :staff_session, method: :delete
    else
      link_to 'ログイン', :staff_login
    end
  %>
  <%= link_to 'アカウント', :staff_account if current_staff_member %>
  <%= number_of_unprocessed_messages if current_staff_member %>
</header>


ルーティングで定義されるヘルパーメソッドをapp/assetsディレクトリにあるファイルの中で使えるようにする。

config/initializers/assets.rb

Rails.application.config.assets.precompile += 
%w( staff.css admin.css customer.css staff.js admin.js customer.js )

Sprockets::Context.send(:include, Rails.application.routes.url_helpers)


CoffeeScriptに対して擬似的なグローバル変数を提供する。

app/assets/javascripts/staff/paths.js.coffee.erb

window.named_paths = []
<% %w(count_staff_messages tag_staff_message).each do |name| %>
<% route = Rails.application.routes.named_routes[name] %>
<%= "window.named_paths['#{name}'] = '#{route.path.spec.left.to_s}'\n" %>
<% end %>

window.path_for = (name, ids = {}) ->
  path = window.named_paths[name]
  for key, id of ids
    path = path.replace(new RegExp(":#{key}\\b"), id)
  path


関連すると思われるコードを追記しました。

  • 気になる質問をクリップする

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

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

    クリップを取り消します

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

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

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

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

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

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

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

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

    質問の評価を下げる

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

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

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

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

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

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

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

    詳細な説明はこちら

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

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

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

回答 1

checkベストアンサー

0

CoffeeScriptで、$.getの中身が$('#number-of-unprocessed-messages').text "(#{data})"となっているので、来たHTMLをそのまま表示する状態となっています。

ここで必要なデータだけに絞り込んで、適切な部分の表示を書き換える、というような形にしていく必要があると考えます。

投稿

  • 回答の評価を上げる

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

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

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

  • 回答の評価を下げる

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

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

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

  • 2017/08/30 17:06

    回答ありがとうございます。数時間、コードとにらめっこしていますが、初心者の私には対処方法がうかびません。関連していそうなコードを追記させていただきました。表示したいのはヘッダー部の
    「新規追い合わせ(*)」を表示させたままで1分おきに新規問い合わせ件数を調べて、ヘッダ部を更して
    新規に問い合わせが追加されていれば(*)の中の数字が変わるという表示をさせたいのです。お忙しいとは思いますが、教えていただけないでしょうか?助けてください。お願いします。

    キャンセル

  • 2017/08/30 17:11

    サーバログで「Started GET "/"」となっていますので、リクエスト自体がcountアクションへ飛んでいない、ということも考えられます。JavaScriptコンソールからwindow.path_for("count_staff_messages")の結果も確認してみて下さい。

    キャンセル

  • 2017/08/30 18:30

    回答ありがとうございました。app/assets/javascripts/staff/paths.js.coffee.erbを下記にしたら直りました。時間をかけて見直してみます。
    window.paths = new Object
    window.paths.number_of_unprocessed_messages =
    "<%= count_staff_messages_path %>"

    キャンセル

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

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

関連した質問

同じタグがついた質問を見る