はてなブックマークを便利にするブックマークレット作成を試みたが

f:id:syunki-gt:20161105205628j:plain
　今日は久々に技術系っぽい記事を書きたいなと思い、はてなブックマークをより便利にするブックマークレットを作ろうと試みました。

　試みたんですが、凝ったものからスタートした割に、二転三転してシンプルなものに落ち着きました。

　途中で調べて使おうとした技術とか、完成したものについて書いてみたいと思います。では、いってみよー。

作ろうとしたもの、できたもの

　最初は、ブックマークレット（お気に入りのリンクを押すと動作する仕組み）ではてブできる何かを作ろうとしました。

　ブックマークレットを押すとページが出てきて、そこでコメントを書き込んだらはてブができるとかですね。

　ですが、はてブのAPIではAuth認証が必要っぽくて、挫折しました。

　で、結局完成したのは、

　はてブを表示

　これです。ソースは、

javascript:window.open('http://b.hatena.ne.jp/entry/'+location.href);

　これ。

　使い方を知らなかったら、

www.lifehacker.jp

　ここを読んでみてください。

　はてなブックマークを確認したかったり、付けたいページでこの「はてブを表示」を押すと、そのページのはてなブックマークページにジャンプします。まだブクマが付いてなかったら新しいページに、付いていれば過去のコメントとかも見れるページに行きます。

　ちょっとだけ便利じゃないかなと思いますが、どうでしょう？

調べたらすでにあるし

　やろうと思ってたことですが、調べたらすでに公式で用意してありました。

www.hatena.ne.jp

　作るまでもなかったですね＾＾；

　今回私が作ったほうもたぶん探せばいろんなところにあると思いますが、まぁいいということにします。

　ブックマークレットは結構いろんな面白いことが出来るので、「こういうのがあればな」ってアイデアもらったら作ってみますよ。実現可能かはものによると思いますが！

使おうとした技術

複数行を変数に代入する方法

kimizuka.hatenablog.com

　最初に作ろうとした時に、ダブルクォーテーションとシングルクォーテーションが入り混じった文字列を変数に代入したくなり、調べて発見したのがこちらです。

var txt = (function(param) {return param[0].replace(/\n|\r/g, "");})`
<script type="text/javascript">
function post() {
	var comment = 'test';
	
	// 以下続く
}
</script>`;

　こんな風なことが可能です。

Ajaxでxmlをポスト

　最初ははてなブックマーク APIにAjaxで投げようとしていたので、どうやったらポストできそうか調べていました。

$.ajax({
	type: 'POST',
	url: 'http://b.hatena.ne.jp/atom/post',
	data: '<entry xmlns="http://purl.org/atom/ns#">
  <title>dummy</title>
  <link rel="related" type="text/html" href="http://www.example.com/" />
  <summary type="text/plain">サンプルコメントです</summary>
</entry>',
	contentType: "text/xml",
	dataType: "xml",
	cache: false,
	crossDomain: true,
	success: function(data, textStatus){
		alert(data);
	},
	error: function(data, textStatus) {
		alert(textStatus);
	}
});