takaiwa.net

Android、Java、Web系、Linux、マラソン等の備忘録

2011/10/05

tumblrのアカウントをブックマークで切り替える

4 件のコメント
■2012/03/22 Thu追記:このブックマークは利用できません。経緯はコメント欄に
■2012/03/20 Tue追記:最近アカウントを切り替えられなくなってきました。このやり方はもう使えないのかな。。




最近始めたにわかタンブラーですが、早くも複数のアカウントを取得しました。何故複数かというと、料理のレシピを公開する用と、プログラミングのメモ用です。まぁ見る層が違うだろうと思って分けたのですが、マルチアカウントでログイン状態を維持するために、今までブラウザでアカウントを分けてました。例えば、料理用はChromeで投稿し、プログラミング用はFirefoxで投稿といった感じです。投稿したくなったら、その為にわざわざブラウザを開いてました。

tumblrの特徴として、面白いWebを見つけた場合などに引用して投稿することが多く、メインブラウザのtumblrアカウントと違うアカウントで投稿したい場合は、

  1. 別のtumblrアカウント用のブラウザを起動

  2. メインブラウザからURLをコピー

  3. ①のブラウザへ貼り付け(引用したい箇所が表示されるまで待つ)

  4. tumblrブックマークレットをクリックして引用投稿


何度もやれば、結構わずらわしい手数になってきます。これが、メインブラウザでログインしているアカウントで良いなら、ブックマークレットクリック一発ですみますして、もしメインブラウザでアカウントを手軽に切り替える事ができるなら、切り替える手数が増えるだけです。FirefoxならMultifoxという拡張機能があるのですが、これも結局ブラウザが一個増えるようなものです。というわけで、以下の前提条件でアカウントを切り替えられる方法を考えてみました。

前提条件



  • メインブラウザ:Opera

  • ブックマークレットを使って引用投稿したい


Screenshot_4
ブックマークレットの画面

そもそも、アカウントを切り替えるとは?


メインブラウザがOperaというのが、使ってる本人としてもなかなかやっかいですが、メインブラウザはなかなか変更できないということで。。
Opera Extensionsも探してみましたが、tumblrのアカウントを切り替える拡張機能は今の所ないようです。

で、前述したように、tumblr公式が提供しているブックマークレットが何気に使いやすい。というか、これ以外に特に使えそうな投稿方法は無いように思います。なんかあったら教えてください(-人-)

このブックマークレットは何を基に、アカウントを判断しているのか?もちろん、そのブラウザでtumblrへログインしたときに、ブラウザ内でログインを維持している情報ですね。具体的に言えばcookie情報で、以下のドメイン書かれているcookie情報に記録されています。

  • tumblr.com

  • www.tumblr.com


詳しいどの項目までは調べてませんが、例えばOpera(料理用)とChrome(プログラミング用)で別々のアカウントでログインしている場合、ブラウザの機能を使ってChromeのcookieをOperaへ書き込めば、Operaはプログラミング用のアカウントとして認識されます。とりあえず、上述ドメインの全項目をコピーしたらアカウントを切り替える事を確認できました。

さて、これを瞬時にどうやるか?プログラミングでやるには、セキュリティ的に好ましくないということで、cookieを直接触るのは断念。。。

要はボタン一つでアカウントが切り替わってくれればいいので、ボタン一つで目的のアカウントへログインしてくれればtumblrが勝手にcookieを書き換えてくれる。そのログインを自動化すれば良い!ということで、こんなHTMLを見つけました。
<form name="f" action="http://www.tumblr.com/login" method="post">
<input type="hidden" name="email" value="YOUR MAIL ADDRESS" />
<input type="hidden" name="password" value="YOUR PASSWORD" />
<input type="submit" value="login" />
</form>

このフォームにsubmit()をかけると、指定したメールアドレスのアカウントへログインしてダッシュボードを開いてくれます。。なんとも簡単。。

JavaScriptで自動ログインさせる


先ほどのformへ入力したURLパラメータにメールアドレスとパスワードを渡してログインするJavaScriptを作って見ました。
<html>
<head>
<script type="text/javascript">
function init() {
var url = location.search;
var params = url.split("?");
var username = null,password = null;
if(params.length > 1) {
var items = params[1].split("&");
var arry = new Array();
for(var i=0;i<items.length;i++) {
var data = items[i].split("=");
arry[data[0]] = data[1];
}

username = arry["e"];
password = arry["p"];

document.getElementById('disp').innerHTML = username + " でログイン中...";

var html ="";
html += '<form name="tumblr_login" action="https://www.tumblr.com/login" method="post">';
html += '<input type="hidden" name="email" value="'+username+'" />';
html += '<input type="hidden" name="password" value="'+password+'" />';
html += '</form>';

document.getElementById('tumblr_form').innerHTML = html;

document.tumblr_login.submit();
}
}
</script>
</head>
<body onLoad="init();">

<div id="disp"></div>
<div id="tumblr_form"></div>
</body>
</html>

これをどっか、ローカルに保存しておいてURLを次のように記述します。
file://localhost/D:/tumblrlogin.html?e=YOUR MAIL ADDRESS&p=YOUR PASSWORD

この例(Windows)では、D:\tumblrlogin.htmlに先ほどのコードを保存しています。URLを叩くとページのロードと同時にログインを開始しますが、これをブックマークしておけば、そのブックマークのクリック一つでアカウントが切り替わります。もちろん、クリック後はtumblrのダッシュボードまで表示されますが。。

次に、このブックマークをコピーして、プロパティのメールアドレスとパスワードを書き換えれば別のアカウントへログインできるブックマークが作成できます。

もっとシンプルに。。


上記は流れを見やすくにと、改版しやすいようにということで掲載しましたが。ブックマークに追加して利用するならブックマークレットのようにプロパティに直接JavaScriptが書いてある方が良いだろうということで、こちらの方が良いかもしれません。
javascript:var d=document,u="YOUR MAIL ADDRESS",p="YOUR PASSWORD";d.open();d.write('<form name="tumblr_login" action="https://www.tumblr.com/login" method="post">');d.write('<input type="hidden" name="email" value="'+u+'" />');d.write('<input type="hidden" name="password" value="'+p+'" />');d.write('</form>');d.close();d.tumblr_login.submit();

上記のメールアドレスとパスワードを任意のものに書き換え、ブックマークのプロパティのアドレス欄に記述すればおk

WS000258

おわりに。。


ブラウザでアカウントを分けていたのは、ログイン情報を個別に保持させているメリット以外にも、誤って別のアカウントに投稿してしまう誤爆を防止するためですが、ブックマークとなるとその危険性は増します。Opera ExtensionsでtumblrのAPIとか使って、ポップアップに写真などを入れてビジュアル的にわかりやすくアカウントを切り替えられる拡張機能を作ろうと思いましたが、それより、こちらの方が遙かにシンプルで、どうせ切り替えた時にダッシュボードが表示されるので、断念しました。まぁ、どっちでログインしたか勘違いしてる時はアウトですね。。。

2011/10/03

Eclipseから直接ファイルをサーバへアップロードするプラグイン

0 件のコメント

IDEではEclispseが慣れているということで、PHPやJavaScriptなどの編集はAptana Studeio 3を使っていますが、標準で装備しているFTPの機能が凄く便利です。 

WS000226

FTPでサーバのファイルをツリー構造で表示し、ファイルをダブルクリックすると直接編集でき、Ctrl + Sで保存すると、サーバのファイルが更新されます。別途FTPソフトを立ち上げて、ディレクトリをたどってファイルをアップロードする手間が省けます。上図ではプロジェクトは1つだけですが、複数のプロジェクトを入れておけば、プロジェクト単位ですぐにサーバのファイルへアクセスできますし、何より、以前のプロジェクトのファイルを流用したいなと思ったら、Aptana上でドラッグ&ドロップですぐに参照できます。

何気ない事ですが、IDEとは別にエクスプローラやFTPソフトを起動して、ディレクトリをたどって同じ事を何回もやるのに比べたらかなり効率的だと思います。

Eclipse IDE for Java Developersでも同様にサーバのファイルを直接触りたい!と思っていたのですが、PHPやJavaScriptと違って、Javaの場合はコンパイルが必要。。サーバのソースファイルを編集したところでサーバのソースをコンパイルしなきゃ動かない。当たり前の事ですが。。Linuxのサーバなので、やろうと思えばsambaのディレクトリをネットワークドライブなどに割り当てて、Eclipseでそこへクラスファイルを吐くようにしても良いのですが、クラウドサーバを想定した場合に、あまり現実的なやり方ではない。。

ということで、クライアントマシンでコンパイルして生成したクラスファイルなりJARファイルなりをEclipseから直接アップロードできたらいいなということで、Aptanaと同じ(プラグインとして配布されている)ものをEclipseに入れてみました。


[環境]

  • Eclipse IDE for Java Developers (Version: Indigo Service Release 1)

 

[プラグインのURL]

http://download.aptana.org/tools/studio/plugin/install/studio

[Help]→[Install new software]

Install画面の[Add]ボタンで先ほどのURLを入力し、適当な名前を付けて[OK]ボタンを押下

WS000232

そうすると、中断あたりに利用可能なものが表示されます。

 WS000233

FTPの機能だけ入れたかったのですが、それだけだと起動時にエラーが出るので、[Select All]でAptanaまるごとインストールすることにします。Nextボタンを押下していって、インストールを開始。
インストールが終わると、リスタートを要求してくるので、Eclipseを再起動させます。

クラスファイルをアップしみます。

[Window]→[Show View]→[Navigator]でNavigatorを表示させ、binフォルダのクラスファイルで右クリックします。

WS000241 

[File Transfer]→[Add New Connection]でConnection Manager画面を開きます。

WS000242

  • Name:適当な名前
  • Source:Projectを選択
  • Destination:Newボタンを押下

WS000244

  • Site Name:適当な名前
  • Server:サーバのIPアドレスか、ホスト名を入力
  • Username:FTPのユーザ名
  • Password:FTPのパスワード

[Browse]ボタンを押下して、アップロード先を選択

WS000246


それぞれ[OK]ボタンを押して、画面を閉じる。そうすると、もう一度右クリックした時にFile Transferの中に有効になっている項目があるので、Uploadを選択。

WS000247

確認画面が出るので、

WS000248

[Yes]を押下すると、アップロード完了の画面が表示されるので、

WS000249

[OK]ボタンを押下。これでアップロード完了!(※binディレクトリごと)