Oculus GoのWebVR 開発を始めるまで

# はじめに

Oculus Goを入手してからWebVR開発を始める過程で、調べたことをまとめます。

# 前提

私はAndroid 開発はまともにしたことはありません。またWebVR(HTML/JavaScript)の開発を目的としていて自分のマシンのディスクの空き容量も少ないので、できればAndroidの開発環境(Android Studio)は導入せずに済ませたいと思い試行錯誤しました。

# Oculus GoをMACアドレス制限をかけたWiFiに繋げたい

## Oculus GoのMACアドレスを調べたい

私が普段使っているWiFiは、MACアドレスに制限をかけています。新しいガジェットを手に入れるたびにMACアドレスを調べて登録するところが一仕事です。Oculus Goの場合は次のステップが必要ということがわかりました。（[[OculusGo] Wi-FiのIPアドレスとMACアドレスを確認する](https://www.scriptlife.jp/contents/programming/2018/05/12/oculus-go-wifi/)より）

* (1) Oculus Goとペアリングしたスマートフォンのアプリで、「開発者モード」に設定する
* (2) Androidの開発ツールのadbコマンドを使ってMACアドレスを調べる

私の場合は、(1) の前提としてOculus GoをセットアップするにはWiFiにつなぐためにMACアドレスを調べる必要があり、(2)でMACアドレスを調べるためには開発者モードにしなければならない、という堂々巡りでいきなり詰んでしまいました。

...終了...

仕方なく、次の方法で対処しました。（というほど大げさな話ではないですが）

### (1) 別ネットワークでペアリング

* テザリングで一時的にWiFi環境を作り（こちらはMACアドレス制限なし）
* そこでセットアップを済ませて
* [Oculusのデベロッパーサイト](https://dashboard.oculus.com/)でデベロッパー登録（新しい団体を作成）を行い　
    * [[Oculus Go] 開発者モードに入る・adbで接続する](https://www.scriptlife.jp/contents/programming/2018/05/10/oculus-go-adb/)より
* スマートフォンアプリで開発モードに指定
    * ここで一旦、Oculus Goを再起動する必要があります

### (2-1) Android SDK Platform Tools をインストール
MACアドレスを調べるだけなら、Androidの開発環境であるAndroid Studioをまるまるインストールする必要はないことが分かりました。（[もっと簡単！adbコマンドを使えるようにする方法－ダウンロードして解凍してパスを通すだけでOK](https://www.orefolder.net/blog/2017/03/platform-tools/)より）

* [SDK Platform Tools](https://developer.android.com/studio/releases/platform-tools)からOSにあったツールをダウンロード
* 解凍して、パスを通しておく

この adb というツールはデバイスの中を覗くのにも便利なので、インストールしておくことをお薦めします。

### (2-2) adbでMACアドレスを調べる

以下、PCはWindows/Mac/Linux機を指します。

* PCにUSBで接続
    * Oculus Goの画面でPCを信頼するか聞かれるので、信頼する
* PCからOculus Goが認識されていることを確認
    * adb devices をPCのコマンドプロンプト/ターミナルで実行し、デバイス番号が見れることを確認

```
$ adb devices
List of devices attached
1xxxxxxxxxxxx    device

```

* MACアドレスを確認
    * PCのコマンドプロンプト/ターミナルで次のように adb shell を実行して確認

```
$ adb shell ip addr show wlan0
5: wlan0: <NO-CARRIER,BROADCAST,MULTICAST,UP> mtu 1500 qdisc mq state DOWN group default qlen 3000
    link/ether 2c:xx:xx:xx:xx:xx brd ff:ff:ff:ff:ff:ff
```

この 2c:xx:xx:xx:xx:xx がMACアドレスを使って、常用しているWiFi側で設定しました。


# Oculus Goにファイルをコピー

Windowsの場合は、USBでつなげば普通にファイルが見れるようです。エクスプローラーを使えば、ファイルをOculus Go側にコピーすることができます。

私はMac OS Xで利用しているのですが、Finderで見ることはできませんでした。そこで [Android File Transfer](https://www.android.com/filetransfer/)をインストールして使っています。

* 参考： [MacとAndroidをUSB接続してファイル転送・操作をする方法](http://japan.tokyork.net/gadget/mac/mac-android-file/)

Android File Transfer を起動するとフォルダーのツリーが表示されるので、Finderからそこにファイルをドラッグ＆ドロップすればOKです。

<img width="615" alt="oculus_file_transfer.png" src="https://qiita-image-store.s3.amazonaws.com/0/19403/0570b07b-5152-dfac-98f9-542f29221ad8.png">

* THETA Sなどで撮った360度写真 → Picturesフォルダーに
* THETA Sなどで撮った360度ビデオ → Moviesフォルダーに

Oculusのホーム画面からら[ギャラリー]-[内部ストレージ]でコピーしたファイルを見ることができます。フォルダを作って入れておけば、アルバムとして認識されるようです。

## adb で接続した場合

/sdcard/ の配下が、エクスプローラーやAndroid File Transferで見ることができる領域です。

* /sdcard/Pictures/ ... Picturesフォルダー
* /adcard/Movied/ ... Moviesフォルダー

に対応しています。



# ブラウザのリモートデバッグ

Oculus GoのブラウザはCromiumベースなので、PCのChromeからリモートデバッグができます。

* 開発者モードに設定したOculus GoをUSBでPCに接続
* PCのChromeで、chrome://inspect/#devices を開く

うまくいけば、次のようにOculus Goが認識されるはずです（この例ではPacific）

<img width="894" alt="chrome_inspect.png" src="https://qiita-image-store.s3.amazonaws.com/0/19403/72d0b7f3-13b4-8a84-fa87-c1b49a26563f.png">

ここで inspect リンクをクリックすると、別タブでOculus Goのブラウザの様子を見ることができます。（※ 2018.06現在のChrome 67では、Oculus側のタブの情報が正しく更新されないようです）

ちなみに、chrome://inspect/#devices では、Google HomeやChromecast のデバイスも検出できるようです。


# 画面のミラーリング

さきほどの方法ではブラウザの画面なら見ることができますが、それ以外のアプリやホーム画面の様子は見ることができません。そんな時はVysorというツールが使えるようです。

* [【Vysor】スマホの画面をPCにミラーリングする方法](http://kanntann.com/vysor)
* [ChromeウェブストアのVysorのページ](https://chrome.google.com/webstore/detail/vysor/gidgenkbbabolejbgbpnhbimgjbffefm?hl=ja)

<img width="798" alt="スクリーンショット 2018-06-09 21.28.52.png" src="https://qiita-image-store.s3.amazonaws.com/0/19403/ec5db34e-453d-64c9-a672-7cc54654e84a.png">


Vysorには Chrome 拡張機能版とアプリ版があります。どちらもフリー版と有料のPro版があり、フリー版では広告が定期的に表示されます。

# Oculus Go の画面が消えないようにする

Oculus Go はゴーグルの内側のこめかみに相当する場所にセンサーがあり、そこで装着中かどうかを判断しているようです。頭から外すとすぐにスリープしてしまいます。PCでミラーリングしている最中にはスリープして欲しくないので、センサー部分に不透明のシールやテープを貼るとスリープを抑止できます。

![oculus_tape.jpg](https://qiita-image-store.s3.amazonaws.com/0/19403/877793d8-d8a8-243b-de03-e72071bb1191.jpeg)



# 開発者モードにするとできないこと

Oculus Go を開発者モードにしていることで、制限もありますこれも最初は分からず苦労しました。

* ボタンでスクリーンショットが取れなくなる
* ペアリングしたスマートフォンのメディアが見れなくなる

スマートフォンのアプリで開発者モードを解除して、Oculus Goを再起動するとどちらも可能になります。

# おわりに

Androidアプリの開発経験がないため、私には分からないことだらけでした。同じようにWebアプリからOculus Go開発を始める人の参考になれば嬉しいです。