Titanium Nagoya Chatroom Vol.2で話をさせて頂いた「Tiのソケットで待ってる」のスライドです。

1. ソケット
さきら (@sakira)
Titanium Nagoya Chatroom #02, 2012.03.24
12年3月24日土曜日

2. 自己紹介
さきら (@sakira)
最近はiPhone, iPadとかAndroid向けのアプリ
書いたり、
本を書いたりしてます。
12年3月24日土曜日

3. 自己紹介
さきら (@sakira)
今は名古屋の会社でエンジニアやってます。
もともとは近距離離無線通信とか組み込みの会社
やっぱりiPadとかAndroidとかiPhoneとかの
アプリ書いたり、解析したりとか。
で、「何かと通信させるお仕事」が多かったり
JavaScript勉強中。ﾃﾍﾍｯ(*ﾟｰﾟ)>
12年3月24日土曜日

4. おしながき
TCPソケットって何? 便利なの?
TCPソケットってどうやって動くの?
TCPソケットってどうやって使うの?
TCPソケット使って何したの?
12年3月24日土曜日

5. ソケット? おいしいの?
12年3月24日土曜日

6. スマートフォンでの通信って
スマートフォンで扱う通信と言えば…
インターネット上のサーバ
サーバでのプログラミングの話
サーバのリソース管理の話
XML, JSONの扱い方
Ti.Network.HTTPClient
とかとか…
12年3月24日土曜日

7. 「ソケットといっしょ…」
今日はTCP/IPをじかに扱います
「じかに扱う」って?
TCP/IP自身は皆さん毎日使ってます
インターネット使ってればそりゃもう！
例えばHTTPとの関係は?
※詳しくは次のページへ
12年3月24日土曜日

8. 「TCP」
OSI参照モデル
アプリケーション層 HTTP、DHCP、SMTP、FTPとか
プレゼンテーション層 SMTP、FTPとか
セッション層 TLSとか
トランスポート層 TCP、UDPとか
ネットワーク層 IP、ARP、ICMPとか
データリンク層 イーサネットとか
物理理層 無線、光ケーブル
縁の下の力持ち的な何か。 (wikipediaから引用)
12年3月24日土曜日

9. 「TCPにライバル。」
TCP HTTP
上下関係 基礎 応用
仕組み 単純 ちょっと複雑?
便利に使えるように
OS支援 ふつう? なってる
外部ライブラリ あんまり聞かない いっぱいある
クロスプラット
フォーム OK OK
プログラマから
見て 面倒… かんたん！
TCP、いいとこないじゃん…
orz
12年3月24日土曜日

10. 「なまTCPはすごかった。」(1)
TCPは「縁の下の力持ち」だけじゃない！
いっぺん繋がってしまえば、
サーバとクライアント関係なし
LANにつながるモノなら、
どんなものでもサポートしてる
マイコンとかとも簡単に通信できるヨ！
スマートフォン同士で通信できるよ
生TCPちゃんは、やればでできるコなんです！
はちゃんと使って
12年3月24日土曜日

11. 「なまTCPはすごかった。」(2)
なまTCPのソケットはおいしいのです
iPhoneとAndroidの直接通信だって
カンタン！
そう、Titanium Mobileならばね！
つないでからはサーバとクライアントは
関係ないけど
つながるまではサーバとクライアントは
意識しないといけません。
12年3月24日土曜日

12. TCPソケットの処理
12年3月24日土曜日

13. 「困ります、生ソケット。」
TCPはネットワークの基礎
スマートフォンで 生のままTCP使うことが
想定されていない
通信の仕組みを知る必要
通信をプログラマが制御する必要
美味しい話ばかりではない
12年3月24日土曜日

14. 「ソケットが言っちゃう…」(1)
TCPソケットがつながるまでの話
登場人物
IPアドレス (「192.168.20.5」とか)
通信機器を特定するモノ
ポート番号 (「8080」とか)
どのソフトウェアと通信するかを
指定するモノ
「IPアドレスとポート番号」で、
「どの機器の どのソフトと通信したい」かを
指定する
12年3月24日土曜日

15. 「ソケットが言っちゃう…」(2)
サーバ クライアント
(192.168.2.10:54321) (192.168.2.21)
待ち受け(listen) ポート23008から
192.168.2.10:54321
へ接続(socket)
192.168.2.21:23008
を受け⼊入れ(accept)
192.168.2.10:54321 ⇔ 192.168.2.21:23008
接続確⽴立立
12年3月24日土曜日

16. 「ソケットといっしょ…」
TCPソケットは一端つながれば、後は、
切れてしまうまで、つながりっぱなし
「2本の土管」のように入出力を行える
片方から送ると、もう片方では受信できる
ストリームというモノを意識するのが吉
なんかホースとか雨樋にちょろちょろ
水が流れてくるイメージ?
必ずしも一度にデータが来てくれる訳で
はないのがちょっとやっかい
12年3月24日土曜日

17. なまソケットがつながってから(1)
送る側は基本的にあまり考えることない
「このデータ送っておいて」とOSに
お願いしておけば、大抵はよろしく
やってくれる
Java (Android)の場合は、いちおう送る
時にもストリーム使った方がいいけど…
12年3月24日土曜日

18. なまソケットがつながってから(2)
Androidでデータを受ける場合
アプリの アプリの
メインスレッド OOSS
通信スレッド
データ来たよ
データ揃ったよ
データ来たよ
12年3月24日土曜日

19. なまソケットがつながってから(3)
iOSやTitaniumでデータを受ける場合
アプリの
Androidとは OOSS
メインスレッド
使うAPIが違う…
ってだけじゃなく データ来たよ
て、構造も変えな
くちゃいけない。
クロスプラット
データ
フォーム対応 データ来たよ
ちょっと大変。 揃った！
12年3月24日土曜日

20. プラットホーム別の実装
12年3月24日土曜日

21. Androidの場合
基本的にはJavaの知識が使える
Thread
Socket
ServerSocket (サーバ側)
スレッドはちょっとだけ面倒
ServerSocketもちょっとだけ面倒
12年3月24日土曜日

22. iPhone/iPadの場合
スレッド使わなくて大丈夫
スレッド使ってもいいけど
下手に使うとパフォーマンス落ちるよ
クライアント側はCFStreamCreatePairWithSocketToHostって
便利な関数を使えば、入出力ストリームまで用意して
くれる
サーバ側はC言語のlisten, acceptとか使ってから
CFStreamCreatePairWithSocketって関数でストリーム化す
る
Objective-Cだけで完結しないのでちょっと…
12年3月24日土曜日

23. Titanium Mobileの場合
スレッド使わなくて大丈夫！
クライアント側もサーバ側も
Titanium.Network.Socket.TCPだけでOK！
かんたん！
ホントに簡単なんだってば！
Titanium 1.7で導入
12年3月24日土曜日

24. var
listen
=
Ti.Network.Socket.createTCP({
port
:
consts.ServerPort,
listenQueueSize:
20,
accepted
:
function(e)
{
//
なんか処理
},
error
:
function(e)
{
//
なんかエラー処理
}
});
listen.listen();
listen.accept({});
12年3月24日土曜日

25. 「困ります、Ti。」
まだTi.Network.Socket.TCPにバグが
残ってました
Android側では受信タイムアウトが設定される
というバグ
ドキュメントの記述ともiOS側の挙動ともちがう
iOS側ではタイムアウトの単位がミリ秒じゃなくて
秒だった
ドキュメントの記述ともAndroid側の挙動ともちがう
バグ報告して、Git経由で修正コードを提供。
2.0に入れてもらえそう?
12年3月24日土曜日

26. サンプルアプリの紹介
12年3月24日土曜日

27. PhotoExchange(仮)
慌てて水曜日から作りはじめた
無線LAN経由で写真をどんどん
他のスマートフォンに送りつける
勝手に送りつける
サーバを介さないよ！
インターネットに
つながってなくてもいいよ！
12年3月24日土曜日

28. 簡単な構造
定数(スマートフォンのIPアドレス、
待ち受けポート番号、バッファの大き
さ、表示する画像の数)
関数(画像の表示、
指定したIPアドレスへ接続、
指定したIPアドレスへ写真送付、
接続中の全てへ写真送付、
データの読み込み、
他のスマートフォンの探索と接続)
変数(探索中番号(IPアドレスの末尾)、
接続中のソケット達、
カメラで取った画像のファイル、
表示用ImageViewの配列、
次に表示するImageViewの番号)
12年3月24日土曜日

29. 接続
アプリは起動するとポート54321で
待ち受けする
と同時に、他のIPアドレスの54321を
叩きまくる
撮るたびに写真データをつながってる
全てのスマートフォンに送りつける
効率率率? なにそれ。
12年3月24日土曜日

30. 送信
こんな流れです
写真撮る
画像を縮小
つながってるソケットに送信
socket.write(header);
Ti.Stream.writeStream(stream,
socket,
len);
socket.write(footer);
画像の長さ 画像データ パディング
効率率率? (ry
4バイト 可変長
64KB
12年3月24日土曜日

31. 受信
一度に全部来てくれる訳じゃないので
ちょっとだけ面倒
こんな流れ
とりあえず64KBになるまで受信
ヘッダ見て画像の長さを判断
画像データを取り出して
Ti.UI.ImageViewに設定
var
imgbuf
=
socket.inputCache.clone(4,
len);
var
image
=
imgbuf.toBlob();
funcs.setImageView(image);
12年3月24日土曜日

32. デモ
12年3月24日土曜日

33. まとめと補足
生でソケットって良いよ
面倒なソケット(特にサーバソケット)も
Titanium Mobileなら簡単！
しかも勝手にクロスプラットホーム！
でも細かい制御しようと思ったら
ネイティヴアプリが必要なのかも
細かい制御のためのメソッド、プロパティの拡充に
期待したい
UDPも使いたいなっ。お願い❤
12年3月24日土曜日