Cisco Webex Room Kit Sandbox で開発する

Cisco Webex Room Kit には HTTP や SSH でアクセス可能な xAPI 、タッチパネルで UI をカスタマイズ可能な In Room Control など開発者向けの機能があります。
ただ、その環境を得るには実機が必要でした。 [Cisco DevNet](https://developer.cisco.com/)  では、そういったシスコ機器開発環境あるあるを解決するため、[Cisco DevNet Sandbox](https://developer.cisco.com/docs/sandbox/) を提供しています。今回は、Sandbox 上での　Cisco Webex Room Kit の環境予約方法と開発環境利用を解説します。

## Cisco DevNet へのログイン

developer.cisco.com にアクセスします。
<img width="1211" alt="スクリーンショット 2019-02-16 22.10.29.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/bbfd394e-037f-0c4c-0f3a-ffd8f3fc878c.png">

SIGN UP Free からアカウントを作成することができます。 Cisco.com のアカウトである必要はなく、GitHub、Facebook などから Oauth を使ってプロファイルを作成することもできます。

<img width="326" alt="スクリーンショット 2019-02-16 22.10.38.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/6001ad9e-3926-814e-4a97-0611256b0d68.png">


## Cisco DevNet Sandbox の選択

ログイン後、Discover から Code > Sandbox Remote Labs を選択します。
<img width="1155" alt="スクリーンショット 2019-02-16 22.11.10.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/c9721c0b-3123-d416-9600-2db98331dde4.png">

Collaboration を選択します。
<img width="1162" alt="スクリーンショット 2019-02-16 22.11.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/db5ed66d-bf70-ee4b-aa7d-cd921c4071c7.png">

All Collaboration Sandboxes から here をクリックします。
<img width="1441" alt="スクリーンショット 2019-02-16 22.14.31.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/06257a87-6dc0-52dc-ed64-1f727e563055.png">

リストの中から Room Kit を探します。 ファームウェアのバージョンにより CE9.3 と CE9.6 があります。ここでは最新の CE9.6 を選択します。
<img width="1318" alt="スクリーンショット 2019-02-16 22.15.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/f21a881f-f4dc-bb3a-82e5-2945e0f47f77.png">

予約する時間をスケジュールします。
<img width="703" alt="スクリーンショット 2019-02-16 22.15.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/8573efec-6a5d-96ae-74bb-3fec4599e53b.png">

最大1週間予約可能です。

<img width="700" alt="スクリーンショット 2019-02-16 22.16.13.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/627e21f1-8ee4-af10-6cef-e9d65666b8d3.png">


開発環境のトポロジーが表示されます。5分から10分ほど起動に時間がかかります。
<img width="1446" alt="スクリーンショット 2019-02-16 22.16.50.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/f63884e0-46a2-7f72-82f3-daf47f80a1e1.png">

## Cisco DevNet Sandbox Room Kit AnyConnect VPN アクセス

起動が完了すると AnyConnect を使った VPN 情報がメールで送信されます。AnyConnect がインストールされていない場合、 VPN タブのインストラクションに従ってインストールします。
<img width="1433" alt="スクリーンショット 2019-02-16 22.18.02.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/c0fc02ff-0400-7974-2166-96bbe9f2adb6.png">

Your Cisco DevNet Sandbox Lab is Ready というタイトルのメールが送られてくるので、Lab Network Address,Username,Password を Cisco AnyConnect に入力し、VPN アクセスします。

<img width="423" alt="スクリーンショット 2019-02-16 22.36.46.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/c5316421-a9f3-aed0-82e9-047f1222d007.png">
<img width="464" alt="スクリーンショット 2019-02-16 22.37.00.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/92656899-ad23-cca5-115e-06f41b2a815d.png">

## Cisco Webex Room Kit へのアクセス

Topology から Room Kit と Node.js 用 Ubuntsu のアクセス情報が アイコンをクリックし、Attribute を選択することで確認可能です。

<img width="884" alt="スクリーンショット 2019-02-16 22.40.20.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/ed5a2524-dedf-5151-1b05-d5a2fe40cf34.png">

<img width="893" alt="スクリーンショット 2019-02-16 22.40.43.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/e1c08a80-afe1-539e-2676-d53fbaf57951.png">

More Options から HTTPS を選ぶことで Room Kit の Web 画面に入ることができます。信頼できない証明書を受け入れます。
<img width="898" alt="スクリーンショット 2019-02-16 22.42.40.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/db5e4b14-8377-3e9c-7a6e-de71492eb7d0.png">

少し時間が経った後にログイン画面が出るので Attribute に記載の Username/password でログインします。
<img width="369" alt="スクリーンショット 2019-02-16 22.45.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/23f662e8-a436-50ed-2942-ceecd94c4638.png">

Integration > Macro Editor でマクロ開発環境を得ることができます。

<img width="723" alt="スクリーンショット 2019-02-16 22.48.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/f8c80a98-9333-61c4-c552-7a66e802635f.png">

Integration > In Room Control でIn Room Control 開発環境を得ることができます。
<img width="1440" alt="スクリーンショット 2019-02-16 22.55.10.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/95622346-55a4-9601-9637-afb17683024c.png">

コントローラであるTouch 10 への In Room Control 機能を表示することができます。

<img width="1440" alt="スクリーンショット 2019-02-16 22.55.19.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/1329f56e-db2b-79bf-cea5-a27165633474.png">


DevNet Learning Lab の [Introduction to xAPI and Cisco CE Software Customization](https://learninglabs.cisco.com/lab/collab-xapi-intro/step/1) に従って進めるも良いですし、マクロや端末単体の機能を色々試すこともできます。環境にある Node.js の他、手元のPC から命令を送ることもできます。

<img width="1089" alt="スクリーンショット 2019-02-16 23.01.57.png" src="https://qiita-image-store.s3.amazonaws.com/0/216119/74489913-d000-00aa-6fbf-6bb4ac2d19b8.png">


VPN を経由している分、 Web 管理画面の反応は実機よりもだいぶ遅くなる傾向がありますが、それ以外のアクセスは問題なさそうです。実機を手元に持っていない場合は活用価値ありそうですね。