2014年6月25日水曜日

スクラップブックマーク



はてなブックマークのjavascriptをお気に入りに登録させてしまう仕様をみて


ほーそんなこともできるんですね。


灯台下暗しといいますか、クリック一発で登録の手軽さをこういった形で実現してしまうとはさすがです。


そこで、新発見があったのですから応用して、スクラップブック(本文中の記事だけを取得する)用に


出来ないかと考えてみました。


FireFox用



<a href='javascript:
var h = window.document.getElementById("bkmark");
if(!h){
var f=window.document.createElement("form");
f.method="POST";
f.target="bkmark";
f.action="○○○.php");
f.innerHTML="<input type=\"hidden\" name=\"doc\" id=\"bkmark\"><input type=\"hidden\" name=\"title\" id=\"bkmark_title\"><input type=\"hidden\" name=\"url\" id=\"bkmark_url\">";

var ifr=window.document.createElement("iframe");
ifr.name="bkmark";
ifr.width=0;
ifr.height=0;

window.document.body.appendChild(f);
window.document.body.appendChild(ifr);
h = document.getElementById("bkmark");
}
h.value = escape(window.getSelection().getRangeAt(0)) || "";
window.document.getElementById("bkmark_title").value = escape(document.title);
window.document.getElementById("bkmark_url").value = escape(location.href);
if(h.value){f.submit();}
void(0);
'>スクラップブックマーク(FireFox用)</a>



上記のURLをはてなブックマークと同じように、ブラウザのお気に入りに登録します。


始めは、XMLHttpRequest を使っていたのですが、別ドメインへのアクセスが出来ないことが


すぐにわかり(使う前に気がつけよ。。。)断念しました。


はてなブックマークは、local.href でGETでタイトルとURLを送っていましたが


データを一方的に送信するだけでよいので、iframe枠内に見えないところでPOST送信することにしました。


(一番下に黒いぽちがでてますけど。。。)


スクラップブックで長めの文章を送るとなるとGETではバイト数が足りなくなる場合があるからです。





指定の文章の取得には、window.getSelection().getRangeAt(0) 


でマウスで選択したテキスト部分をPHPプログラムへ送信します。


PHP側は、適当に DBに保存するなり、ファイルに書き出すなりして


後で自分で確認できるように作っておけば良いかと思います。


IEの場合は、window.getSelection().getRangeAt(0) の代わりに


(window.document.selection.createRange())[0]  を使えばできるような気がします。(試してません)


自分のサイト以外でこういったJavascriptを実行させるテクニックは面白いですね。


(FireFoxのアドオンとかは基本的にこれなんですけどね。。。気がつけよ。。。)


Greasemonkeyとかがなぜ流行るのかようやくピント来た気がします(遅)





0 件のコメント: