ほりひログ

所属組織の製品 (Azure とか) に関連する内容が多めだけど、個人の見解であって、所属組織を代表する公式情報ではないです。

見られたくないテキストを隠すChrome Extensionを作ってみた(作ってる)

Chrome Extensionに興味が湧いたからやってみた。
まだ申請中なので本当に公開できるかわからんけど、いつの日か公開できると信じて告知エントリー。

何ができるのか。

見てもらった方が早い。

デモ動画

解説

Webページ自体はどこでもいい。今回はChrome ExtensionのAPI reference

  • [0:00-0:07] :
    ページ内の API を確認。
    見えている範囲で3か所ほど。
  • [0:07-0:14] :
    この拡張機能でキーワード API を設定。
    -> 最初に確認したページ内の API がボケる
  • [0:20-0:30] :
    拡張機能にキーワード extension を追加設定。
    -> API に加えて extension もボケる。
    • extensions は最後の s 以外はボケる。
    • Extension は処理対象外。先頭の E が違うから。

何がうれしいのか。

デモやスクリーンショットで、自分のPCを他の人と共有する機会があると、うっかり見られちゃいけない情報が映っちゃうことがある。
クラウドサービスのポータル画面にはアカウントや環境を示すIDが表示されるし、Google検索の結果にはおおよその居住地情報、Amazonのトップページには郵便番号が表示される。

どのページで何を表示しているかをあらかじめ網羅するのは割と大変。
なので、危ないキーワードはあらかじめ指定しておいて、指定したキーワードがデモや講義/セミナーなどで画面を見せる時にうっかり映りこんだ時に勝手にぼかしておくと嬉しいのでは*1

そうでもない???

導入方法

試してみたい人は、Chromeウェブストア、またはEdge アドオンから。




となるとカッコいいが、まだ審査中なので公開できていない。

なので、今のところソースコードから直接インストールするしかない。

GitHubから

ここで公開中。

github.com

  1. GitHubリポジトリからソースコードをとってくる。
    git clone でもzipファイルのダウンロードでも好きな方で*2
  2. Chrome/Edgeで chrome://extensions を開く。
  3. とってきたソースコードを読み込む。
    1. Chrome
      デベロッパー モード を有効にして パッケージ化されていない拡張機能を読み込む をクリック。
    2. Edge
      開発者モード を有効にして 展開して読み込み をクリック。

Chromeウェブストアから

拡張機能の性格上、処理を特定のページに限定してないせいので「審査に時間かかるよ」という警告(ってほどじゃないけど)メッセージにひるまず申請したが、無事却下。

却下理由は「使ってない権限付けないで」とのこと。

ハイ、消し忘れです。
キチンと見てるらしい。すばらしい。

ちょうど、申請した後に見つけたバグをつぶしたり内部構成を変えたりしてて、一度キャンセルして申請し直そうか迷ってたので、いいタイミングの却下だった。
更新したバージョンで再申請中。

ここで公開されるとChromeとEdge、両方に入れられる。

Edgeアドオンから

最初の審査の結果はまだ来てなかったけど、Chromeウェブストアでの再申請に併せてこちらも取り下げ&再申請中。
ちなみに、Chromeウェブストアと同じ内容(処理を特定のページに限定してないせい)で申請したけど、特に注意/警告の類いはない。

あと、ここで公開した拡張機能はEdgeにしか入れられない。

ご意見・ご要望

GitHubリポジトリissuesからお願いします。
日本語の方がありがたい。

*1:人に画面を見せる機会が少ない人には需要はなさそう

*2:git cloneだとリポジトリの更新に合わせるのが楽かもしれない。まだまだバグ退治中なので。