Creating a Real Time Chat Application with Ionic 2 and Socket.io ionic2でsocket.ioを使うにはどうしたら良いかと思い最初に見つけたのがこの記事。ですが、index.htmlでインポートするというのはionic2/angular2の作法に沿っていない様に思われ、もしindex.htmlがアップデートされたときに記述が消失してしまうリスクもあるように思いました。そこでもう少し検索して発見したのがこちら。How to include socket.io-client · Issue #221 · AngularClass/angular2-webpack-starter npmでsocket.io-clientというモジュールを入れて、これを呼ぶとのこと。npmからローカルインストールされたものがクライアントのビルドの中に入るのかちょっと不安でしたがやってみたらできました。
npm install socket.io-client --savetypings install socket.io-client --save --ambient
このとおりインストールしてコードを書いてみます。書き方は公式より。socketio/socket.io-client: Realtime application framework (client)
import {Page, NavController, NavParams} from 'ionic-angular';import {ItemDetailsPage} from '../item-details/item-details';import * as io from 'socket.io-client';@Page({ templateUrl: 'build/pages/registered-riders-list/registered-riders-list.html'})export class registerdRidersList { selectedItem: any; icons: string[]; items: Array<{title: string, note: string, icon: string}>; constructor(private nav: NavController, navParams: NavParams) { var socketio = io('http://localhost:8080'); socketio.emit('CS_REQ_registerdRiders',''); socketio.on(""SC_RES_registeredRiders"", function (data) { console.log(data); });
ちゃんとサーバー側への送信(emit)、サーバー側からの受信(on)、両方が作動しました。”””