web-dev-qa-db-ja.com

電話画面がオフのときにHTML5モバイルアプリが実行されていますか？

電話画面がオフのときでも動作するHTML5の地理位置情報ベースのWebアプリを作成することに興味があります（たとえば、携帯電話がポケットに入れられているときに実行していた距離を追跡します）。

アプリを実行したまま画面をオフにしたり、他のアプリが使用されているときにアプリをバックグラウンドで実行したりする方法はありますか？これは、少なくとも一般的なモバイルデバイスの一部で可能ですか（新しいiOSおよびAndroidデバイス？））

javascriptandroidioshtmlgeolocation
34
tborenst

私の music app はHTML5であり、バックグラウンドで実行する必要もあります。そのサポートは、モバイルブラウザーによって異なります。

  • IOSのSafari：バックグラウンドで1曲または2曲を引き続き再生します
  • Androidのネイティブブラウザ：1つの曲を再生して停止します
  • Android上のFirefox：画面がロックされるか、ブラウザがフォーカスを失うか、曲が終了すると停止します
  • Androidのイルカ：バックグラウンドで再生！しかし最終的には停止します
  • Android上のOpera：バックグラウンドサポートが改善され、画面がオフの場合やOperaがバックグラウンドに送信された場合でもJavascriptは引き続き実行され、音楽は引き続き再生されますが、最終的には2曲後に停止します。

あなたが見ることができるように、それはヒットまたはミスです。誤って押してしまうまで、半分の時間で携帯をポケットに入れようとしたり、画面をオンにしたままにしたりすることになります。ユーザーがHTML5アプリをバックグラウンドで実行することをより詳細に制御できる日を待ち望んでいます。推測しなければならないのですが、それに対する普遍的なサポートは、それが牽引力を得たとしても、非常に遠いと言えます。 Appleはそれを承認することは決してないだろうが、私はネイティブアプリソリューションに向かわされています。当面の間、私は希望を持ち続け、最新のモバイルブラウザーをテストし続けます。それは実際に起こります、それは素晴らしいでしょう:-)

また、私の経験では、上記のほとんどすべての組み合わせについて、HTML5を使用してJavaScriptを同時に実行し、ネットワークデータをプルし、音楽を再生すると、通常はスマートフォンがオーブンになり、バッテリーがかなり早く停止することにも注意してください。うーん。

さらに、jQuery Mobile（ほとんどが素晴らしい）を使用している場合は、ブラウザーごとに異なるタッチ処理が表示されます。たとえば、Firefoxのタッチはうまく機能しますが、Dolphinはひどいものであり、正確にタッチアンドホールドアンドリリースする必要があります。それは直接HTML5のせいではありませんが、私が扱っている別の問題です。

ここに、モバイルHTML5に関する別の開発者の 興味深い考え があります。

更新：私は（2013年5月22日）Samsung Galaxy S3にOpera=）をダウンロードしただけで、これまでのところ最高のHTML5サポートを備えています。私のアプリでは、バックグラウンドでjavascriptを実行し続けます。画面がオフになっている、またはOperaがバックグラウンドにプッシュされている、少なくとも2曲以上。

24
moodboom

Service Workersを使用できます。

https://developers.google.com/web/fundamentals/primers/service-workers/

Service Workerは、ブラウザーがWebページとは別にバックグラウンドで実行するスクリプトであり、Webページやユーザーの操作を必要としない機能への扉を開きます。現在、プッシュ通知やバックグラウンド同期などの機能がすでに含まれています。将来、Service Workerは定期的な同期やジオフェンシングなどの他のものをサポートする可能性があります。

正確には、アプリケーションは次のようにService Workerを登録できます。

if ('serviceWorker' in navigator) {
  window.addEventListener('load', function() {
    navigator.serviceWorker.register('/sw.js').then(function(registration) {
      // Registration was successful
      console.log('ServiceWorker registration successful with scope: ', registration.scope);
    }, function(err) {
      // registration failed :(
      console.log('ServiceWorker registration failed: ', err);
    });
  });
}

Service Workerの登録が成功すると、sw.jsに実装されているすべてのアプリケーションロジックがバックグラウンドで実行されます。アプリケーションタブが無効になっていても。

4
Omer Gurarslan