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

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

新規登録して質問してみよう
ただいま回答率
85.50%
Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

1754閲覧

railsでbroadcastしたが、その際にjsのreceivedが動かない

kozica

総合スコア58

Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

MySQL

MySQL(マイエスキューエル)は、TCX DataKonsultAB社などが開発するRDBMS(リレーショナルデータベースの管理システム)です。世界で最も人気の高いシステムで、オープンソースで開発されています。MySQLデータベースサーバは、高速性と信頼性があり、Linux、UNIX、Windowsなどの複数のプラットフォームで動作することができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/01/21 12:22

rails5を使い、簡単なチャットアプリを作ろうとしています。

しかし、以下のソースで
Chromeの検証ツールコンソールにて
「App.room.speak()」
を実行し、trueとでたものの、alertが表示されません。
これはreceivedが実行されていないという事ですが、なぜなのでしょうか?

js

1#room.js 2App.room = App.cable.subscriptions.create("RoomChannel", { 3 connected: function() { 4 console.log('conected'); 5 // Called when the subscription is ready for use on the server 6 }, 7 8 disconnected: function() { 9 // Called when the subscription has been terminated by the server 10 }, 11 12 received: function(data) { 13 alert(data); 14 // Called when there's incoming data on the websocket for this channel 15 }, 16 17 speak: function() { 18 return this.perform('speak', {message: 'test now'}); 19 } 20});

ruby

1class RoomChannel < ApplicationCable::Channel 2 def subscribed 3 # stream_from "some_channel" 4 end 5 6 def unsubscribed 7 # Any cleanup needed when channel is unsubscribed 8 end 9 10 def speak(data) 11 Message.create!(content: data['message']) 12 ActionCable.server.broadcast 'room_channel', data['message'] 13 end 14end

ログには下記のように出力されています。

Started GET "/cable" for 127.0.0.1 at 2019-01-21 20:56:19 +0900 Started GET "/cable/" [WebSocket] for 127.0.0.1 at 2019-01-21 20:56:19 +0900 Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket) RoomChannel is transmitting the subscription confirmation Started GET "/cable" for 127.0.0.1 at 2019-01-21 20:56:25 +0900 Started GET "/cable/" [WebSocket] for 127.0.0.1 at 2019-01-21 20:56:25 +0900 Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket) RoomChannel is transmitting the subscription confirmation Started GET "/cable" for 127.0.0.1 at 2019-01-21 20:56:25 +0900 Started GET "/cable/" [WebSocket] for 127.0.0.1 at 2019-01-21 20:56:25 +0900 Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket) RoomChannel is transmitting the subscription confirmation Started GET "/cable" for 127.0.0.1 at 2019-01-21 20:56:27 +0900 Started GET "/cable/" [WebSocket] for 127.0.0.1 at 2019-01-21 20:56:27 +0900 Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket) RoomChannel is transmitting the subscription confirmation RoomChannel#speak({"message"=>"test now"}) (0.8ms) BEGIN ↳ app/channels/room_channel.rb:11 Message Create (11.2ms) INSERT INTO `messages` (`content`, `created_at`, `updated_at`) VALUES ('test now', '2019-01-21 11:56:31', '2019-01-21 11:56:31') ↳ app/channels/room_channel.rb:11 (51.5ms) COMMIT ↳ app/channels/room_channel.rb:11 [ActionCable] Broadcasting to room_channel: "test now"

また、「true」が出て少し時間が経ってから下記エラーが検証ツールコンソールにて出てきました。
これがalertが出ない原因なのでしょうか?

> App.room.speak() < true Error in event handler for (unknown): TypeError: Cannot read property 'state' of undefined at CSRecorder.onQueryStateCompleted (chrome-extension://cplklnmnlbnpmjogncfgfijoopmnlemp/content_scripts/recorder.js:106:18)

ちなみに、本件は下記youtubeの動画の通り進めてきました。
「28:37」のとこで私はalertが出ずに詰まっております。
https://youtu.be/WCsgcp5dg7M

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

subscribedのコメントアウトを外し、
room_channelをストリーミングしてください。

以前ActionCableの記事を書いたので参考にしてください

投稿2019/01/22 02:35

編集2019/01/22 02:36
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kozica

2019/01/22 11:55

無事うまく行きました! ありがとうございます!(T ^ T)
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問