もろもろ調べつつ、アプリを作成して動作を試したメモです。

テスト手順

 手順は権限を必要としないアプリならばすぐにテストできます。
  • Firefox OSのシミュレータをインストール
  • アプリを作る
  • アイコンの準備、manifest.webappを記述
  • Firefox OS SimulatorのDashboardからアプリを登録
  • Firefox OS Simulatorで確認
 最初はアプリテンプレートを使って作っていった方が良いかもしれませんが、今回は前に作っていたアプリを修正し、ついでにjQuery Mobile 1.4.0-alpha.2を導入したアプリを使いました。ほんとにWebアプリがアプリとしてそのまま動きます。
 動作中の様子です。アイコンも設定されています。
firefox os checktnred firefox os checktnred 2
 アプリはWebアプリがそのまま動作しました。しかしFirefox OSには物理キーとして戻るボタンはないので、アプリからブラウザに飛ばした後の戻る方法はありません。今回試したアプリの場合は、アプリ内ブラウザを実装する必要がありそうです。Browser APIとはつまりiframeの事ですが、使うにはpermissionが必要です。なおiframeでの動作イメージはこうなります。
firefox os checktrend3

アプリの権限と種類

 アプリには、様々な種類があり、その内容はここここにまとまっています。
 まず「ホスト型アプリ(Open Web Apps)」とは、リソースが全てWeb上にある、Webアプリのような形態です。しかし特別なAPIは使えません。
 一方「パッケージ型アプリ」とは、リソースをzipに固めたアプリで、以下の種類があります。
  • 特権アプリ
    • Firefox Marketplaceでのレビューを受けたアプリ。特定のAPIを使用することができる。
  • 認定アプリ
    • 重要な機能を使えるアプリ。サードパーティー製アプリ向けではないので、普通のアプリ開発者は、基本的にこの権限について考える必要はない。
  • 単純なパッケージ型アプリ
    • 単にzipにまとめられたファイルで、特別なAPIは使えないが認証も必要ない。
 さて、今回のようにAPIを使いたい場合はこれらの種類の中から特権アプリを作ります。
 なお今回はBrowser APIのページにサンプルコードがあるので、それの通りにやってパッケージ型アプリとしてシミュレータにインストールしようとしたのですがダメでした。どうにもダウンロードさせることができなかったので、この点はまた今度に。

アプリの配布

 作成したアプリの配布方法は、アプリの種類によって3通りあります。
  • ホスト型アプリを自分のサイトで公開
    • リソースがすべてWeb上にあれば良いので、適当なサーバーで公開できます。ブラウザでアクセスするだけで動作するタイプです。しかしマニフェストファイルには適切なMINEタイプが必要です。たとえばGithub Pagesなら適切に処理してくれるそうです。マニフェストファイルについてはドキュメントを見ましょう。
  • パッケージ型アプリをFirefox Marketplaceで公開
  • パッケージ型アプリを自分のサイトで公開
    • ブラウザからアプリをインストールさせることができます。インストールボタンの表示方法を確認しましょう。なお、ホスト型アプリではインストールさせるにはnavigator.mozApps.install(manifest_url)でしたが、パッケージ型アプリではnavigator.mozApps.installPackage(manifest_url)です。マニフェストファイルにもpackage_pathの項目が必要です。(なお、installPackageはデスクトップのFirefoxでは無効になっているが、Firefox OSかAndroidでは有効になっているそうです。ここに書いてある
 これらの配布方法から適切なものを選んでください。組み合わせたパターンとして、ホスト型アプリを公開しつつ、インストールボタンを表示してパッケージ型アプリの選択肢も表示する、という方法もあるようです。
 補足として気を付ける点としては、マニフェストに書くパスは、launch_pathもiconsも絶対パス (例えば /images/myicon.png) である必要があることがあげられます。検証の方法も用意されているので、確認しつつテストを行います。検証結果はこのように表示されます

配布例

 今回はgithub pagesを使う方法を採用しました。なおこの方法の場合、gh-pagesブランチにサイトとして公開したいファイルをcommitするだけで公開できますが、pushした後に反映までしばらく時間がかかるので注意が必要です。
 このようになりました。Firefox OSシミュレータからアクセスすればアプリとしてインストール可能です。またデスクトップのFirefoxでもインストールできます。
 http://tattyamm.github.io/checktrend/install.html

今後

 今回やってない事リスト。
Building BlocksというFirefox OS向けのUIデザイン
・実機の機能を使ったアプリ
・ブラウザAPIを使ったアプリの配布
・navigator.mozApps.installPackageを使ったインストール方法
Firefox Marketplace へのアプリの登録
など。

リンク

最初に読むと良さそうな資料
Open Web Apps を始めよう - なぜ、そしてどのように | Mozilla Developer Street (modest)
アプリ開発を始めよう - Apps | MDN
Firefox os hackathon
大津谷亮祐ブログ - Firefox OS の Packaged Apps を作ってみた

パッケージ型アプリについて
パッケージ型アプリ - Apps | MDN

マニフェストの書き方や権限について
アプリマニフェスト - Apps | MDN
アプリの許可設定 - Apps | MDN

HTTP リクエストやsame-origin policyについて
HTTP access control (CORS) | MDN

ブラウザAPIの詳細とサンプルコード
Using the browser API - WebAPI | MDN
gaia/apps/browser at master ・ mozilla-b2g/gaia

ハードウェアボタンについて
Firefox OS 概論 - Mozilla | MDN

アプリの公開方法
アプリの公開 - Apps | MDN
Firefox Marketplace へのアプリの登録 - Apps | MDN
bitWalk's workshop - はじめてのアプリ