Embed Size (px)
Citation preview
“Hello, Real-World” Physical Web開発 ハンズーオン
株式会社リクルートテクノロジーズ アドバンスドテクノロジーラボ
加藤 亮
Web先端技術味見部#28
1. UriBeaconからデータを拾ってみよう
UriBeacon• 今回はUriBeaconを用意しました
• 配置しておくのでここからURIを拾ってみます
• 興味のある人はConfigで値を変えてみてください
• https://itunes.apple.com/us/app/physical-web/id927653608?mt=8 (公式アプリ)
UriBeacon• 自分で用意する場合
• https://github.com/google/uribeacon/tree/master/beacons (iOSはNG, Androidは5以降でデバイスが対応してるものなら)
• 購入する場合(技適マーク注意)
• https://www.blesh.com/product/blesh-pack-3-beacons/
URIBeacon
• BLEのアドバタイズパケットだけを使うという点でiBeaconとほぼ同じ性能要件
• ただし投げるパケットのデータはiBeaconとは別物
Bluetooth LE (YAPC::Asia2014使い回し資料)
Bluetooth Classic
• 旧来のよく知られているBluetooth
• LEとの差別化のためにClassicと呼ばれる
• 2000年くらいから流行
• ユビキタスネットワーク -> 最近でいうところのIoT
• 高速化を追求
• 他の無線技術とあまり差別化できなくなってきていた
Bluetooth Low Energy (BTLE)
• LE = Low Energy (省エネ)
• Bluetooth 4.0から
• それまで(Bluetooth Classic)は高速化を追求
• 別物と考えるくらいで
• 4.0=LEではなく、4.0の中にLEの他にHS(HightSpeed)なども
Paring• 旧来のBluetoothでは基本的にデバイスのペアリング必要。2.1以上ではSecure Simple Paring
• Just Works
• Out of Band (NFCとか)
• Passkey Entry
• Numeric Comparison
• iBeaconなどに見られるようにLEではペアリングの無いユースケースがほとんど
• LEも似たようなモデルがあり、PassKeyEntryも一応存在するし、逆に、上に上げたように、ClassicにもJust Worksがあり、確認なしで使える仕様も存在はする。
• とはいえ、LE用のSDK/チップではJust Worksしか採用されてなかったりする
Bluetoothのネットワークトポロジピコネット
ClassicではMaster/Slaveという言い方をして、 Central/Peripheralとは言わない
Central
Peripheral
例: PC
例: キーボード マウス
Peripheral
例: 室温系
Peripheral
例: 体重系
ペリフェラルがサービスの主体になるデータを提供するケース (ペリフェラルがサーバー、セントラルがクライアント)
が多い
複数のデバイスとやりとりする中心になるのがセントラル
ペリフェラルにデータをWriteするケースもある サーモスタットの温度とか(設定系)
Bluetoothのネットワークトポロジスキャタネット
MasterSlave
例: PC
例: キーボード マウス
Slave
例: 室温系
Slave
例: 体重系Master
例: ヘッドホン
Slave
ヘッドホンなどは主体となるデータ(音声データ)の置き場はPC側になり、データの流れが逆になる
Masterは同時にSlaveとなり、他のピコネットに参加することができる
ネットワークへの参加
• Classic: Service Discovery(今回は省略)
• LE: Advertising
Advertising Packet• サービスのUUID • LocalName • その他
ネットワークへの参加
Observer Broadcaster(Peripheral)(Central)
ペリフェラルは周期的にアドバタイジングパケットを発信 「こんなサービスを提供していますよ」という情報
Advertising Packet• サービスのUUID • LocalName • その他
ネットワークへの参加
Observer Broadcaster(Peripheral)(Central)
セントラルは周期的にスキャンを行い、 周囲からアドバタイジングパケットを探す。
Scan Request
ネットワークへの参加
Observer Broadcaster(Peripheral)(Central)
必要であれば、もう少し詳しい情報を相手に要求できる
Scan Response
ネットワークへの参加
Observer Broadcaster(Peripheral)(Central)
ペリフェラルは、Scan Requestを受け取った場合はScan Responseを返す。 アドバタイジングパケットに乗り切らない情報をここに載せることが出来る 最初のアドバタイジングパケットが大きすぎると省エネ的にも良くない。
Advertising Packet• サービスのUUID • LocalName • その他
接続要求
ネットワークへの参加
Central Peripheral
セントラルは受け取った情報から UUIDなどを見て、つなぎたいサービスかどうか判断。
サービスを受けたい場合は接続要求を ペリフェラルに投げて接続を開始
接続が完了するとBroadcaster/Observerとしての役目は終わり、 Peripheral/Centralとなる
ポーリング
CentralとPeripheralのやりとり
Central Peripheral
接続が完了するとセントラルは定期的に、空パケットで ポーリングを行い接続を維持する。要はPing。
必要だったらポーリングのレスポンスにデータを載せたり。
CentralとPeripheralのやりとり
Central Peripheral
周波数チャンネル
混線によるノイズを避けるために 周波数ホッピングを行い、 チャンネルを切り替えながら通信する
ClassicでもLEでも周波数ホッピングは あるが、LEではホッピングの回数が 少なくなるよう工夫されている。
CentralとPeripheralのやりとり
Central Peripheral
前述のような接続維持を行いつつ、 セントラルは、接続先のペリフェラルが提供しているサービスを利用できる
サービス
Profile
Host
Controller
Profiles (Application)
HCI - Host Controller Interface
物理層
あらかじめ用意された アプリケーション仕様(Profile)
ヘッドセット、キーボードなどの入力、オーディオなど Bluetoothでの利用されるような機能は Profile仕様が最初から用意されている
• HSP(HeadSetProfile) • HIDP(HumanInterfaceDeviceProfile) • …
Profile
Host
あらかじめ用意されたものでなくて、自由にサービスを設計したいときは？
Classicの場合はSPP(Serial Port Profile)
LEの場合はGATT(General Attribute Profile)
GATT
Central
Peripheral
サービス
Peripheralが提供するサービスとはどんなもの？
室温計の例
現在の室温: 28度
READ
センサーから取得できる変動値サービスが提供する値を 読み取ることができる
GATT
Central
Peripheral
サービス
Peripheralが提供するサービスとはどんなもの？
サーモスタットの例
設定温度: 28度
WRITE
機械の内部のconfig値
スイッチ: offコントロールポイント
一つのサービスは 複数の値をもてる
サービスが提供する値に 書き込むことができる
GATT
Peripheral
サービス
設定温度: 28度機械の内部のconfig値
スイッチ: offコントロールポイント
characteristic
characteristic
Centralから読み書きさせることが出来る これらの値のことをcharacteristicと呼ぶ
一つのサービスは複数のcharacteristicを持てる
読み書き以外に、値が変化したときの通知依頼も
GATT
Peripheral
サービス
設定温度: 28度機械の内部のconfig値
スイッチ: offコントロールポイント
一つのPeripheralは複数のサービスを持つことが出来る
サービス
現在の室温: 28度センサーから取得できる変動値
Bluetooth LEのサービス利用手順まとめ
• Peripheralとして振る舞うデバイスがアドバタイズ
• Centralとして振る舞うデバイスがスキャンしてアドバタイジングパケットを発見
• CentralやPeripheralに接続して、目的のサービスを検索
• サービスの中から目的のCharacteristicを発見し、読み書き等
iOS/Androidでのsupport状況
• iOSは5.0からBTLEがSDK(CoreBluetooth)に、まずはセントラルのみ。6以降でペリフェラルとしても動作可能。なのでほぼ普及済と考えられる。
• Androidは4.3からBTLE(セントラル)搭載。Preview Lからペリフェラルとしても動作可能。Preview Lからはle用にパッケージが別になったので、4.3のときに使えたセントラル用のAPIも刷新されてる。
iOS/AndroidでのBluetooth Classic
• LEサポート前からClassicのほうは利用できた
• LEのようにGATTがないので、既存のプロファイルにない自由なサービスを使おうとするとSPP(serial port profile)を使う必要がある
• iOSではAppleからMFi (Made for iPhone)を取得する必要
iOS/Androidでのsupport状況
iOSではLEが簡単でClassic&SPPがMFiのため面倒 AndroidではSPPは簡単、LEは普及に時間かかりそう
iOSとAndroidで通信したい場合は悩ましい
iBeacon
• CoreLocation
• 屋内位置情報
• Ranging/Monitoring
位置情報サービス
GPS
iBeacon
比較的大きな領域での位置や移動 地図と組み合わせたサービス屋内での細かい位置情報や短距離移動
などに基づくサービス
iBeacon
Advertising Packet• サービスのUUID • LocalName • その他
Broadcaster(Peripheral)Broadcasterとしてのみ
振る舞うBTLEデバイス
パケットの送信距離が10m程度なのを利用して データ転送よりも近接検知に利用
用語の注意
• iBeaconが近接検知技術と言われるが
• NFCなどのスマートカード界隈では近接(proximity)は10cm以内、70cm以内だと近傍(vicinity)とか
iBeaconの近接 = BTLEのパケット送信可能距離
ICカードの近接 = カード/リーダで電磁誘導が発生する距離
iBeacon
Advertising Packet
ビーコン
Advertising Packet
電波が届く距離までビーコンに近寄ったことがわかる 電波強度(RSSI)からアバウトに距離の推測 ノイズの問題もあり正確には分からない。ビーコンの方位もわからない。
iBeacon
ビーコン
Advertising Packet
ビーコンが飛ばすパケットにはUUIDと二つの16bit整数値(major/minor)がある
UUIDを指定して監視しておいて、対応するアプリでアクションを実行したり、 PassKitでクーポンを表示したり。
UUIDmajor/minor
iBeacon
ビーコンA
二つの数値を利用して、どのビーコンに近接したかの判断
施設内での移動の検知
ビーコンB
Advertising Packet
UUIDmajor: 1 minor: 1
Advertising Packet
UUIDmajor: 1 minor: 2
iBeaconでのBTLEまとめ
• Bluetooth LE の Broadcasterである
• Peripheral/Central間で接続確立&データ転送はしない
• Advertising Packetの中に収まるデータしか使えない
•major/minorという16bit整数値二つ入れる
Bluetooth LEの利用の仕方自体はものすごくシンプル
UriBeacon
• iBeaconと同じようにBLEのアドバタイズのみ使う
•パケットデザインを工夫して、URIを詰め込めるように
Hands-on
実装してみる
• https://github.com/google/uribeacon/tree/master/ios-uribeacon
• ライブラリ使えば超簡単!
UBUriBeaconScanner
UBUriBeacon
Swiftでも そのまま直訳するだけ
実装• UBUriBeaconのヘッダを見て他の値を調べてみましょう
• Viewにボタンを置いて、スキャンの開始、停止をできるようにしてみましょう
• 拾ったURLをViewに表示してみましょう
Android• https://github.com/google/uribeacon/blob/master/android-uribeacon/uribeacon-sample/src/main/java/org/uribeacon/sample/UriBeaconScanActivity.java
• https://github.com/google/physical-web/blob/master/android/PhysicalWeb/app/src/main/java/org/physical_web/physicalweb/UriBeaconDiscoveryService.java
UriBeaconリポジトリのサンプル
Physical Webリポジトリの公式アプリコード (Serviceなどちゃんと使ってるのでしっかり作るならこっちを参考に)
BLEのAPI自体はOSのものをそのまま使い、パケットのパースなどはライブラリを使う
2. Resolverを使って Metadataを取得してみよう
一般的には URLは短縮サービスのもの
• 短縮サービスだった場合に元のURLを取得する必要がある
URLのような機械のためのものではなく ユーザーが見てわかりやすいデータに
OGPの例 (PhyWebではOGP以外のデータも利用)
title, thumbnail, descriptionなど
APIを自分で用意するには?
• https://github.com/google/physical-web/tree/master/web-service
• handlers.pyのResolveScanが主役
公式にpythonで書かれたサンプルがあります
Request例 JSONをPOST
(注: 最新ではRSSI, txPowerも受け取るようになるなど アップデートがあります)
Response例
(注: 最新ではdisplayUrl, distanceを渡すようになるなど アップデートがあります)
今回はAPIを用意してあるので それを叩いてみましょう
http://atl-phyweb.net/resolve-scan
前ページで注釈したように 少し古いバージョンになっています
やってることは• JSONのencode/decode
• 圧縮URLの展開
• 目的のURLをHTTP GETして取得したHTMLをパースしてデータを取得
• キャッシュ
そこまで大したことはしてないので自作も難しくはない
このAPIを叩いて 1. ログに流してみましょう 2. 画面に表示してみましょう
WebAPI叩くだけなので好きなように 今回はAFNetworkingを使ってます
実装例
Swiftでも 直訳するだけ
さらに
• UITableViewでリストとして表示してみましょう
• タップするとopenURLでブラウザ上で開くとか、あるいはWebViewで開くようにしてみましょう
• 同じURLに対して毎回解決しないようにキャッシュ機構を用意してみましょう
おわりに
• どんなところにフックを仕掛けると面白いか
• どんなURIと連動すると面白いか
是非考えてみてください
