Web上の画像をクリック一発ではてなフォトライフにアップロードできるChrome拡張を作りました

Web上の画像をブログで利用したい時、はてなブロガーであればはてなフォトライフをお使いだと思います。

はてなブロガーに限らずはてなフォトライフに画像を保存している方もいるでしょう。いるよね?いや、いない?


はてなフォトライフに目的の画像をアップロードするためには当然ですが次の手順が必要です。

  1. 自分のPCに画像をダウンロード
  2. はてなフォトライフに画像をアップロード


これを「いちいち自分のPCに保存するの面倒くさくない?」と思うのは、自堕落を極めた社会不適合者エンジニアとしての性でしょう。そう、面倒くさい。

だからこのちょっとした面倒臭さを解消するChrome拡張機能を作ってみました。

はてなフォトライフアップローダー』です。

chrome.google.com

今回はこちらの拡張機能をご紹介させていただきます。なおご利用の際は必ず注意点をお読みください。

はてなフォトライフアップローダー』でできること

はてなフォトライフアップローダー』を使うとWeb上の画像を自分のPCにダウンロードすることなく、クリック一発ではてなフォトライフへ画像をアップロードすることができます。

それだけ!面倒臭がりさんに向けた拡張機能です。

使い方

インストール

Chromeウェブストアからインストールします。 chrome.google.com

はてなidAPIキーの設定

インストールが完了するとChromeツールバーの右端にこんな感じのアイコンが現れます。 はてなフォトライフアップローダーのアイコン

このアイコンをクリックするとダイアログが表示されるのでそれぞれ設定しましょう。 はてなフォトライフアップローダーの設定ダイアログ

  • はてなid:自分のはてなidです。

  • APIキー:はてなブログ管理画面の「設定」→「詳細設定」に表示されるAPIキーを設定します。 はてなAPIキーの確認画面

  • はてなフォトライフの保存フォルダ:アップロード先のフォルダ名を設定します。設定をしない場合はデフォルトでトップフォルダに格納されます。

これで設定は完了です。

画像を右クリックしてアップロードする

あとは目的の画像を右クリック→「はてなフォトライフへアップロード」をクリックするだけです。 はてなフォトライフアップローダーの実行

一応ポップアップでお知らせします。 はてなフォトライフアップローダー実行中のダイアログ

はてなフォトライフアップローダーの完了ダイアログ

はてなフォトライフアップローダーの仕組み

次の注意点にもつながりますが、このChrome拡張の仕組みを簡単に示します。

はてなフォトライフアップローダーの仕組

  1. Webサイト上の画像をお使いのPCに取得します。(※http/httpsリクエストでのデータ取得。PC上には保存されません。)
  2. はてなidAPIキーを暗号化し、1.で取得した画像データとともに開発者(私)のサーバに送信します。
  3. 開発サーバが受け取ったはてなidAPIキーを利用して、ユーザのはてなフォトライフに画像データをアップロードします。

なお受け取った情報(はてなidAPIキー・画像データ)は開発サーバ上には一切保存されません。

注意点

以下の点を理解したうえでご利用ください。

  • 開発者(私)が個人的に運用するサーバにより機能を提供しており、事前予告無く機能が停止する可能性があります。
  • はてなidおよびAPIキーはHTTPSで暗号化され開発サーバに送信されていますが、万が一他者にこれらの情報が漏れた場合にも当方では一切の責任を負いません。


その他お気づきの点などあればコメント、twitterでご連絡ください。

はてなブログカスタマイズガイド―HTML & CSSで「はてなブログ」を次のステッ

はてなブログカスタマイズガイド―HTML & CSSで「はてなブログ」を次のステッ