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

もぐてっく

人は1つ歳を取る度、1ビットづつ大きくなれると信じてた。

Chromeで見てるページのURLをmikutterから投稿できるようにしたよ

mikutter Chrome

なにこれ?

古来、ブログとは、

狭義にはWorld Wide Web上のウェブページのURLとともに覚え書きや論評などを加えログ(記録)しているウェブサイトの一種である。「WebをLogする」という意味でWeblogウェブログ)と名付けられ、それが略されてBlog(ブログ)と呼ばれるようになった。(Wikipediaより)

であるからして、「マイクロブログ」と称されるTwitterのクライアントについてもWebブラウザとの密接な連携が不可欠なのである。

と、言うわけでChromeで見てるページのURLをmikutterから投稿できるようにしてみました。

インストール

GitHubからzipファイルをダウンロードして適当なディレクトリに展開して下さい。

GitHub - moguno/mikutter-webapi-hardpoint: Chromeとかと会話する用のWebAPIを提供する前提プラグイン。Chromeで今見てるページをmikutterのPostboxに入力するサンプル付き

※mikutterプラグインマネージャ"Packaged"で"moguno"を検索してインストールするのもおすすめですけどこれまだ動くんかな? ← ダメだったので直しました。

Chrome拡張のコンパイル

今回はChromeにボタンを追加するので、Chrome拡張のインストールを伴います。
大して手間じゃ無いのでソースだけ添付してユーザーさんにコンパイルしてもらうことにしました。
(バイナリの管理嫌い)

突然ですがここでニュースです(2016/3/5)

先日のChromeのアップデートから、野良拡張がインストール不能になりました。
セキュリティ上の都合だそうです。にゃあ。

仕方が無いので$5.00払って正式公開しました。

chrome.google.com

以下、せっかく頑張って書いたので残しておきます。
公開前のデバッグなどに有効な手順だと思います。

Chrome拡張ソースコードをどっかにコピーする。

アーカイブの中にあるchromeディレクトリをどこかにコピーしてください。
~/.mikutter以下だとChromeから見えなかったりするので。

chrome://extensionsを開いて、拡張機能タブを開く。

アドレスバーにchrome://extensionsと入力します。

f:id:moguno:20160221102100p:plain

こんな画面が出てくると思います。

f:id:moguno:20160221102353p:plain

デベロッパーモードを有効にする。

画面上部の「デベロッパーモード」を有効にしてください。

f:id:moguno:20160221102420p:plain

いくつかボタンが増えました。

f:id:moguno:20160221102500p:plain

拡張機能をパッケージ化する

増えたボタンから「拡張機能をパッケージ化...」ボタンを押下します。

f:id:moguno:20160221131729p:plain

ダイアログが出てくるので、先ほどのchromeディレクトリを指定して「拡張機能のパッケージ化」ボタンを押してください。

f:id:moguno:20160221102544p:plain

こんなメッセージが出ればOKです。

f:id:moguno:20160221102555p:plain

chromeディレクトリと同じ階層にchrome.crx、chrome.pem(今回使いません)ができています。

f:id:moguno:20160221132700p:plain

拡張のインストール

先ほどのchrome.pemをChrome拡張機能タブにドラッグアンドドロップします。
「ここにドロップすると、インストールされます」が表示されるエリアにポイっ!すると良いです。

f:id:moguno:20160221133029p:plain

やましいことは無いので、どうぞ「拡張機能を追加」ボタンを押してください。

f:id:moguno:20160221133139p:plain

無事インストールされて、みくったーちゃんボタンがツールバーに登録されたはずです。

f:id:moguno:20160221133242p:plain

使い方

これは!と思うページを見つけたら、みくったーちゃんボタンを押すだけです。

f:id:moguno:20160221133402p:plain

こんな感じでmikutterのポストボックスにタイトルとURLがコピーされます。
後は思う存分ふぁぼを稼いでください。

f:id:moguno:20160221133501p:plain

実は・・・、

Chromeとmikutterとの会話を実現するために、mikutterをWebサービス化すると言う技を今回考案しました。

mikutter-webapi-hardpointをインストールすると、mikutterにhttp://127.0.0.1:39080/testと言うエンドポイントが生えます。

Chromeのボタンを押すとhttp://127.0.0.1:39080/test?title=タイトル&url=URLをGETし、mikutterが受け取った情報をPostboxに挿入すると言う仕組みです。

このmikutterをWebサービス化する仕組みは他にも応用が効きそうなので、DSLを用意しました。

webapi DSL

Webサービスのエンドポイントを追加します。
req, resはそれぞれWEBrick::HTTPRequest、WEBrick::HTTPResponse オブジェクトとなっています。
ぶっちゃけWebrick::mount_proc()のラッパーなのでそっちを色々見てもらえれば。

今回のtestエンドポイントはこんな感じです。

webapi("test") { |req, res|
  message = ">#{req.query["title"].force_encoding("UTF-8")}\n#{req.query["url"].force_encoding("UTF-8")}\n"

  Plugin[:gtk].widgetof(Plugin::GUI::Postbox::cuscaded.values.first).post.buffer.text = message
}