メモ > 技術 > ツール: Browser > Chrome拡張機能の作成
■Chrome拡張機能の作成
■拡張機能の作成
Chrome拡張機能の作り方。誰でもかんたんに開発できる！
https://original-game.com/how-to-make-chrome-extensions/
Google Chrome Extensionの作り方 第１回 〜Hello World編〜 | Risaiku リサイク
https://risaiku.net/archives/1653/
Chromeの拡張機能を自作する - 虎の穴開発室ブログ
https://toranoana-lab.hatenablog.com/entry/2020/04/23/174421
Getting started - Chrome Developers
https://developer.chrome.com/docs/extensions/mv3/getstarted/
Chrome拡張作ったら異世界転生した件 - Qiita
https://qiita.com/zakuroishikuro/items/5275f783a2d8b37db212
ボタンをクリックすると、アラートが表示されるだけの拡張を作成する
manifest.json
{
"name": "Hello World",
"description": "クリックするとアラートを表示します。",
"version": "1.0.0",
"manifest_version": 3,
"permissions": ["activeTab","scripting"],
"background": {
"service_worker": "background.js"
},
"action": {
"default_icon": {
"16": "img/icon_16.png",
"24": "img/icon_24.png",
"32": "img/icon_32.png"
},
"default_title": "アラートを表示"
}
}
background.js
chrome.action.onClicked.addListener((tab) => {
chrome.scripting.executeScript({
target: {tabId: tab.id},
function: () => {
alert('ハロー！ワールド');
}
});
});
また、以下にアイコン画像を配置する
icon_16.png
icon_24.png
icon_32.png
Chromeで「chrome://extensions/」を開き、右上のスイッチで拡張機能を有効にする
「パッケージ化されていない拡張機能を読み込む」から、上の手順で作成した拡張機能を読み込む
アイコンをクリックすることで実行できるが、「chrome://extensions/」のページで実行すると
「Uncaught (in promise) Error: Cannot access a chrome:// URL」
というエラーになるので注意
通常の http や https から始まるページを開いた状態で実行する必要がある
■タブを参照
Chrome拡張機能でタブの情報を取得する方法 - Qiita
https://qiita.com/plumfield56/items/99f5cfc1bf5fd03e8040
ChromeのアクティブなタブのURLを取得する | e-JOINT.jp
https://e-joint.jp/1041/
■公開
自作したChrome拡張を公開する方法！【画像付き解説】 | すずきライフ
https://belltree.life/chrome-extension-release/
Google Chrome Extensionの作り方 番外編 〜ストアへの公開編〜 | Risaiku リサイク
https://risaiku.net/archives/2162/
manifest.json が入った CloseRightTabs フォルダをZIP形式で圧縮する
以下から公開作業を行う
デベロッパー ダッシュボード
https://chrome.google.com/webstore/devconsole
公開しようとすると、以下のエラーになった
・詳細な説明が短すぎるか、指定されていません。25 文字以上で指定してください。
・アイテムを公開する前に、連絡先メールアドレスを指定する必要があります。[アカウント] タブで連絡先メールアドレスを入力してください。
・少なくとも 1 つのスクリーンショットまたは動画が必要です。
・アイテムを公開するには、データの使用が Google のデベロッパー プログラム ポリシーに準拠していることを表明していただく必要があります。この表明は、アイテム編集ページの [プライバシーへの取り組み] タブで行うことができます。
それぞれ以下のように対応した
・「ストアの掲載情報 → 商品の詳細 → 説明」を充実させた
・「ハンバーガーメニュー → アカウント → 連絡先メールアドレス」を登録した
・「ストアの掲載情報 → 画像アセット → スクリーンショット」を登録した
・「プライバシーへの取り組み → データ使用」で「私は以下の開示が正しいものであることを表明します。」の各回答にチェックを入れた
審査に提出できたが、以下の理由で承認されなかった
違反の参照 ID: Purple Potassium
違反事項: アイテムに実装されている方法 / プロパティでは、次の権限をリクエストする必要がない。
tabs
修正方法: 上記の権限を削除します。アイテムで使用するプロパティは、これらの権限をリクエストしなくても引き続き機能します。
不要な権限を削除して再度申請すると公開できた
以下に公開された
https://chrome.google.com/webstore/detail/close-right-tabs/ahdnifnjcpeklloobmgkkidkaedkodii?hl=ja
…が、ブラウザに導入してしばらくすると、強制的に無効化される？
拡張機能一覧を確認すると、
「この拡張機能は Chrome ウェブストアのポリシーに違反しています。」
と警告が表示されている
キャッシュの問題なのか、承認されて公開もされたのに何か違反があるのか
ブラウザを再起動すると警告は非表示になる
引き続き確認する
また、インストール時も
「この拡張機能は、セーフ ブラウジング保護強化機能で信頼されていません。」
のように警告が表示され、導入後も同メッセージが表示されている
ポリシー違反と関係があるかは不明だが、引き続き確認したい
「Google Chrome」の「保護強化機能」を有効化して鉄壁のセキュリティに - 窓の杜
https://forest.watch.impress.co.jp/docs/news/1329712.html
数日経つと、いつの間にか
「この拡張機能は Chrome ウェブストアのポリシーに違反しています。」
の警告は表示されなくなっていた
いったん違反状態になると、キャッシュの影響でしばらく同状態が続く…という仕様なのか
「この拡張機能は、セーフ ブラウジング保護強化機能で信頼されていません。」
の警告は表示されたままなので、これは引き続き確認したい
拡張機能をインストールして管理する - Chrome ウェブストア ヘルプ
https://support.google.com/chrome_webstore/answer/2664769
「セーフ ブラウジング保護強化機能を利用したインストール」
の項目にて
「Chrome でセーフ ブラウジング保護強化機能を有効にした場合、インストールする拡張機能が信頼できない場合に警告が表示されます。」
「拡張機能は、Chrome ウェブストアのデベロッパー プログラム ポリシーを遵守するデベロッパーによって作成されている場合に信頼できると判断されます。」
「新しいデベロッパーの場合、通常は信頼できると判断されるまでに数か月かかります。」
のように紹介されている
いったんはストアの掲載内容を充実させるくらいか
まずはブラウザの拡張機能一覧にアイコンを表示させたい
一週間ほど経つと、何もしていなくても
「この拡張機能は、セーフ ブラウジング保護強化機能で信頼されていません。」
が表示されなくなっていた
…が、環境によっては表示されたままだった。謎