TCP Server Socket API for Firefox OS at ABC 2013 spring

1. Firefox OSにおける
サーバ機能開発の取り組み
@ABC 2013 spring
Tomoaki Konno
KDDI R&D Laboratories, Inc.

2. 自己紹介
O Tomoaki Konno@KDDI R&D Laboratories,
Inc.
O HTML5関連の開発・標準化活動
O Firefox OS、地図
O W3C SVG WGメンバー
Github • https://github.com/gitomo/
2

3. Agenda
OServerとFFOS
ODemo
OAPIの使い方
Oアプリの作り方
O工夫
Oまとめ
3

4. 4

5. よくある風景
5

6. 6

7. 7

8. 8

9. Firefox OS
http://www.slideshare.net/dynamis/firefox-os-html5j 9

10. 10

11. 11

12. TCP Socket通信
Server Client
この部分
socket を実装 socket
JS
listen
CPP open
accept IDL
new socket
send/recv send/recv
close close
12

13. Demo
OTCP Socket通信
O サーバ・クライアント間での
Oテキストのやりとり
O画像のやりとり
OHTTPサーバ
O サーバ・クライアント間での
Ohtmlコンテンツのやりとり
13

14. Demo: TCP Socket通信（動画）
14

15. Demo: HTTPサーバ（動画）
15

16. 16

17. アプリ開発までの流れ
FFOSイン パッチ アプリ
ストール 適用 開発
17

18. Mozilla Developer Network (MDN)
https://developer.mozilla.org/en- 18
US/docs/Mozilla/Firefox_OS

19. Bugzilla
https://bugzilla.mozilla.org/show_bug.cgi?id=797561
19

20. パッチ適用
ここから
Download
B2G# cd gecko
B2G/gecko# patch –p1 < bug797561_v*.patch
https://bugzilla.mozilla.org/show_bug.cgi?id=797561 20

21. manifestの設定追加
B2G manifest.webapp
{
"permissions": {
gecko gaia "systemXHR":{},
"tcp-socket":{},
}
apps
}
httpCom
App これを追加
index.ht manifest.
js style
ml webapp
21

22. 22

23. APIの使い方（サーバ側）
tcpservsock = navigator.mozTCPSocket.listen(port,
OPTION);
tcpservsock.onaccept = function(acceptsock) {
acceptsock.ondata = function(container) {
displayData(container.data);
};
acceptsock.onclose = function() {
closing();
};
acceptsock.send(message);
}
tcpservsock.onerror = function(e) {
displayError(e.data.message);
}
23

24. APIの使い方（クライアント側）
tcpsock = navigator.mozTCPSocket.open(host, port,
OPTION);
tcpsock.onopen = function() {
tcpsock.send(message);
tcpsock.close();
}
tcpsock.ondata = function(container) {
displayData(container.data);
};
tcpsock.onclose = function() {
closing();
};
tcpsock.onerror = function(e) {
displayError(e.data.message);
}
24

25. アプリ開発時のちょっとした工夫
Oアプリの変更を実機で確認したい場合、
flashが必要。
OWi-FiのPWを毎回打ちたくない時
O B2g/gaia/apps/communications/ftu/ui.js
O chooseNetworkメソッド内
passwordInput.value = "xxxxxxxx";
ssidHeader.value = ssid;
※ただし、コード公開時にはPW毎公
開しないようにお気を付けください。
重要なPWは書かないこと。
自己責任でお願いします。
25

26. 便利なもの
O 実機以外の動作環境
O Firefox OS Simulator (recommended)
O https://hacks.mozilla.org/2013/03/firefox-os-simulator-previewing-
version-3-0/
O B2G Desktop Client
O https://developer.mozilla.org/en-
US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client
O B2G Emulator
O https://developer.mozilla.org/en-
US/docs/Mozilla/Firefox_OS/Using_the_B2G_emulators?redirectlocale
=en-US&redirectslug=Firefox_OS%2FUsing_the_B2G_emulators
O Mozilla Cross Reference
O http://mxr.mozilla.org/
O ツール
O gitgui
O meld
26

27. 27

28. Bug: v.next technology
次世代以降の
FFOSの機能候補
TCP Server Socket
APIも掲載
https://bugzilla.mozilla.org/show_bug.cgi?id=844910 28

29. まとめ
OFFOSにおけるTCP Server Socket APIを
使った開発
O https://bugzilla.mozilla.org/show_bug.cgi?id= 797561
Github • https://github.com/gitomo/
29