An introduction to the Network Service Discovery API (in Japanese)

1. 「Network Service Discovery API ができました！」
と言われた時
Daniel Davis (@ourmaninjapan)
Opera Software
bit.ly/nsd-api

2. ある日…

3. 「Network Service Discovery API ができました！」
と言われた。

4. 「だからなに？」
と思った。

5. 「その API をサポートするビルドができました！」
と言われた。

6. 「だからなに？」
と思った。

7. 「このビルドで UPnP が使えます！」
と言われた。

8. 「自分で調べるしかない」
と思った。

9. 調べた結果…

10. UPnP とは
ネットワーク内にあるデバイスとの
コミュニケーション方法
http://www.flickr.com/photos/mogwai_83/4383552060/

11. UPnP デバイスの種類はいくつかある
↓
各デバイスは一つ以上のサービスがある
↓
各サービスはいくつかのアクションがある
↓
各アクションはいくつかのパラメータがある
http://www.flickr.com/photos/mogwai_83/4383552060/

12. 例えば、マルチメディア（AV）の場合…

13. 「AV」デバイスのサービスの一つは
「RenderingControl」である
↓
「RenderingControl」のアクションの一つは
「GetVolume」である
↓
「GetVolume」のパラメータの一つは
「Channel」である

14. 「それだけ？」
と思った

15. No

16. UPnP マルチメディアデバイスは四つに分けられる：
● Server （気前が良い）
● Player （人見知り）
● Renderer （子分）
● Controller （ボス）

17. その中、リモートで見つけられるサービス
● Server のサービス：
● ContentDirectory
● ConnectionManager
● Renderer のサービス：
● AVTransport （メディアがコントロールできる）
● RenderingControl （デバイスがコントロールできる）
● ConnectionManager

18. 「だからなに？」
と思った。

19. [demo time]

20. こんな流れ：
1. ネットワーク内のサービスを検索する
2. それぞれのサービスのURLを取得する
3. サービスのURLへメッセージを送信する
4. サービスから返事を受信する

21. 1. ネットワーク内のサービスを検索する
function showServices( services ) {
// 「services」がサービスの配列
}
function error( e ) {
console.log( "Error occurred: " + e.code );
}
navigator.getNetworkServices(
'upnp:urn:schemas-upnp-
org:service:ContentDirectory:1',
showServices,
error
);

22. 2. それぞれのサービスのURLを取得する
for(var i = 0, l = services.length; i < l; i++) {
var service = services[i];
var url = service.url;
// 他にも「config」、「type」などの属性がある
}

23. 3. サービスのURLへメッセージを送信する
<?xml version="1.0" encoding="utf-8"?>
<s:Envelope
s:encodingStyle="http://schemas.xmlsoap.org/soap
/encoding/"
xmlns:s="http://schemas.xmlsoap.org/soap/envelop
e/">
<s:Body>
<u:GetVolume xmlns:u="urn:schemas-upnp-
org:service:RenderingControl:1">
<InstanceID>0</InstanceID>
<Channel>Master</Channel>
</u:GetVolume>
</s:Body>
</s:Envelope>

24. 4. サービスから返事を受信する
<?xml version="1.0" ?>
<s:Envelope
xmlns:s="http://schemas.xmlsoap.org/soap/envelop
e/"
s:EncodingStyle="http://schemas.xmlsoap.org/soap
/encoding/">
<s:Body>
<r:GetVolumeResponse
xmlns:r="urn:schemas-upnp-
org:service:RenderingControl:1"><CurrentVolume>0
</CurrentVolume>
</r:GetVolumeResponse>
</s:Body>
</s:Envelope>

25. [demo time]

26. 「なかなかいいじゃん。
何か作ってみよう！」
と思ったら…

27. 問題

28. ● あるデバイスが提供しているサービスが分からない
● あるサービスに使えるアクションが分からない
● あるメディアファイルが再生できるか分からない

29. 「なにこれ？」
と思った。

30. でも大丈夫。こんな資料がある：
www.dlna.org/consumer-home/look-for-
dlna/product-search
www.upnp-database.info

31. つまり…

32. 家のデバイスをウェブページから
コントロールできると分かった時

33. 「楽しい！」
と思った。

34. 資料：
dev.opera.com/articles/view/network-service-
discovery-api-support-in-opera/
richtr.github.com/plug.play.js/

35. 「Network Service Discovery API ができました！」
と言われた時
Daniel Davis (@ourmaninjapan)
Opera Software
bit.ly/nsd-api