sandbox

Scala, Android, Architecture, Management, Service Design あたりを主戦場としております

PhoneGap で deviceready イベントが発行されない問題への対処

phonegap tips

2011/11/15 追記: きっともう Obsolete


公式にあるサンプルでも deviceready が発行されないケースがあったので、対処方法をメモ。

公式にあるサンプルは下記の通り。

<!DOCTYPE html>
<html>
  <head>
    <title>PhoneGap Device Ready Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
    <script type="text/javascript" charset="utf-8">
    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {
        alert('なぜか呼ばれない');
    }
    </script>
  </head>
  <body>
  </body>
</html>


しかし、なぜか onDeviceReady が呼ばれない事がある。


結論から言うと、これは document.addEventListener が評価される時に、既に PhoneGap の初期化が完了しており、deviceready イベントが発行済みとなってしまっていた場合に起こる。
つまり、過去のイベントに対して addEvent してしまっている状況なので、当然といえば当然。


この問題には、下記の様に PhoneGap が初期化しているかどうかを判定する条件文を入れる事で対処できる。

<!DOCTYPE html>
<html>
  <head>
    <title>PhoneGap Device Ready Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
    <script type="text/javascript" charset="utf-8">
    if(typeof device === 'undefined'){
        document.addEventListener("deviceready", onDeviceReady, false);
    }else{
        onDeviceReady();
    }

    function onDeviceReady() {
        alert('これは常に呼ばれるし、ちゃんと deviceready な状態');
    }
    </script>
  </head>
  <body>
  </body>
</html>