Yabumi を 使ってみる & Yabumi の Chrome拡張 を書いた
この記事は,NCC Advent Calendar 2015 の 13日目 の記事です.
画像を簡単にアップロードして共有できる Yabumi を使ってみました.
なのですが...
矩形選択でキャプチャができません!
追記(2016/02/20):できるようになったそうです!
一方競合(?)のGyazoでは矩形選択キャプチャにも対応してます.
さて,YabumiにはAPIがあるわけですが,どうするかもうお分かりでしょう.
ないなら作りましょう!
まずは,API仕様からおさらいです.
https://yabumi.cc/api/images.json
にフォームデータとして送信するとJSONが返ってきます.
このとき,expiresAt
クエリで日付を送ると有効期限を決定できます(デフォルト:24時間)
一応null
を明示的に送ると[期限なし]も選択できるのですが,API仕様書にはしっかり書いてありません.
また,Yabumiにはアカウントというものがちゃんと存在していません.
同期キーというものをブラウザに紐付け,そのブラウザでEditURL
にアクセスすると,キーと画像が紐付きます.
なので,リクエストを飛ばしたあとはブラウザでURLを開く必要があります.
つぎは,矩形選択とかモロモロのChrome拡張を作るわけですが,そんなのをやっていたら時間がかかりますね.
OSSのちからを借りましょう.
実はGyazo Chrome ExtensionのコードはMITライセンスで公開されています.
さて,こいつをちょいと改変してやると良いわけですね!
(Gyazoの拡張って要素選択とかもできてかなり多機能です,すごいですね...)
それを使って作ったのがこちら!
3846masa/yabumi-chrome-extension
もうそのまんまですね,はい.
ちょっとだけ工夫した点を書いておきます.
- Gyazoの拡張内ではdataURLを送信する仕様
- 一方のYabumiはフォームデータとして画像を送る
- dataURLからBlobに変換してFormに突っ込む
- blob-utilを使いました
- 画像と同期キーを紐付けるために,アップロード後に透明iframeで表示
- これでコッソリ紐付けがされるわけです
そんなわけで,過去の画像が見れなくなってしまったGyazoからYabumiに移行中です.
実はGyazo拡張ベースにG00gle Photosへアップロードしたかったんですけど,それはまた機会があれば....
追伸:この記事は 2015年12月13日 23:40ぐらいから書き始めました.
おわり!