Chrome Extensionのmanifestバージョンを上げる(1から2へ)
Chrome Extensionを更新しようとすると、Manifestバージョンを1から2にあげろといわれたので対応してみました。
今回対応したのは、Zabbixトリガーチェック用Chrome Extensionの「Chromix - Chrome Web Store」です。
そもそも今までmanifestバージョンを指定していなかったので、
まずmanifest.jsonに以下を追記します。
(指定しなかった場合は1とみなされるようです)
"manifest_version":2,
これで拡張機能をインストールしてみると、設定がおかしいとかでエラー。
browser_actionにbackground_pageの項目を設定していたが、この指定方法が変更になるらしい。
"background_page":"background.html"
↓
"background":{"page":"background.html"}
これでインストール時のエラーはでなくなったが、今度はbrowser_actionが動かない。
ここの記述方法も変更になっており、
"browser_action":{
"popup":"popup.html"
}
↓
"browser_action":{
"default_popup":"popup.html"
}
これでpopupはうまく表示されました。
すると次は、inlineで読み込んでいるJavaScriptが動作しない。
開発ツールのコンソールでエラーを確認すると、以下のエラーが発生。
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".
セキュリティポリシーでブロックされているらしい。
ということで、これも修正。
の中に直接JavaScriptを書いていたところをすべて外だしのファイルにして、
src="js/xxx.js"という形で読み込むように修正。
これで修正してもまだエラーが発生。
Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".
<a href="#" id="add" onclick="displayLoginBox()" tabindex="1">Add Zabbix</a>
aタグの中のonclickにJavaScriptを埋め込んでいた部分でもエラーが発生。
この部分はjQueryで処理できるように以下のようにJavaScriptファイルに書き換えて対応。
$("#add").click(function(){ displayLoginBox(); });
以上で問題なく動作するようになった。
inlineでの読み込みじゃなく、正しくJavaScript処理をファイルで分けていればmanifest.jsonの書き換えだけでなんとかなるのではないでしょうか。
最終的なmanifest.jsonはこんな感じになりました。
{
"name":"Chromix",
"version":"1.2",
"manifest_version":2,
"background":{"page":"background.html"},
"description":"Zabbix Alert Check Extension",
"options_page":"options.html",
"permissions":[
"notifications",
"tabs",
"http://*/*",
"https://*/*"
],
"browser_action":{
"default_icon": "image/chromix_normal_icon.png",
"default_popup":"popup.html"
},
"icons": {
"16": "image/chromix_icon_16x16.png",
"48": "image/chromix_icon_48x48.png",
"128": "image/chromix_icon_128x128.png"
}
}
ここに変更箇所が書かれているのでチェックしてください。
http://developer.chrome.com/extensions/manifestVersion.html
バージョン1はサポートされなくなるらしいので、version1で作成している人は修正が必要になるかと思います。
※2012/08/27追記
Desktop Notificationで画像アイコンを表示させていたのですが、
Manifestバージョンを2に上げた時から表示されなくなってしまいました。
http://developer.chrome.com/extensions/manifest.html#web_accessible_resources
ここの記述によると、web_accessible_resourcesという設定を追加して、
利用している画像ファイルをあらかじめ指定しておかないとパーミッションエラーで弾かれるようです。
ということで最終的にはこんな感じになりました。
{
"name":"Chromix",
"version":"1.5",
"manifest_version":2,
"background":{"page":"background.html"},
"description":"Zabbix Alert Check Extension",
"options_page":"options.html",
"permissions":[
"notifications",
"tabs",
"http://*/*",
"https://*/*"
],
"browser_action":{
"default_icon": "image/chromix_normal_icon.png",
"default_popup":"popup.html"
},
"icons": {
"16": "image/chromix_icon_16x16.png",
"48": "image/chromix_icon_48x48.png",
"128": "image/chromix_icon_128x128.png"
},
"web_accessible_resources": [
"image/chromix_error_icon.png",
"image/chromix_normal_icon.png",
"image/warning.png",
"image/secure.ico"
]
}