IOS 13 deviceorientation

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

再検討 2022年7月更新
センサーデバイス認証
https://dz.plala.jp/permit/

Compass design.jpg  Qr20220704082524704.png
未着手
横画面の設定
video映像の環境マッピング

認証拒否した場合

スマホ Geolocation, Orientation, Motion, Video
iPhone・safari, chrome 再接続で再認証を確認, PWA再起動で再認証を確認
phpキャッシュバスター使用
iPad・safari, chrome
Android
PC Geolocation
Firefox IP Geolocationで対応
Chrome IP Geolocationで対応
Edge IP Geolocationで対応



この情報は古くなっています。

iOS 13でセンサー値取得方法が変更されました。
IOS 12.2 deviceorientationに追加する形で探ってみます。

必要な追加関数

function request_permission() {
    if (
        DeviceMotionEvent &&
        DeviceMotionEvent.requestPermission &&
        typeof DeviceMotionEvent.requestPermission === 'function'
    ) {
        DeviceMotionEvent.requestPermission();
    };
    if (
        DeviceOrientationEvent &&
        DeviceOrientationEvent.requestPermission &&
        typeof DeviceOrientationEvent.requestPermission === 'function'
    ) {
        DeviceOrientationEvent.requestPermission();
    };
};

実行可能なパターン

confirm

失敗する

            if (confirm("センサーを有効にします")) {
                request_permission();
            } else {
                alert("起動できません");
            };

失敗するがアラート表示しない

button

成功する

	<button onclick="request_permission()">センサーを有効にします</button>

べたなタッチイベントをAppleは要求してるように見える
都合いいことにセンサー値取得に失敗してる状態でも有効に切り替えできる

alertもどき

成功する

  • iOS13以上はalertもどきhtml要素を挿入 > 表示
  • センサーを有効にします > OK
  • OKボタンをタッチイベントにしてrequest_permission()を実行
  • ”動作と方向”へのアクセスを求めています > 許可
  • 一度有効にしたドメインは次回有効になってる
  • ↑iOS 12.2と同じsetTimeout後のセンサー値で判断

動作確認

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

まとめ

ライブラリ

https://dz.plala.jp/svr/iOSdeviceorientationCheck.js
https://dz.plala.jp/svr/iOSdeviceorientationCheck.css

設置

<link rel="stylesheet" href="https://dz.plala.jp/svr/iOSdeviceorientationCheck.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
<script src="https://dz.plala.jp/svr/iOSdeviceorientationCheck.js"></script>