URLスキームを利用してChromeとTumblrをアプリ連携させる

Tumblr公式のブックマークレットって使いにくくない?

iPhoneChromeからTumblrにPostするときに、Tumblr公式のブックマークレットを使っている人は多いと思う。

だけど、これを使うとポップアップのブロックがいちいち出てくるし、

image

Postするページがスマホ用じゃないから使いにくい。

image

Tumblrアプリを開いてコピペしてしまうこともあるが、アプリの切り替えがめんどくさい。

そこで、URLスキームを利用して、ChromeからTumblrアプリを開いてPostできるようにしてみた。
さらに、PostしたらTumblrアプリからChromeに戻れるように、x-callback-urlを利用する。
これでアプリの切り替えのためにホームボタンを押したりスワイプで選んだりといった操作をしなくてもよくなる。

URLスキームについては、知っておくとiPhoneをもっと便利に使える「URLスキーム」とは? - たのしいiPhone! AppBankでわかりやすく説明されている。
有名なのでランチャーアプリなどで使っている人も多い。

Launch Center Pro - Icon Maker

Launch Center Pro - Icon Maker

  • Contrast
  • 仕事効率化
  • 無料

x-callback-urlについては、アプリ間連携の仕組み x-callback-url が簡単に使えるライブラリ | Cocoaの日々情報局で詳しく説明されている。
簡単に言えば、「コールバック用URLスキームを指定できる」仕組み。

また、TumblrのURLスキームは、tumblr/TMTumblrSDK · GitHubに一覧がある。

ブックマークレットを作った

「リンクをPostする」用と「引用をPostする」用の2種類作った。

リンクをPostするブックマークレット(登録用リンク)

javascript:window.location='tumblr://x-callback-url/link?title='+encodeURIComponent(document.title+'%5Cn')+'&url='+encodeURIComponent(location.href)+'&description=&x-success=googlechrome://&x-cancel=googlechrome://'

引用をPostするブックマークレット(登録用リンク)

javascript:window.location='tumblr://x-callback-url/quote?quote=&source='+encodeURIComponent(location.href)+'&x-success=googlechrome://&x-cancel=googlechrome://'

それぞれ適当な名前(Post Tumblr (Link)とか)でブックマークしておく。

使ってみる

TumblrにPostしたいページでこのブックマークレットを使うと、Tumblrアプリの投稿画面が開く。

image

リンクをPostする場合

image

引用をPostする場合

image

後はいつも通り説明や引用文を書いて、[投稿]または[キャンセル]をタップすると、Chromeアプリに戻れる。
ここでx-callback-urlを利用している。

こんな感じで結構使いやすくなったと思う。
今後、Chromeからよく使う他のアプリ用のブックマークレットも作っていく予定。