HTML5 技術を利用した授業や会議向けデスクトップ画面実時間配信システムとその管理システムの試作山之上卓　小荒田裕理　小田謙太郎　下園幸一　鹿児島大学

2014 6/28 情報処理学会 IOT 研究会第２６回 @ 新潟大学

目次

• はじめに• System 概要• 負荷分散機能とプライベートネットワークをまたぐ

CDN 機能• 管理機能• 関連研究• おわりに

はじめに

• 授業やゼミや会議– パソコン画面をプロジェクタでスクリーンに投影– -> 遠くから小さな字や絵を見ることが困難– このような問題に対処するため– -> SOLAR-CATS[1][4] や Multi VNC[7]– -> 会議参加者それぞれに , これらのソフトウェアをイン

ストールしたパソコンが必要 . – ( 市村先生の Quick Board はその問題はありません )

• 最近 , みんな、スマートフォンやノートパソコンを携帯– 発表者のパソコンのデスクトップ画像を , – このような機器で , – 特別なソフトウェアやアプリをインストールすることなし

に , • 共有したい• -> 「 Web Screen Share 」• 我々のゼミで利用

• Web Screen Share – HTML5 の Web Socket 技術– パソコンデスクトップ画面共有システム– 複数の , HTML5 対応 Web ブラウザに , 画像中継 Web

サーバを通じて , 送信元パソコンのデスクトップ画面をリアルタイムで配信

• Web Screen Share は , 参加者が２０名程度までなら , 問題なく動作

• この人数を超えると , 動画を表示するときに , 動きの滑らかさが失われてしまう

• この問題を , – 平衡２分木上に接続されたサーバ間データ転送ノード– を使うことによって , 解消

• 送信元パソコンのデスクトップ画像を– サーバ間データ転送ノードを使って– 複数の画像中継 Web サーバに配送

• Web ブラウザ– 複数の画像中継 Web サーバに , 自動的に , 均等に , 接続

• 「 Distributed Web Screen Share 」

• Web ブラウザの均等割り当て

–トーナメントアルゴリズムを使って実現• Distributed Web Screen Share

– 動画表示の動きの滑らかさを損なうことなく , – より多くの Web クライアントで– 同じデスクトップ画面を共有

• 今回一種の CDN の仕組みを考案し , 試験的に実装– Distributed Web Screen Share のサーバをインター

ネットと階層的なプライベートネットワークの各所に配置– インターネットと階層的なプライベートネットワークのど

ちらにもサーバを配置することが可能– 授業や会議が遠隔地で分散して実施される場合にも対応– Web クライアントを自動的に適切なサーバに割り当てる

機能

• システムの管理者： Web 画面上でサーバを制御可能– 管理者が適切にサーバを加えたり減らしたり可能

• 端末数 , Web クライアントで表示される単位時間あたりの表示画面枚数 , Web クライアントにおけるネットワーク利用バンド幅などの変化も表示可能

• ログも採取• CDN for Web Screen Share, CDN4WSS

2. システム概要

• CDN4DWSS– 大量のクライアント間の画面共有–異なるプライベートネットワークにあるクライアント間の

画面共有 … 遠隔地間の画面共有– 適切なサーバの自動選択

• CDN4WSS

3. 負荷分散機能とプライベートネットワークを またぐ CDN 機能• Web Screen Share• Distributed Web Screen Share• トーナメントアルゴリズムによる負荷分散• 階層的なネットワークにまたがった CDN

• Client-Server 型• HTML5 の Web Socket 技術を使った• パソコンデスクトップ画像の実時間共有システム• 構成

– 1台の Web Server– 複数の Web Client– 画像取得とその画面をサーバに送信する Screen Sender

3.0 Web Screen Share

• Screen Sender – デスクトップ画像を繰り返し取得– 通常の Socket を使って Web Server に送信

• Screen Sender から画像を受け取った Web Server– その画像を各 Web Client に対応した Queue の最後に追加

– Queue に溜まった画像の量が一定値を超えると , その値を超えないように Queue の先頭部分にある画像を削除

– 現在 , この一定値は 3 .

• Web Client – HTML5 , Web Socket – Web Server に対して get コマンドを繰り返し発行

• Web Server が get コマンドを受け取ると– Web Client に対応した Queue の先頭にある画像を , – get コマンドを受け取った Socket に対して送信– その画像を Queue から削除

• 画像を受け取った Web Client … その画像を表示する . • Jetty を利用 (開発当時は Web Socket が利用できる Web

サーバ )

CPU ： intel インテル Celeron デュアルコア E1200 1.6GHz 相当Memory: 2GBScreen Sender : 5fps 解像度 : 1440 x 900 Network: 100Mbps(NIC: 1Gbps)

3. 1 Distributed Web Screen Share-1 　

• 大規模な会議にも対応したい ->• 数百台の Web クライアントが画面共有できるよう

にしたい• Web クライアント増加による性能劣化を緩和したい

–Distributed Web Screen Share (DWSS) を開発

• DWSS– Node System を平衡 2 分木状に接続–葉の位置にある Node system の Web Server に Web

Client をできるだけ均等に割り当て

3. 1 Distributed Web Screen Share-2

3. 1 Distributed Web Screen Share-3• 平衡 2 分木のすべての ISC Node に画像を中継するため ,以下の multi-casting 手続きを利用する .

• 準備– すべてのノード（ ISC ノード）は、

•親、左（の子）、右（の子）– の３つの全２重の TCP 接続を持つ null の場合もある

• 手続き– どれかの TCP 接続から multicast データを受け取ったら , それ

を他の接続に転送する–受け取った multicast データのノード内処理を行う

3. 1 ISC ノードによる平衡２分木の構成 -1• 特許 No. 5186624, (Feb. 2013)• 新規ノード追加時• 準備

– すべてのノードは、自分の左右それぞれの子孫の数を記憶• 葉ノードはそれぞれ０

–根以外のノードは、一定間隔で、　　　自分（１）＋左の子孫の数＋右の子孫の数を親ノードに通知

3.1 ISC ノードによる平衡２分木の構成 -2• ノード追加処理 (recursive procedure)

– あるノードにおいて、•左右ともども子孫がいなかったら、左に追加•左に子孫がいて、右にいなかったら、右に追加• それ以外は子孫の数の少ない方に対してノード追加処理

– 新規ノードは（原則として） (グループの )根ノードから追加

3.1 ISC ノードによる平衡２分木の構成 -3• グループ内ノード障害発生時・離脱時の処理

– ノード数情報を親ノードに送るとき、親から反応がない場合は親がいなくなったと判断

–根以外のグループ内の任意のノードは、親がいなくなったら、自分を新規ノードとして根に追加処理を依頼

• 一時的にバランスはくずれるが、徐々にバランスが保たれる方向にノードが追加される。

3.2 トーナメントアルゴリズムによる負荷分散-1• 準備• 任意のノードは、以下の情報を持つ

– [ 自分の Web サーバの情報 , その Web Client の数 ]–左の子孫における [Web Client 接続先候補 , その Web

Client の数 ]–右の子孫における [Web Client 接続先候補 , その Web

Client の数 ]– ノードの [Web Client 接続先候補 , その Web Client の

数 ]

3.2 トーナメントアルゴリズムによる負荷分散-2• 定期的に以下を行う

–葉ノードは、 [ 自分の Web サーバの情報 , その Web Client の数 ] を

　　 [Web Client 接続先候補 , その Web Client の数 ] とする–節ノードは、左右を比較して、 Web Client の数が少ない方 (勝った方 ) の 　　

　　　　 [Web Client 接続先候補 , その Web Client の数 ] を ノードの [Web Client 接続先候補 , その Web Client の数 ] とする

–根ノード以外は　ノードの [Web Client 接続先候補 , その Web Client の数 ]　を親ノードに伝える

3. 2 トーナメントアルゴリズムによる負荷分散-3• 新規に Web Client が接続されるとき

– その Web Cliet は根ノードに接続する .– 次に、根ノードの Web Client 接続先候補に redirect

する。• 葉ノードの中で最も Web Client 数が少ない Web

サーバに接続する --- 負荷分散

3.2 トーナメントアルゴリズムによる負荷分散-4

0 10 20 30 40 50 60 70 800

1

2

3

4

5

6

サーバ 7台 サーバ 3台

Number of Clients

fps

3.2 アルゴリズムの拡張

• １つの葉ノードに接続される Web Client の制限• 全Web Client 数のモニタ… Web Client 増加時に

は ノードを追加するなどに利用• （Web Client 数減少時）葉ノードへの Web Client

の接続制限 葉ノードを空にしてグループから削除

3.3 階層的なネットワークにまたがったCDN• 3.3.1 階層的ネットワークのモデル• 3.3.2 CDN4WSS• 3.3.3 適切なサーバ割り当てアルゴリズム

3.3.1 階層的ネットワークのモデル

Global Network

Private Private

Private

PrivatePrivate Private Priva

te

HalfConnectableharfConnectable

fullConnnectableaddress(h)addressAt(h,H)host(a,H)NAT ではなく NAPT を想定

3.3.2 CDN4WSS

connectedS をノードとする木S : 一つのネットワークにある CDN4WSSのサーバの集合

communicable(h1,h2)

3.3.3 適切なサーバ割り当てアルゴリズム

• privateRootServers(s∊S)= {addressAt(sxr,Sx)| connected(sxr,sy) where s∊Sy, sy∊Sy, sxr∊Sx, and (sx,sy)∊D}

Procedure connectToAnAppropriateServer(aA)begin connect to privates←privateRootServers(); default if privates then for each if connectable() then connectToAnAppropriateServer() ; connect to default as a client;end;

Screen Sender

Private network-2L Private network-2RPrivate network-1

Global InternetRoot Node System

New Web Client ?

Private IP:PA2L0 Private IP: PA2R0

Node-LNode-R

Node-L is a leaf node in theglobal Internet, and it has the smallest number of web clientsor node systems at private networks.

Private IP: PA0

Private network-0

Screen SenderPrivate network-2L Private network-2R

Private network-1

Global InternetRoot Node System

New Web Client ?

Private IP:PA2L1 Private IP: PA2R1

Node-LNode-R

Node-L is a leaf node in theglobal Internet, and it has the smallest number of web clientsor node systems at private networks.

Private IP: PA0

Private network-0

I’d like to joinyour group.

Global IP address is GA0

Temporal WebSocket Connection

Screen SenderPrivate network-2L Private network-2R

Private network-1

Global InternetRoot Node System

New Web Client ?

Private IP:PA2L1 Private IP: PA2R1

Node-LNode-R

Private IP: PA0

Private network-0

Global IP address is GA0

Does anyone has the private node link, the address of which is GA0?.

Screen SenderPrivate network-2L Private network-2R

Private network-1

Global InternetRoot Node System

New Web Client ?

Private IP:PA2L1 Private IP: PA2R1

Node-L Node-R

Private IP: PA0

Private network-0

Global IP address is GA0

I have it. The private addresses of it is PA0.

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L1 Private IP: PA2R1

Node-L Node-R

Private IP: PA0

Private network-0

Try to connect to PA0.If failed to connect to it, try to connect to Node-L

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L1Private IP: PA2R1

Node-L Node-R

Private IP: PA0

Private network-0

Is it possible to connect to PA0?If yes, …

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L1Private IP: PA2R1

Node-L Node-R

Private IP: PA0

Private network-0

I’d like to join your group.

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L1Private IP: PA2R1

Node-L Node-R

Private IP: PA0

Private network-0

Does anyone has the private node link, the address of which is P10?.

Private IP address is P10

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L0Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Private IP address is P10

I have it. The private addresses of it is PA2R0.

I have it. The private addresses of it is PA2L0.

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L0Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Try to connect to PA2R0 or PA2L0.If failed to connect to it, try to connect to Node-P0L

Node-P0L

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?Private IP:PA2L0

Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Node-P0L

Is it possible to connect to PA2R0?If No, …

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L0

Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Node-P0L

Is it possible to connect to PA2L0?If Yes, …

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L0

Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Node-P0L

I’d like to join your group

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L0

Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Node-P0L

I have no children Nodes.So the new web client can connect to me as my web client.

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client ?

Private IP:PA2L0

Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Node-P0LConnect to me as my web client.

Screen SenderPrivate network-2L Private network-2R

Private network-1

Root Node System

New Web Client

Private IP:PA2L0

Private IP: PA2R0

Node-L Node-R

Private IP: PA0

Private network-0

Node-P0L

Connect as a web client

4. 管理機能

• Web GUI• Node System の追加と削除• Node System の接続状況の把握• 接続クライアントの把握• 変化の把握

– Node system 数– クライアント数– Fps, バンド幅

7. 関連研究

• SOLAR-CATS … Web Client ではない• 拡張 Edutab … 負荷分散はない• AKAMAI … 限られた IP範囲内の、せいのでドーン

には向かない• FCAN … 特殊な DNS を利用• Ustream Live Producer … 遅延が大きい– Web RTC … DWSS に使えるかも

7. おわりに

• CDN4DWSS– 大量のクライアント間の画面共有–異なるプライベートネットワークにあるクライアント間の

画面共有 … 遠隔地間の画面共有– 適切なサーバの自動選択

• 今後–モデルと現実の違いの対策– 上田らの研究成果の利用–セキュリティ