Open2021/11/05にコメント追加2

Phoenixで複数のチャネルを実装する方法

Endo Shogo 2021/11/05に更新

PhoenixフレームワークのChannel機能で、トピックではなく複数の異なるチャネルの実装と接続方法を調べる。
例えば、ゲームのチャットとゲーム本体の通信など、1つのアプリケーション上で異なる機能を持つ複数のチャネルを扱いたいケースがあるため。

資料:

Endo Shogo 2021/11/05に更新

とりあえずサンプルプロジェクトを作り、mix phx.gen.socketでいくつかチャネルを作ってみる

$ mix phx.new demo_multi_channel
$ cd demo_multi_channel
$ mix phx.gen.socket TKY
* creating lib/demo_multi_channel_web/channels/tky_socket.ex
* creating assets/js/tky_socket.js

Add the socket handler to your `lib/demo_multi_channel_web/endpoint.ex`, for example:

    socket "/socket", DemoMultiChannelWeb.TKYSocket,
      websocket: true,
      longpoll: false

For the front-end integration, you need to import the `tky_socket.js`
in your `assets/js/app.js` file:

    import "./tky_socket.js"

$ mix phx.gen.socket MX
* creating lib/demo_multi_channel_web/channels/mx_socket.ex
* creating assets/js/mx_socket.js

Add the socket handler to your `lib/demo_multi_channel_web/endpoint.ex`, for example:

    socket "/socket", DemoMultiChannelWeb.MXSocket,
      websocket: true,
      longpoll: false

For the front-end integration, you need to import the `mx_socket.js`
in your `assets/js/app.js` file:

    import "./mx_socket.js"

コマンドの指示どおり、endpoint.exやassets/js/app.jsに記述を追加。
確認のためmix phx.routeする。

$ mix phx.routes
Compiling 16 files (.ex)
Generated demo_multi_channel app
          page_path  GET  /                                      DemoMultiChannelWeb.PageController :index
live_dashboard_path  GET  /dashboard                             Phoenix.LiveView.Plug :home
live_dashboard_path  GET  /dashboard/:page                       Phoenix.LiveView.Plug :page
live_dashboard_path  GET  /dashboard/:node/:page                 Phoenix.LiveView.Plug :page
                     *    /dev/mailbox                           Plug.Swoosh.MailboxPreview []
          websocket  WS   /mx/websocket                          DemoMultiChannelWeb.MXSocket
          websocket  WS   /tky/websocket                         DemoMultiChannelWeb.TKYSocket
          websocket  WS   /live/websocket                        Phoenix.LiveView.Socket
           longpoll  GET  /live/longpoll                         Phoenix.LiveView.Socket
           longpoll  POST  /live/longpoll                         Phoenix.LiveView.Socket

ルーティングへの追加はできているみたい。