IOS 12.2 deviceorientation

提供: ディーズガレージ wiki
移動先: 案内検索

iOS 12.2のsafariでは、デフォルトでセンサー値取得が不可になったようです。
センサーを使用する全てのWebVR・WebARに影響が出ているものと思われます。
センサーが使用可能な状態なのか判別方法を探ってみます。
参考にする場合、test01とtest02は不完全なスクリプトです。

環境

iPhone XS

発火する条件を見たいので 設定 > safari >「モーションと画面の向きのアクセス」をON/OFF切り替えて確認

test01 > three.js

three.js/examples/js/controls at dev · mrdoob/three.js · GitHub
最初にthree.jsの状況を確認してみる
three.js r106を使用
three.jsのDeviceOrientationControls.jsのソースコードを見ると
this.disconnect = function ()とあるので
発火しているのか確認してみる

ソース

test01.html
DeviceOrientationControls.js

DeviceOrientationControls.js 追記

    this.disconnect = function () {
        alert('disconnect!');

確認

センサーON/OFF両方で発火しない
一年以上更新されていないので無理もない

test02 > Google

端末画面の向きと端末のモーション | Web | Google Developers
test01でthree.jsに期待できないので、test02では基本的なセンサースクリプトを組んでみる

ソース

test02.html

確認

DeviceOrientationEvent センサーON/OFF両方で発火する
addEventListener("deviceorientation") センサーOFFで動かない/ONで発火する
alpha beta gamma センサーOFFで何も返さない/ONで返す
DeviceOrientationEvent
 センサーの有効/無効を判断する部分で正常に判断していない 常に発火する
 なんだこれ? 大問題! Appleさん聞いてますか~!
addEventListener("deviceorientation")
alpha beta gamma
 正常な動きに見える
 しかしこれはイベントリスナーなのでセンサーの有効/無効を判断する部分ではない

test03 > iOSハック

test02でiOS 12.2の挙動が見えた感じがする
test03では以下項目を考慮してみる
* センサー有効/無効の判断対象をiOS 12.2以上に分岐 UAParser.js GPLv2 or MIT License
* DeviceOrientationEventで判断しない 削除
* iOS 12.2以上の条件でaddEventListener("deviceorientation")を起動させておく 動かなくても構わない
* alpha,beta,gammaに初期値0を与え、setTimeout後の様子で判断

ソース

test03.html

確認

期待する動き
しかしとにかくsetTimeoutで判断するのが気持ち悪い
ソースでは300ミリ秒後の判断 重いコンテンツになると数値を増やすか、スクリプトの配置位置に注意する必要もありそう
またはトップページとか設置してセンサー有効/無効の判断だけしてセンサーコンテンツスタートボタンで切り替えるとか

test04 > ライブラリ化

test03の対処しか思いつかないので
test04ではtest03をライブラリ化

ソース

test04.html
iOSdeviceorientationCheck.js

設置

<script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
<script src="iOSdeviceorientationCheck.js"></script>

確認

期待する動き

動作確認

スマホdeVR deviceorientation devicemotion
宇宙マイクロ波背景放射VR universal deviceorientation geolocation
スマホDEバーチャルモデル universal deviceorientation devicemotion
shake! universal deviceorientation devicemotion
SpaceColony universal deviceorientation

追加 動作確認

センサーアプリケーションはhttps接続必須になった覚えがある
確認してみる

http接続 多分すべて失敗する
test03 http://dz.plala.jp/deviceorientation/test03.html
test04 http://dz.plala.jp/deviceorientation/test04.html
スマホdeVR http://dz.plala.jp/svr/
宇宙マイクロ波背景放射VR http://dz.plala.jp/cmb/
スマホDEバーチャルモデル http://dz.plala.jp/virtualmodel/
shake! http://dz.plala.jp/shake/
SpaceColony http://dz.plala.jp/colony/
センサーONでアラートが発火する動作がおかしい > ソースでは真になってしまう > 正しい動作
httpでdeviceorientationHandleが機能しないことで、alpha + beta + gamma は初期値0
iOS12.2以上でsetTimeout後alpha + beta + gamma == 0 が真になってしまいアラート発火
httpとhttps両方が許可されているセンサーアプリケーションであればhttpsにリダイレクトなど対処が必要
https接続 多分すべて成功する
test03 https://dz.plala.jp/deviceorientation/test03.html
test04 https://dz.plala.jp/deviceorientation/test04.html
スマホdeVR https://dz.plala.jp/svr/
宇宙マイクロ波背景放射VR https://dz.plala.jp/cmb/
スマホDEバーチャルモデル https://dz.plala.jp/virtualmodel/
shake! https://dz.plala.jp/shake/
SpaceColony https://dz.plala.jp/colony/

更新履歴

  • 2019.6.27 test03 バージョンチェック修正 全体の文面見直し
  • 2019.6.14 test04 バージョンチェック修正
  • 2019.4.11 公開