前回は，Chrome Web Storeの概要からAppsの簡単な説明，Chrome Web Storeの使い方までを説明しました。今回は，2種類あるWeb Appsのうち，Hosted Appsについて作成方法から公開までを具体的にご紹介したいと思います。

Hosted Appsとは

Hosted Appsの基本的な考え方は，一般的なWebサイトと変わりありません。自身で管理するWebサーバーからWebアプリやWebサービスを提供します。Chrome Web Storeでは，それらをインストール可能なWebアプリとして公開することができます。

サーバー側では任意の言語やWeb技術を利用し，クライアント側ではHTML，CSS，JavaScriptなどを使用します。HTML5やその関連技術，Chromeがサポートする新しいAPIなども利用可能です。是非，これらを活用して好きなWebアプリを作ってみてください。

Hosted Appsの作成方法

Hosted Appsは，前述の通り一般的なWebサイトと変わりありませんので，ここではWebアプリの中身については言及しません。既にWebアプリ（Webサイト）があることを前提として，Chromeブラウザにインストール可能とするための方法を説明します。

WebアプリをHosted Appsとして公開する場合，ソースを書き換える必要も，使用しているAPIを変える必要もありません。マニフェストファイルとアイコンを用意し，以下のフォルダ構成で配置します。マニフェストファイルとアイコンの内容については，後述します。

• exampleApp/
  • manifest.json
  • icon_128.png

任意の名前のフォルダを作成し，その中にマニフェストファイルとアイコンファイルを配置します。フォルダの名前には，Webアプリの名称などを指定するとよいでしょう。アイコンファイルの名前は，マニフェストファイル内で指定します。

マニフェストファイルとアイコンの作成

マニフェストファイルは，公開するWebアプリのメタデータとしてmanifest.jsonというテキストファイルを作成します。この中で，WebアプリのURLや利用するリソース，アクセス許可などを設定します。文字コードは，UTF-8である必要があります。以下に典型的なマニフェストファイルの内容を示します。

{
  "name": "exampleApp",
  "description": "Hosted Apps Example",
  "version": "1",
  "app": {
    "urls": [
      "*://example.com/apps/",
      "*://example.com/mail/"
    ],
    "launch": {
      "web_url": "http://example.com/apps/"
    }
  },
  "icons": {
    "128": "icon_128.png"
  },
  "permissions": [
    "unlimitedStorage",
    "notifications",
    "geolocation",
    "background"
  ]
}

マニフェストファイル中の“name”と“icons”は，Webアプリがインストールされた際に，新しいタブページに表示される内容です。新しいタブページでWebアプリのアイコンをクリックすると，“web_url”で記載されたURLのページを表示します。

アイコンファイルには，サイズが128pxのものを指定します。アイコン画像の外側は枠で隠れることがあるため，中央の98×98pxの領域で表示されるようにし，外側の領域を透過にすることが推奨されています。アイコンファイル作成の細かなガイドラインについては，以下のドキュメントを参照してください。

• Chrome Web Store image guidelines

ほかにも，“urls”でWebアプリが利用するリソースをURLで明記し，“permissions”で，アクセス許可が必要なAPIなどを記載します。マニフェストファイルに記載された内容は，Chrome Web StoreのWebアプリの詳細画面に表示されますので，ユーザーがこのWebアプリがどんなことをするのか，正しく理解し，安全であるかどうか判断できるようにする必要があります。

この例では，google.com上のデータへのアクセスとブラウザ履歴へのアクセスがあることがわかります。このように，不必要なアクセスをしていないとこと明示するためにも“urls”や“permissions”の内容については，必要最小限のものにしておくとよいでしょう。

その他のHosted Appsで設定するマニフェストファイルの内容については，下記表を参考にしてください。