More than 3 years have passed since last update.

Chrome拡張機能のストア公開手順を実例とスクショ付きでまとめました

chrome-extension

Last updated at 2020-07-28Posted at 2020-07-27

はじめに

最近、初めてChrome拡張機能を開発し、Chromeウェブストアに公開しました。
機能開発自体はそこまで時間が掛かってはいないのですが、ストア公開に時間が掛かったので、これからストア公開をする方がラクになれば良いなと思って手順をまとめました。

事前に準備しておくもの

開発しているChrome拡張機能
クレジットカード(Chromeウェブストアのデベロッパー登録に使用します)

拡張機能のzipファイルを作成する
開発者用のGoogleアカウントを作成する
Chromeウェブストアのデベロッパー登録をおこなう
拡張機能のzipファイルをアップロードする
公開に必要なデータを入力またはアップロードする
アカウント情報を入力する
審査のために送信する
審査結果を待つ
ストアに公開する
Chromeウェブストアの検索結果に反映されるまで待つ

Chromeウェブストア公開手順

1. 拡張機能のzipファイルを作成する

ストア公開する際ためには拡張機能をzipファイル化したものを提出する必要があるので、まずは拡張機能をzip化します。
「右クリック -> 圧縮」の操作でもzip化できますが、コマンド(黒い画面)でzip化する場合は以下の通りです。

まず拡張機能のディレクトリに移動します。 manifest.json を格納しているディレクトリが対象ディレクトリです。今回は path/to/extension-directory が対象ディレクトリであると仮定します。

cd path/to/extension-directory

次に対象拡張機能のディレクトリをzip化します。zipファイル名には任意の名前を指定します。
今回は extension-directory.zip とします。

zip -r extension-directory.zip path/to/extension-directory

2. 開発者用のGoogleアカウントを作成する

公式の説明によると、個人で普段使いしているアカウントではなく、開発者用アカウントを作成することが推奨されています。

We suggest using a new account just for your app instead of your personal account.

公式に従い、こちらのリンクからGoogleアカウントを新規作成します。
https://accounts.google.com/signup

3. Chromeウェブストアのデベロッパー登録をおこなう

もし普段使いしているGoogleアカウントでログインしている場合は、シークレットウィンドウを開くか、 Chromeのユーザー追加をおこないユーザーを切り替えるか、もしくは一度ログアウトします。

こちらのリンクから手順2で作成したGoogleアカウントにログインします。
https://accounts.google.com/signin/v2/identifier

ログイン後、こちらのリンクからChromeウェブストアのデベロッパー契約ページを開きます。
https://chrome.google.com/webstore/devconsole/register

「デベロッパー契約とポリシーを確認し、内容に同意します」にチェックします。
「登録料の支払い」ボタンをクリックします。(※ 登録料として1回限り$5支払う必要があります。)

クレジットカード情報を入力し、決済を進めます。

「登録を完了しました」という画面が表示されていれば、デベロッパー登録は完了です。

「デベロッパーダッシュボードを表示」ボタンをクリックし、ダッシュボードページを表示します。

(任意)黄色いメッセージは右上の×ボタンをクリックすると消すことができます。

4. 拡張機能のzipファイルをアップロードする

画面右の「新しいアイテム」ボタンをクリックします。

手順1で作成したzipファイルをアップロードします。
※ 注意事項が表示されていますが、アイコンが無くてもストア公開は自体は可能です。

注意事項: パッケージのアイコンをアプリの ZIP ファイルに含める必要があります。

アップロードが完了すると、「ストアの掲載情報」画面が表示されます。

5. 公開に必要なデータを入力またはアップロードする

zipファイルアップロード直後の状態では、「審査のための送信」ボタンが非活性になっておりクリックできません。

「公開できない理由」ボタンをクリックすると、エラーメッセージが確認できます。

左メニューの各項目を選択し、公開に必要なデータを入力またはアップロードする必要があります。

以下の作業1から3を繰り返しエラーを解消します。

「公開できない理由」ボタンをクリックし、エラーメッセージを確認する
必要なデータを入力する
「下書きとして保存する」ボタンをクリックする

実例

左メニュー各項目の入力する内容について、私がストア公開時に入力した内容を実例として紹介します。

ストアの掲載情報

説明

Amazon商品ページURLの不要な部分を取り除き、短いURLをクリップボードにコピーします。

リンク先記載の各国/地域のAmazonのWebサイトに対応しています。
https://www.amazon.co.jp/gp/navigation-country/

## 使用方法
1. ChromeでAmazon商品ページを表示します。
2. 商品ページの商品名の隣に「URLをコピーする」ボタンが追加されています。
3. 「URLをコピーする」をクリックするとURLがクリップボードにコピーされます。
4. Ctrl + v (Macの場合は command + v)で必要な箇所に貼り付けてください。

※ ここは公開後に失敗に気づきました。概要と説明に同じ文言を設定していたため、拡張機能の詳細ページにて二重に表示されました。

カテゴリ
- 仕事効率化
言語
- 日本語
スクリーンショット:
- ストア公開時の詳細ページに表示される画像です。
- 最低1枚必須のため、サイズ1280x800の画像を作成しアップロードしました。
プロモーションタイル（小）:
- Chromeウェブストアの検索結果に表示される画像です。
- この画面では必須項目の扱いではありませんがが、別の公式ページでは必須と説明されています。以下の記載を読み、私は「強く推奨する」だと理解しました。
  
  Note: Apps that don't have a small promotional image will be shown after apps that do have that image. If your app was published before the small promotional image was required, you should add that image so your app can be displayed more prominently.
- 最低限の設定で公開することを目的とし、初回バージョンの公開時にはアップロードしませんでした。

プライバシー

プライバシーで入力する内容は拡張機能の審査で利用される情報で、公開されません。

単一用途
- 説明
  - Amazon 商品ページURLから冗長な部分を取り除き、最小限の長さのURLをクリップボードにコピーします。
権限が必要な理由

拡張機能の manifest.json の記述内容により入力項目が変わります。私の場合は、ホスト権限, リモートコードが表示されました。
- ホスト権限:
  - 各国/地域のAmazonのWebサイトの商品ページで動作します。
- リモートコード:
  - いいえ、リモートコードを使用していません