【Chrome Extension】Twitterの画像を開く際にオリジナルサイズ版(:orig)にリダイレクトする(続)

前回の記事ではChrome Extensionを用いたリダイレクト処理を実装しましたが、本記事ではリダイレクト処理をブラウザのアドオンとして実行する方法を紹介します。

manifest.jsonの作成

Chrome Extensionで作成した処理を実行するため、拡張機能の情報を記載したmanifest.jsonを用意します。

{
　　"manifest_version": 2,
　　"name": "RedirectImgUrl",
　　"version": "1.0",
　　"permissions": [
　　　　"webRequest", 
　　　　"webRequestBlocking",
　　　　"https://pbs.twimg.com/media/*.jpg"
　　],
　　"background": {
　　　　"scripts": ["RedirectImgUrl.js"]
　　}
}

manifest_version: 
　現在のところ必ず2を指定します。
name: 
　アドオンの名称を指定します。
version: 
　アドオンのバージョンを指定します。
permissions: 
　アドオンで使用するExtensionのAPIや対象URLを指定します。
　今回はリダイレクトで使用したAPIとリダイレクト対象のURLを指定します。
　(詳細:Declare Permissions - Google Chrome)
background: 
　アドオンのスクリプトファイルを指定します。
　今回はリダイレクト処理を記載したRedirectImgUrl.jsを指定します。

 
これでマニフェストファイルの準備は完了です。
作成したマニフェストファイルはスクリプトファイルと同一ディレクトリに置きます。

 

Chromeでアドオンを読み込む

Chromeのアドレスバーに"chrome://extensions/"を入力し拡張機能の設定画面を開きます。
"デベロッパモード"を有効にし、"パッケージ化されていない拡張機能を読み込む" を選択し作成したアドオンの親フォルダを指定すると、自作アドオンが読み込まれた状態となります。

デベロッパモードを有効にした状態のため、ブラウザを再起動する毎に警告メッセージが表示されます。
解消するにはアドオンのパッケージ化が必要となりますが、本記事では割愛します。

Firefoxでアドオンを読み込む

Firefoxのアドレスバーに"about:debugging#addons"を入力しアドオン設定画面を開きます。
"一時的なアドオンを読み込む" を選択し作成したマニフェストファイルを指定すると、自作アドオンが読み込まれた状態となります。

一時的な読み込みのため、ブラウザを閉じると読み込みが解除されます。
常駐させるにはアドオンのパッケージ化が必要となりますが、本記事では割愛します。
(詳細:パッケージ化とインストール - Mozilla | MDN)

アドオンの動作を確認する

作成したアドオンが読み込まれた状態で、アドレスバーにtwimgの画像URLを指定します。 Enterを押すと…オリジナルサイズの画像(:orig)にリダイレクトされました。
タイムラインの画像を別タブで表示した場合も同様にリダイレクトされます。