ホーム > 開発 > HTML5 アプリ

スタートガイド

Estimated reading time: 2 minutes

ここでは 法人向け ブラビア 上で HTML5 アプリを開発・インストール・実行する方法についてご紹介します。

まず最初に USB メモリから簡単なアプリケーションを起動するためのアプリケーション構成の基本情報について説明します。 サポートされている USB メモリのフォーマットは FAT32、NTFS、exFAT です。

アプリケーション構成

ファイル・ディレクトリ構造

HTML5 アプリは、以下のファイル・ディレクトリ構造のルールを満たす必要があります。

USB: /sony/
          +--- autorun.txt
          +--- apps/webapps/
                           +--- <application_name_1>/app/ // Application Directory
                                                        +--- manifest.json
                                                        +--- <resource>/
                                                                       +--- <static_files>
                           +--- <application_name_2>/app/ // Application Directory
                                                        +--- manifest.json
                                                        +--- <resource>/
                                                                       +--- <static_files>
                           :
     /media/
           + video1.mp4
           + video2.mp4
           :

アプリケーション名には任意のディレクトリ名が使用でき、複数のアプリケーションを /sony/apps/webapps/ ディレクトリの下に置くことができます。 さらに、*.html, *.js, *.css, *.png のような静的ファイルを、/sony/apps/webapps/<application_name>/app/<resource>/ ディレクトリの下に置くことができ、file://localhost/<resource>/<static_files> でアクセスすることができます。 すべてのアプリケーションファイルを USB メモリに置くことで、オフラインアプリケーションとして機能させることも可能です。

autorun.txt

autorun.txt では、起動するアプリケーションの auid を指定できます。 アプリケーションファイルは /sony/apps/webapps/ ディレクトリに置きます。 以下が autorun.txt の最小の例です。

{
  "auid": "net.sony.tv.sample.manifestjson_weburl"
}

autorun.txt は、アプリケーションディレクトリにおけるアプリケーションの動作 (起動/コピー/削除) を指定することもできます。

詳細については autorun.txt をご覧ください。

manifest.json

マニフェストファイル manifest.json では、auid、タイトル、スプラッシュ画像、初期 URL などのアプリケーション情報を指定できます。 マニフェストのファイル名は "manifest.json" です。 以下は manifest.json の例です。

{
  "name": {
    "default": "en_US",
    "en_US": "[Sample] Launch from web_url"
  },
  "auid": "net.sony.tv.sample.manifestjson_weburl",
  "version": "1.0",
  "manifest_version": "1.0",
  "app": {
    "launch": {
      "web_url": "https://example.com/myapp"
    }
  },
  "splash": "splash.jpg",
  "minimum_web_platform_version": "1.0"
}

詳細については manifest.json をご覧ください。

USB メモリからアプリケーションを起動する

ケース1. ウェブサイトを表示する

サンプルアプリケーション をダウンロード、解凍し、以下のようにファイルを置きます。

USB: /sony/
          +--- autorun.txt
          +--- apps/webapps/manifestjson_weburl/app/manifest.json

以下の手順でアプリケーションを設定してください。

  1. manifest.json の "web_url" プロパティを設定します。次の例では、アプリケーション起動時に "https://example.com/" を表示します。 
    {
 "name": {
   "default": "en_US",
   "en_US": "[Sample] Launch from web_url"
 },
 "auid": "net.sony.tv.sample.manifestjson_weburl",
 "version": "1.0",
 "manifest_version": "1.0",
 "app": {
   "launch": {
     "web_url": "https://example.com/"
   }
 },
 "minimum_web_platform_version": "1.0"
}
  2. "sony" ディレクトリを USB メモリのルートディレクトリにコピーします。
  3. USB メモリをディスプレイに挿入することで、アプリケーション起動時に "web_url" で指定したウェブサイトが表示されます。

ケース2. USB メモリのアプリケーションを起動する

サンプルアプリケーション をダウンロード、解凍し、以下のようにファイルを置きます。 このサンプルには video.mp4 が含まれていないため、動画コンテンツ video.mp4 を /sony/apps/webapps/manifestjson_localpath/app/doc/ に置いてください。

USB: /sony/
          +--- autorun.txt
          +--- apps/webapps/manifestjson_localpath/app/
                                                      +--- manifest.json
                                                      +--- doc/
                                                              +--- index.html // Initial Page
                                                              +--- video.mp4 // Please put your sample file

以下の手順でアプリケーションを設定してください。

  1. manifest.json の "local_path" プロパティを設定します。次の例では、アプリケーション起動時に “doc/index.html” を表示します。 
    {
 "name": {
   "default": "en_US",
   "en_US": "[Sample] Launch from local_path"
 },
 "auid": "net.sony.tv.sample.manifestjson_localpath",
 "version": "1.0",
 "manifest_version": "1.0",
 "app": {
   "launch": {
     "local_path": "file://localhost/doc/index.html"
   }
 }
}
  2. "sony" ディレクトリを USB メモリのルートディレクトリにコピーします。
  3. 用意した video.mp4 を /sony/apps/webapps/manifestjson_localpath/app/doc/ に置いてください。 サポートされているオーディオ/ビデオメディアフォーマットの詳細については AVメディアフォーマット をご確認ください。
  4. USB メモリをディスプレイに挿入することで、アプリケーション起動時に "local_path" プロパティで指定したページが表示されます。

local_path プロパティのファイルを置き換えることで任意の HTML5 アプリを起動することができます。

Last modified: 6 Mar 2019