アプリマニフェスト

アプリマニフェストは、アプリに関する情報 (名称、作者、アイコン、説明など) を、ユーザとアプリストアの双方が利用できるシンプルなドキュメントとして提供します。最も重要なことは、アプリが必要とする Web API のリストが含まれるという点です。それにより、ユーザはアプリに関する十分な情報を得た上でそれをインストールすることが可能となります。これは、Open Web App を Web サイトと区別する重要なポイントのひとつと言えるでしょう。

: マニフェストを扱い Open Web App のインストールに対応するブラウザは Web ランタイム を統合しています。これには、Firefox OS と、Android 版 Firefoxデスクトップ版 Firefox の最近のバージョンが含まれます。

: アプリマニフェストに関する一般的な質問の答えは アプリマニフェスト FAQ で見つけられるでしょう。

アプリマニフェストの作成

本項では、アプリマニフェストの作成、使用にあたって知っておくべき重要な事柄について解説します。

規約: ファイル名、場所、形式

  • 名前: manifest.webapp (拡張子は必ず .webapp にしてください)
  • 場所: アプリのルートディレクトリ
  • 形式: JSON (有効な JSON 形式でなければなりません)

パスの扱い

  • マニフェストやアイコンなどの内部パスは、アプリのルートではなく、アプリ配信元からの絶対パスでなければなりません。例えば、マニフェストが http://www.mysite.com/myapp/manifest.webapp にある場合、インストールパスは /manifest.webapp ではなく /myapp/manifest.webapp となります。
  • 内部パスはアプリと 同一の配信元 から提供されるものでなければなりません。
  • 外部パスは完全修飾パスでなければなりません。例えば、Firefox Marketplaceパッケージ型アプリ を登録していて、アイコンが独自サーバ上でホストされている場合、アイコンのパスは http://mywebapp/images/myicon.png のような形式になるでしょう。

Firefox Marketplace 登録時の必要条件

アプリを Firefox Marketplace で公開したい場合、アプリマニフェストには以下の項目を含める必要があります。

  • name
  • description
  • launch_path (パッケージ型アプリのみ)
  • icons (128×128 のアイコンが必須、512×512 のアイコンが推奨)
  • developer
  • default_locale (locales が定義されている場合)
  • type (特権付きおよび内部 (公認) アプリのみ)

一般的な Open Web App の必要条件

Firefox Marketplace で公開しない一般的な Open Web App を作成する場合、アプリマニフェストには以下の項目を含める必要があります。

  • name
  • description
  • icons (128×128 のアイコンが必須、512×512 のアイコンが推奨)

: 自分が管理しているページからアプリを自主配布する場合、アプリのインストールを実行させる仕組みをユーザに提供する必要があります。これは通常、ホスト型アプリの場合は navigator.Apps.install() を、パッケージ型アプリの場合は navigator.Apps.installPackage() を、ボタンのクリック時に呼び出すことで行われます。

アプリマニフェストの検証

Firefox Marketplace にアプリを登録する場合、アプリマニフェストは Marketplace の検証に合格する必要があります。

あらゆるエラーの特定に役立つ アプリバリデータ を試してください。また この API を使って マニフェストを検証することもできます。

マニフェストの更新

アプリの更新に関する情報は アプリの更新 を参照してください。

マニフェストの例

以下が最小限のマニフェストです。これをテキストファイルへコピーし、それぞれの値を独自の情報に置き換えてください。

{
  "name": "マイアプリ",
  "description": "アプリの簡潔な説明をここに書きます",
  "launch_path": "/index.html",
  "icons": {
    "512": "/img/icon-512.png",
    "128": "/img/icon-128.png"
  },
  "developer": {
    "name": "あなたの名前もしくは組織名",
    "url": "http://your-homepage-here.org"
  },
  "default_locale": "ja"
}

アプリマニフェストの必須項目

マニフェスト内の項目は順序を問いません。ここに書かれていない項目がマニフェストに含まれていても無視されます。

name

: すべてのアプリマニフェストについて必須項目です。

人間が読み取れるアプリの名称。最長 128 文字。

配布後にアプリの名称を変更した場合、ユーザの端末にインストールされている既存のアプリについては名称が更新されません。

"name": "The Open Web!"

description

: すべてのアプリマニフェストについて必須項目です。

人間が読み取れるアプリの説明。最長 1024 文字。

"description": "Exciting Open Web App!"

launch_path

: アプリが パッケージ型アプリ の場合は必須です。

アプリの起動時に読み込まれる、アプリの配信元内でのパス。

そのパッケージ型アプリを含んだ ZIP ファイルを起点とするコンテンツの開始点を指定します。例えば launch_path/mywebapp/index.html の場合、アプリの起動時に /mywebapp/index.html にあるファイルが開かれます。

ヒント:
  • アプリが Web サーバのルートに置かれている場合、例えば mywebapp.github.com/ にあるときは、launch_path/ となります。
  • アプリがサブディレクトリに置かれている場合、例えば mymarket.github.com/mywebapp/ にあるときは、launch_path/mywebapp/ となります。
"launch_path": "/index.html"

icons

: すべてのアプリマニフェストについて 128×128 サイズのアイコンが必須です。すべてのアプリマニフェストについて 512×512 サイズのアイコンが推奨です。

アイコンの URI に対するアイコンサイズを示すマップ。

なお、アイコンへの内部パスはアプリ配信元からの絶対パスでなければならず、外部でホストされているアイコンへのパスは完全修飾パスでなければなりません。

アイコンは正方形で、.png 形式でなければなりません。アイコンには、その画像の 4 つの角すべてに広がる無地の背景を敷いてはいけません。

注意: Firefox Marketplace にアプリを登録する場合、アイコンは Firefox Marketplace アプリアイコンガイドライン にも従う必要があります。

必須アイコンサイズ

128×128
Firefox Marketplace と端末上での表示に使われます。
512×512
Firefox 2.0 以降では、スマートフォンとタブレットの画面サイズ、画面解像度、3 列もしくは 4 列のレイアウトを含む様々な異なる組み合わせにおいて鮮明な表示を実現するため、より大きなアイコンが必要となります。512×512 のアイコンが推奨で、これは端末上のあらゆる使用箇所で自動的に縮小表示されます。このサイズは、Android など、アプリが対応する他のプラットフォームでの表示にも最適でしょう。

役に立つと思われる他のアイコンサイズ

60×60
Firefox OS 旧バージョンでの実機アイコンサイズ。
16×16、32×32、48×48、64×64、90×90、128×128、256×256
これらのアイコンは、Windows、OS X、Android など、アプリが対応する他の様々なプラットフォームで使用されます。
"icons": {
  "128": "/img/icon-1.png",
  "512": "/img/icon-2.jpg"
}

: 512×512 のアイコンサイズ決定に至った詳しい経緯については、アイコン実装ガイド を参照してください。

developer

: すべてのアプリマニフェストについて name のみ必須です。

  • name: 開発者の名前。すべてのアプリマニフェストについて必須項目です。
  • url: アプリの開発者についての情報を記載した Web サイトの URL。任意。
"developer": {
    "name": "The Open Web!",
    "url": "http://www.mywebapp.com"
}

default_locale

: locales が定義されている場合、すべてのアプリマニフェストについて default_locale は必須となります。

アプリマニフェスト内の項目の値に使用している言語を定義する言語タグ (RFC 4646)。

default_locale はロケールを持たないアプリについては必須ではないものの、常に含めることを推奨します。default_locale が定義されていない場合、Firefox Marketplace はアプリの言語を推測します。

例えば、アプリで英語を使用している場合、その default_locale は以下のようになります。

"default_locale": "en"

type

: 特権付きもしくは内部 (公認) アプリの場合、type は必須です。

アプリの種類。これは慎重に扱うべき端末 WebAPI へのアクセスレベルを定義するものです。type が定義されていない場合、既定の type である web が使用されます。

  • web: 通常のホスト型アプリ。この種類のアプリには WebAPI への最低限のアクセスが提供されます。
  • privileged: Firefox Marketplace などのアプリストアによって承認された、認証済みアプリ。この種類のアプリには Web アプリよりも広範な WebAPI へのアクセスが提供されます。
  • certified: スマートフォン上の既定通話アプリやシステム設定アプリなど、重要なシステム機能の提供を目的とした認証済みアプリ。これはアプリストアに登録されたサードパーティ製アプリに与えられる権限ではありません。この種類のアプリには WebAPI への最大限のアクセスが提供されます。

: アプリの種類に関する詳細は パッケージ型アプリ を参照してください。

"type": "certified"

アプリマニフェストの任意項目

以下の項目は任意です。

activities

アプリが対応している一連の Web Activities を指定します (全一覧)。これは以下のような構造を取ります。

  • この項目内の各プロパティはひとつのアクティビティです
  • アクティビティ名は自由形式テキストです
  • 各アクティビティはひとつのオブジェクトで表されます

以下は share というアクティビティを 1 つ含んだアクティビティ項目の例です。

"activities": {
  "share": {
    "filters": {
      "type": [ "image/png", "image/gif" ]
    },
    "href": "foo.html",
    "disposition": "window",
    "returnValue": true
  }
}

この例では、share アクティビティのオブジェクトは、filtershrefdispositionreturnValue というプロパティを持っています。これらの意味は アクティビティハンドラの説明 に書かれています。

appcache_path

アプリケーションキャッシュ (AppCache) マニフェストへの絶対パス。Open Web App がインストールされる際、この AppCache マニフェストが取得、解析され、CACHE ヘッダ以下の静的ファイルがキャッシュされます。

: パッケージ型アプリはインストール時に端末上に関連ファイルをキャッシュします。パッケージ型アプリについては AppCache を設定する必要はありません。

: AppCache は欠陥を含む技術であることから、近々より一層効果的な Service Worker に置き換えられる予定です。

"appcache_path": "/cache.manifest"

chrome

Firefox OS 1.1 ???

戻る、進む、再読み込み、お気に入りボタンを備えたナビゲーションコントロールを画面下部に追加します。

クロームナビゲーション

: このオプションに依存することなく、アプリのインタフェース上で戻るボタンを設計することを推奨します。

"chrome": { "navigation": true }

csp

: オプション。Firefox OS、デスクトップ版 Firefox、Android 版 Firefox へインストールされたすべてのパッケージ型アプリに適用されます。

この項目は、アプリ内の全ページに適用される Content Security Policy (CSP) を定義するために使用されます。CSP へ追加可能なポリシーの一覧は CSP ポリシー命令 に記載されており、アプリに関しては、以下のように 1 行でそれらを含める必要があります。

"csp" : "default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'"

Firefox OS 向けの特権付き、内部・公認アプリへ適用される既定のポリシーは以下のようになります。

特権付き CSP
default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'
内部・公認 CSP
default-src *; script-src 'self'; object-src 'none'; style-src 'self'

これらの規定値は上書きできず、追加のみ可能となっています。つまり、マニフェスト内の CSP ポリシーは、特権付き・内部アプリの場合に、実際に適用される CSP をより制約のあるものにするだけです。

: アプリ固有の CSP 制限の詳細については Apps CSP のページ を参照してください。

datastores-owned

: Firefox OS へインストールされる内部・公認アプリにのみ適用されます。

Data Store API を活用する場合、データを所有するアプリはその所有権を主張するため、datastores-owned 項目をマニフェストに含める必要があります。例えば、

"datastores-owned": {
  "myData": {
    "access": "readwrite",
    "description": "my data store"
  }
}

別々のデータストアを表すために複数のプロパティを含めることができ、各プロパティは readonly もしくは readwriteaccess を使って、そのデータストアが他のアプリケーションから読み取り、編集可能であることを指定することができます。データストアの目的を説明するために description も含められます。

datastores-access

: Firefox OS へインストールされる内部・公認アプリにのみ適用されます。

Data Store API を活用する場合、データにアクセスしたい所有者以外のアプリは、datastores-access 項目をマニフェストに含める必要があります。例えば、

"datastores-access": {
  "myData": {
    "access": "readwrite",
    "description": "Read and modify my data store"
  }
}

この項目が指定されていない場合、既定の動作は「アクセスなし」となります。ここでも、複数のデータストアにアクセスしたい場合は複数のプロパティを含めることができ、readonly もしくは readwriteaccess を設定することで、そのアプリが必要とするアクセスの種類を宣言できます。

fullscreen

ランタイムがそのアプリを全画面モードで起動するかどうかを示します。

ほとんどのアプリが全画面で実行するため、これは true に設定することを推奨します。

"fullscreen": "true"

installs_allowed_from

アプリのインストール実行を許可するひとつ以上のサイトの URL。

この項目はエンドユーザが購入可能な有料アプリ向けです。この項目は開発者が商取引を持っているアプリストアを特定します。特に指定しないと、アプリはどこからでもインストール可能となります。

注意: インストールに失敗するため、URL の末尾にスラッシュを含めないでください。

例えば、アプリを Firefox Marketplace からインストール可能とする場合、installs_allowed_from は以下のようになります。

"installs_allowed_from": [
  "https://marketplace.firefox.com"
]

: 配列を ["*"] のような形式にした場合、このアプリのインストールはすべてのサイトに許可されます。これが既定値です。なお、空の配列 [] にした場合、自分のサイトを含め、すべてのサイトからのインストールを禁止することになります。

locales

マニフェストに含まれる項目値のひとつ以上のロケール固有の上書きを示すマップ。

locales エントリには、その特定言語で上書きしたいアプリマニフェストの項目一覧が含まれます。locales のキーは default_locale と同様の言語タグです (RFC 4646)。

注意:

  • locales を定義する場合、default_locale も定義しなければなりません。

  • default_locale の値を locales 内で再定義しないでください。

  • 次の項目は上書きできません: default_localelocalesinstalls_allowed_from

例えば、アプリの既定言語が英語の場合、default_localeen となるでしょう。そのアプリの namedescription を イタリア語圏と日本語圏のユーザ向けに翻訳された namedescription で上書きしたいという場合、locales 内のエントリは以下のようになるでしょう。

"locales": {
  "it": {
    "name": "L'Open Web",
    "description": "Eccitante azione di sviluppo web open!"
  },
  "ja": {
    "name": "オープン Web",
    "description": "エキサイティングな Open Web アプリ!"
  }
}

messages

: Firefox OS へインストールされるアプリにのみ適用されます。

アプリから捕捉可能とするシステムメッセージと、それらのメッセージが送信された場合に表示するアプリ内のページを指定します。

以下は Firefox OS 電話アプリの例です。電話の着信があるたびに (システムメッセージ: telephony-new-call) 端末は電話アプリのキーパッドを表示します (URL: /dialer/index.html#keyboard-view)。

"messages": [
  { "telephony-new-call": "/dialer/index.html#keyboard-view" }
]

moz-firefox-accounts

Firefox OS 2.0 ???

: Android 版 Firefox もしくは Firefox OS 上で動作するアプリにのみ適用されます。

: 特権付きもしくは内部 (公認) パッケージ型アプリにのみ適用されます。

この許可設定は navigator.mozId API 使用時に Firefox Accounts の使用を許可します。詳しくは Firefox OS 上の Firefox Accounts を参照してください。

"moz-firefox-accounts": {}

orientation

: Android 版 Firefox もしくは Firefox OS 上で動作するアプリにのみ適用されます。

アプリケーションの向きを固定する位置。

取り得る値の説明図:

アプリの固定位置
portrait-primary 電話機: 縦方向でまっすぐの状態
portrait-secondary 電話機: 縦方向で上下逆の状態
portrait
これを宣言した場合、-primary
-secondary を記述する必要はありません
電話機: 縦方向でまっすぐの状態電話機: 縦方向で上下逆の状態
landscape-primary 電話機: 横方向で左側を上にした状態
landscape-secondary 電話機: 横方向で右側を上にした状態
landscape
これを宣言した場合、-primary
-secondary を記述する必要はありません

電話機: 横方向で左側を上にした状態

電話機: 横方向で右側を上にした状態

"orientation": [ "landscape-primary" ]

origin

Firefox OS 1.1 ???

: 特権付きもしくは内部 (公認) パッケージ型アプリにのみ適用されます。

パッケージ型アプリは app://UUID という特別な内部プロトコルを持ち、ここでの UUID はアプリがインストールされている各端末固有の文字列となります。現時点で UUID を簡単に取得する方法はありません。origin 項目は、各インストール済みアプリが使用する単独のドメイン名でこの UUID を置き換えられるようにするものです。

注: ドメイン名は app:// で始める必要があり、アプリの開発者は指定されたドメイン名の所有者でなければなりません。

"origin": "app://mywebapp.com"

permissions

アプリが必要とする慎重に扱うべき端末 API のユーザ許可設定。例えばユーザの連絡先へのアクセスなどが該当します。WebAPI の許可設定と機能に関する完全な一覧 も参照してください。

各許可設定は以下のプロパティを必要とします。

  • name: 許可設定の名称
  • description: アプリがこの許可設定を使わなければならない理由
  • access: 必要なアクセスレベル。readonlyreadwritereadcreatecreateonly のいずれかを取ります。これが必要なのは Data Store など一部の API のみです。

以下は、端末の contactsalarms を使用する許可設定が必要なアプリのマニフェスト項目の例です。

"permissions": {
  "contacts": {
    "description": "Required for autocompletion in the share screen",
    "access": "readcreate"
    },
  "alarms": {
    "description": "Required to schedule notifications"
  }
}

Note: アプリが permissions 項目内の該当するプロパティなしにこれらの API を使おうとした場合、実行に失敗するでしょう。

API は多数あり、その一部は特権付きもしくは内部 (公認) アプリのみに提供されています。例えば systemXHR を使用するには、以下のように type 項目が privileged に設定されていなければなりません。

  "type": "privileged",
  "permissions": {
    "systemXHR": {
      "description": "Required to download podcasts."
    }
  }

precompile

Firefox OS 1.4 ???

: パッケージ型アプリにのみ適用されます。

インストール時にコンパイルしたい asm.js コードを含む JavaScript ファイルへのパス。

インストール時のコンパイルによってインストール時間は長くなりますが、アプリの起動時間は短縮されます。

"precompile": [
  "game.js",
  "database.js"
]

redirects

Note: Firefox OS へインストールされるパッケージ型アプリにのみ適用されます。

アプリが外部プロセスの処理に使用する内部 URL。

例えば、Facebook の OAuth 認証を使って、ユーザの連絡先情報を取得するアプリもあるでしょう。認証が完了すると、サーバは通常、アプリ開発者があらかじめ指定した URL へアプリをリダイレクトし返します。パッケージ型アプリは Web 上でホストされていないことから、リダイレクト先として指定可能な正規の URL を持っていません。そこで、redirects 項目を使って、外部 URL を内部アプリ URL へリダイレクトします。

上記のシナリオでは、redirects 項目は以下のようになるでしょう。

"redirects": [
  {"from": "http://facebook.com/authentication/success.html",
    "to": "/app/main_interface.html"}
]

redirects によって宣言されるリダイレクトの範囲は、それを宣言したアプリ自体に制限されます。これは、複数のアプリが同じ公開 URL を独自のローカルリソースへリダイレクトできるようにするためであり、また特定のアプリケーションによる公開 URL のグローバルハイジャックを防ぐための措置でもあります。

role

この role 項目は主に Gaia エンジニアチームによる内部使用向けです。アプリがどのように B2G によって使用されるべきか、つまりシステム上の役割を指定することができます。例えば、キーボードなのか、ホームスクリーンを置き換えるものなのか、といったことです。

"role": "system",

以下のオプションがあります。

  • system: アプリをホームスクリーン上で非表示にします。これは元々システムアプリの置き換え用でしたが、実際のところシステムアプリと同等ではなく、ユーザが直接使用しないアプリ (例えば Bluetooth アプリなど) を隠すためだけに使われています。
  • input: 置き換え可能なキーボードとして設定アプリ上に表示します。またホームスクリーン上で非表示にします。
  • homescreen: 置き換え可能なホームスクリーンオプションとして設定アプリ上に表示します。またホームスクリーン上で非表示にします。.
  • search: ホームスクリーン上に表示しますが... (要更新)

version

マニフェストのバージョンを表す文字列。

この項目は開発者の便宜のために用意されているもので、ランタイムは使用しません。そのため version は任意の値を取ることができます。定義しておくことを推奨します。

"version": "2.1"

マニフェストの配信

アプリマニフェストはアプリと 同一の配信元 から配信する必要があります。

マニフェストはファイル拡張子 .webapp 付きで保存しなければなりません。また、Content-Type ヘッダを application/x-web-app-manifest+json として配信する必要があります。これは今のところ Firefox では必須ではありませんが、Firefox Marketplace では必須です。Firefox OS は、ユーザがインストールを実行したページの origin がアプリ自体の origin と異なる場合のみ、この確認を行います。Content-Security-PolicyX-UA-Compatible といった他のヘッダは必要ありません。

特定の攻撃リスクを軽減するため、SSL 通信を通じてマニフェストを配信することも可能です。マニフェストは HTTP 圧縮 で配信することもできますが、キャッシュされるべきではありません。

Firefox Marketplace へアプリを登録する場合、マニフェストの文字エンコーディングは UTF-8 とする必要があります。バイトオーダーマーク (BOM) は省略することをお勧めします。他のエンコーディングは、Marketplace では評価されませんが、Content-Type ヘッダの charset パラメータで指定可能です (例: Content-Type: application/x-web-app-manifest+json; charset=ISO-8859-4)。

ユーザエージェントは、可能な場合、アプリのインストールをユーザに確認する際、サイト識別情報と TLS ステータスを意味のある形で伝えます。

Apache からの配信

.htaccess ファイルに以下の行を追加します。

AddType application/x-web-app-manifest+json .webapp

.htaccess ファイルへの追加でうまくいかない場合、同じディレクティブを Apache の設定ファイルへ追加してみてください。設定ファイルは、OS の種類や構成によって、httpd.conf もしくは 000-default.conf のようなファイル名となっています。

IIS からの配信

web.config ファイルを編集する必要があります。これはおそらく Web サイトのルートディレクトリにあるでしょう。

<configuration> <system.webServer> <staticContent> セクションに新しい項目を追加する必要があります。

<remove fileExtension=".webapp" />
<mimeMap fileExtension=".webapp" mimeType="application/x-web-app-manifest+json; charset=UTF-8" />

: 詳しくは 静的コンテンツの MIME マッピングの追加 <mimeMap> を参照してください。

nginx からの配信

設定ディレクトリにある mime.types ファイルを編集する必要があります。これはおそらく /etc/nginx//opt/nginx/ にあります。

以下のような設定が見つかるはずです。最後の行を追加してください。

types {
  text/html   html htm shtml;
  text/css    css;
  text/xml    xml;
  application/x-web-app-manifest+json   webapp;
}

GitHub からの配信

マニフェストファイルを GitHub Pages から提供する場合、GitHub が自動的に application/x-web-app-manifest+jsonContent-Type ヘッダで提供してくれます。

Python からの配信

Python がインストールされている場合は、Python を起動し、以下のコードを実行することで、ローカルディレクトリから簡単にサーバを実行できます。

import SimpleHTTPServer
import SocketServer
SimpleHTTPServer.SimpleHTTPRequestHandler.extensions_map['.webapp'] = 'application/x-web-app-manifest+json'
httpd = SocketServer.TCPServer(("", 3000), SimpleHTTPServer.SimpleHTTPRequestHandler)
httpd.serve_forever()

Rack (Ruby) からの配信

config/initializers/mime_types.rb に以下の行を追加します。

Rack::Mime::MIME_TYPES['.webapp'] = 'application/x-web-app-manifest+json'

仕様

仕様 状況 備考
Manifest for web application 勧告改訂案  

 

ドキュメントのタグと貢献者

タグ: 
 このページの貢献者: kohei.yoshino, ethertank
 最終更新者: kohei.yoshino,