読者です 読者をやめる 読者になる 読者になる

はしくれエンジニアもどきのメモ

情報・Web系技術の勉強メモ・備忘録です。

Firefox WebExtensions で動作するはてなブックマーク拡張機能を作ってみた

Chrome Firefox WebExtensions 拡張機能

Firefox WebExtensions で動作するはてなブックマーク拡張機能を作ってみた

WebExtensions の練習ということで、 はてなブックマーク拡張機能を作ってみたのでメモ。 といっても、active tab のURLを取ってきて、 はてなブックマーク追加ページを新規タブで表示するだけですが。

Github

xpiファイルをFirefox Dev版にドラッグしてインストール。

github.com

動作メモ

  1. background :

    background の chrome.browserAction.onClicked.addListener(func) で、アイコンのクリックを監視。
    browser_actionsのicon

    クリックされたら、content_scripts へsendMessageする。 content_scripts へは、chrome.runtime.sendMessage()ではなく、 chrome.tabs.sendMessage(tab_id, {}); を使う。

  2. content_scripts :

    matches で、 http://*/*https://*/* を指定しているので、それ以外のURIでは反応しない。

    active tab からURL を取得できたら、 はてなブックマーク追加ページ用のURLを生成する。

    contens_scripts では、新しいタブを生成できるchrome.tabs API が使えないので、 background へはてなブックマーク追加ページ用のURLを chrome.runtime.sendMessage({'url': url}); で送る。

  3. background :

    送られたmessage からはてなブックマーク追加ページ用のURLを取得。 chrome.tabs.create({'url': request.url}); で新しいタブを生成する。 この関数だけで新規タブが開かれる。
    はてなブックマーク追加ページ用の新規タブ