スキルアップを始める!

manifest.jsonとは?定義ファイルについて

PWA(プログレッシブウェブアプリ)
PWA(プログレッシブウェブアプリ)
この記事は約4分で読めます。

※記事中に広告情報を含みます。

スキルを手に入れた時、人は強くなれる。
Youtubeでスキルアップを始める 電子書籍でスキルアップを始める
\ワードプレスのスキルアップはこちら!/ WordPress入門読本

manifest.jsonとは

manifest.jsonは、Webアプリケーションやブラウザ拡張機能の開発に使用されるJSONファイルです。

このファイルは、アプリケーションまたは拡張機能の基本情報や設定、アイコンなどのリソースの場所を定義します。

また、ブラウザはこのファイルを使用して、アプリケーションや拡張機能のインストール時や更新時に必要な情報を取得します。manifest.jsonは、Webアプリケーションやブラウザ拡張機能の開発において、非常に重要な役割を担っています。

manifest.json サンプルコード(拡張機能)

この例では、拡張機能の名前やバージョン、説明、アイコン、ブラウザアクションの定義、および必要な権限(この場合はタブにアクセスする権限)が定義されています。

{
  "manifest_version": 2,
  "name": "My Extension",
  "version": "1.0",
  "description": "This is my first extension",
  "icons": {
    "16": "icon16.png",
    "32": "icon32.png",
    "48": "icon48.png",
    "128": "icon128.png"
  },
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "permissions": [
    "tabs"
  ]
}

[rml_read_more]

また、このサンプルコードは、”manifest_version”が2であることを示しています。このフィールドは、manifest.jsonのバージョンを指定します。バージョン2では、より多くの機能が利用可能になっています。

manifest.json サンプルコード(PWA)

このサンプルコードは、PWAを作成するときのマニフェストファイルの定義です。

{
  "lang": "ja",
  "name": "eguweb",
  "short_name": "eguweb",
  "start_url": "/?utm_source=home_screen&utm_medium=pwa",
  "display": "standalone",
  "theme_color": "#21759b",
  "icons": [
    {
      "src": "/wp-content/uploads/logo-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ]
}

アプリの名称や画像のアイコンを設定しています。

manifest.jsonのフィールド例

他には、以下のようなフィールドが定義できます。

"background": 背景スクリプトを定義し、拡張機能のバックグラウンドで実行するコードを指定します。
"content_scripts": コンテンツスクリプトを定義し、特定のウェブページに注入するスクリプトを指定します。
"options_page": オプションページのHTMLファイルを指定します。
"permissions": 拡張機能が必要とするAPIへのアクセス権を指定します。
"web_accessible_resources": コンテンツスクリプトからアクセス可能なリソースを指定します。

これらのフィールドは、拡張機能の開発において非常に役立ちます。適切に定義することで、拡張機能の機能をより柔軟にカスタマイズすることができます。

まとめ

このmanifest.jsonファイルは、アプリケーションまたは拡張機能の基本情報や設定、アイコンなどのリソースの場所を定義し、ブラウザはこのファイルを使用して、アプリケーションや拡張機能のインストール時や更新時に必要な情報を取得します。

また、manifest.jsonには、拡張機能のバックグラウンドで実行するスクリプトや、注入するコンテンツスクリプト、オプションページ、必要な権限などを定義することもできます。これらのフィールドを適切に定義することで、拡張機能の機能をより柔軟にカスタマイズすることができます。

manifest.jsonは、Webアプリケーションやブラウザ拡張機能の開発において、非常に重要な役割を担っています。

URLをコピーしました!