<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>ku</title>
	<atom:link href="http://ido.nu/kuma/feed/" rel="self" type="application/rss+xml" />
	<link>http://ido.nu/kuma</link>
	<description></description>
	<lastBuildDate>Mon, 30 Jan 2012 03:39:52 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>mitmproxyを使ってSSL通信の中身を確認する</title>
		<link>http://ido.nu/kuma/2012/01/29/how-to-use-mitmproxy/</link>
		<comments>http://ido.nu/kuma/2012/01/29/how-to-use-mitmproxy/#comments</comments>
		<pubDate>Sun, 29 Jan 2012 03:36:25 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[iPhone]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/2012/01/30/how-to-use-mitmproxy/</guid>
		<description><![CDATA[MacでiPhone上で行われている通信の内容を調べたい。HTTPのときはWiresharkで見られるけれどSSLのときはCharlesでもできるらしいけど、ちょっとだけ使うには少し高めなのでmitmproxyを使います。mitmproxy &#8211; SSL interceptionに書いてあるSSLでの使い方をそのままやるだけでできます。
インストール
wget http://mitmproxy.org/download/mitmproxy-0.6.tar.gz &#124; tar xf
cd mitmproxy-0.6
sudo python setup.py install

curl http://excess.org/urwid/urwid-1.0.1.tar.gz &#124; tar xf -
sudo python setup.py install

OSX 10.7だと問題なくインストールできたけど10.6の場合urwidのインストールで
lipo: can&#8217;t open input file: /var/tmp//cc5eveXg.out (No such file or directory)

と言われて失敗するので[Urwid] Build problem with urwid-0.9.9.2.tar.gz on Mac OS X 10.6.8に従って
sudo env ARCHFLAGS="-arch i386" python  setup.py install
とします。
iPhone側設定
次にmitmproxyを信用してもらうためにiPhoneに証明書をインストールします。
証明書の転送
一度/usr/local/bin/mitmproxyを実行して起動して生成された証明書をiPhone実機に転送します。mitmproxyを起動すると~/.mitmproxyディレクトリにmitmproxy-ca.pemという名前の証明書ができているので、これをメールに添付してiPhoneに送ります。

メールアプリで添付ファイルを開くとprovisioning profileのインストールと同じ画面が出てきます。

このときロックスクリーンにパスワードをかけているとそのパスワードを聞かれます。はじめ何のパスワードなのかわからなくて困りました。
WiFiのproxy設定
[設定]→[WiFi]→OSXで共有設定したネットワークの詳細ボタンでproxyの設定をします。mitmproxyのデフォルトは8080ですが、ここでは1080に変えています。

起動
iPhone側の設定が終わったらOSXでmitmproxyを起動します。ポートを変えたので-pオプションでポートを指定しています。
sudo mitmproxy -p 1080
このときsudoで起動しないとドメインごとの動的な証明書の生成ができないようでEvent log(mitmproxy起動時にvを押すと出る画面)に
SSL routines:SSL_CTX_use_certificate_chain_file:PEM lib
と出てきてブラウザが繋がりませんでした的なエラーを出して表示してくれません。mitmproxyがSSLの証明書を生成できないのでSSLコネクションが確立できないけれどTCPレベルでは繋がっている状態です。
つないでみる
proxyの設定を反映させるためにMobileSafariを一度終了させます。再度起動してテストとしてhttp://www.google.com/につなぎました。
そうすると送っているリクエストのリストが出てきて

↑↓でリクエストを選んでReturnで詳細が表示されます。

Tabを押すとレスポンスが表示されます。

前の画面に戻るにはqです。
pythonでスクリプトを書いてサーバから受け取ったレスポンスを書き換えてクライアントに渡したりもできて、それによってiOS上で動いているアプリのUIWebViewにweinreを流しこんでインタラクティブにハックすることができるようになります。時間なくなったので帰ったら書く。
]]></description>
			<content:encoded><![CDATA[<p>MacでiPhone上で行われている通信の内容を調べたい。HTTPのときは<a href="http://www.wireshark.org/">Wireshark</a>で見られるけれどSSLのときは<a href="http://www.charlesproxy.com/">Charles</a>でもできるらしいけど、ちょっとだけ使うには少し高めなので<a href="http://mitmproxy.org/">mitmproxy</a>を使います。<a href="http://mitmproxy.org/doc/ssl.html">mitmproxy &#8211; SSL interception</a>に書いてあるSSLでの使い方をそのままやるだけでできます。</p>
<h3>インストール</h3>
<pre><code>wget http://mitmproxy.org/download/mitmproxy-0.6.tar.gz | tar xf
cd mitmproxy-0.6
sudo python setup.py install

curl http://excess.org/urwid/urwid-1.0.1.tar.gz | tar xf -
sudo python setup.py install
</code></pre>
<p>OSX 10.7だと問題なくインストールできたけど10.6の場合urwidのインストールで</p>
<blockquote><p>lipo: can&#8217;t open input file: /var/tmp//cc5eveXg.out (No such file or directory)
</p></blockquote>
<p>と言われて失敗するので<a href="http://lists.excess.org/pipermail/urwid/2011-July/001091.html">[Urwid] Build problem with urwid-0.9.9.2.tar.gz on Mac OS X 10.6.8</a>に従って</p>
<pre><code>sudo env ARCHFLAGS="-arch i386" python  setup.py install</code></pre>
<p>とします。</p>
<h3>iPhone側設定</h3>
<p>次にmitmproxyを信用してもらうためにiPhoneに証明書をインストールします。</p>
<h4>証明書の転送</h4>
<p>一度<code>/usr/local/bin/mitmproxy</code>を実行して起動して生成された証明書をiPhone実機に転送します。mitmproxyを起動すると<code>~/.mitmproxy</code>ディレクトリに<code>mitmproxy-ca.pem</code>という名前の証明書ができているので、これをメールに添付してiPhoneに送ります。<br />
<img src="http://ido.nu/kuma/wp-content/uploads/2012/01/IMG_11862.jpg" height="320" width="213" hspace="4" vspace="4" alt="Img 1186" class="border block" /><br />
メールアプリで添付ファイルを開くとprovisioning profileのインストールと同じ画面が出てきます。<br />
<img src="http://ido.nu/kuma/wp-content/uploads/2012/01/IMG_11822.jpg" height="320" width="213" hspace="4" vspace="4" alt="Img 1182" class="border block" /><br />
このときロックスクリーンにパスワードをかけているとそのパスワードを聞かれます。はじめ何のパスワードなのかわからなくて困りました。</p>
<h4>WiFiのproxy設定</h4>
<p>[設定]→[WiFi]→OSXで共有設定したネットワークの詳細ボタンでproxyの設定をします。<code>mitmproxy</code>のデフォルトは8080ですが、ここでは1080に変えています。<br />
<img src="http://ido.nu/kuma/wp-content/uploads/2012/01/IMG_11841.jpg" height="320" width="213" hspace="4" vspace="4" alt="Img 1184" class="border block" /></p>
<h3>起動</h3>
<p>iPhone側の設定が終わったらOSXで<code>mitmproxy</code>を起動します。ポートを変えたので<code>-p</code>オプションでポートを指定しています。</p>
<pre><code>sudo mitmproxy -p 1080</code></pre>
<p>このとき<code>sudo</code>で起動しないとドメインごとの動的な証明書の生成ができないようでEvent log(<code>mitmproxy</code>起動時に<code>v</code>を押すと出る画面)に<br />
<blockquote>SSL routines:SSL_CTX_use_certificate_chain_file:PEM lib</p></blockquote>
<p>と出てきてブラウザが繋がりませんでした的なエラーを出して表示してくれません。<code>mitmproxy</code>がSSLの証明書を生成できないのでSSLコネクションが確立できないけれどTCPレベルでは繋がっている状態です。</p>
<h3>つないでみる</h3>
<p>proxyの設定を反映させるためにMobileSafariを一度終了させます。再度起動してテストとして<code>http://www.google.com/</code>につなぎました。</p>
<p>そうすると送っているリクエストのリストが出てきて<br />
<img src="http://ido.nu/kuma/wp-content/uploads/2012/01/mitmproxy_list2.png" height="238" width="535" hspace="4" vspace="4" alt="Mitmproxy List" class="border block" /><br />
↑↓でリクエストを選んで<code>Return</code>で詳細が表示されます。<br />
<img src="http://ido.nu/kuma/wp-content/uploads/2012/01/mitmproxy_detail2.png" height="174" width="605" hspace="4" vspace="4" alt="Mitmproxy Detail" class="border block" /><br />
<code>Tab</code>を押すとレスポンスが表示されます。<br />
<img src="http://ido.nu/kuma/wp-content/uploads/2012/01/mitmproxy_response2.png" height="202" width="540" hspace="4" vspace="4" alt="Mitmproxy Response" class="border block" /><br />
前の画面に戻るには<code>q</code>です。</p>
<p>pythonでスクリプトを書いてサーバから受け取ったレスポンスを書き換えてクライアントに渡したりもできて、それによってiOS上で動いているアプリのUIWebViewに<a href="http://phonegap.github.com/weinre/">weinre</a>を流しこんでインタラクティブにハックすることができるようになります。時間なくなったので帰ったら書く。</p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2012/01/29/how-to-use-mitmproxy/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>javascript vs PHP 速度比較</title>
		<link>http://ido.nu/kuma/2011/08/22/javascript-vs-php-speed-comparison/</link>
		<comments>http://ido.nu/kuma/2011/08/22/javascript-vs-php-speed-comparison/#comments</comments>
		<pubDate>Sun, 21 Aug 2011 21:20:16 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[javascript]]></category>
		<category><![CDATA[node.js]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1825</guid>
		<description><![CDATA[はじめに
WebKit, Chrome, Firefox, Operaでjavascriptのスピードアップ合戦を繰り広げている結果そのへんのLightweight programing languageより速くなっているのではないか、という予測におおまかな数字を与えるために測ったものです。本当にどちらが速いのかはHTTPサーバ・データベース・アプリケーションによるので、これはあくまでどの程度なのかを知るためのものです。
ユースケース
友だちが100人ずついるAさんとBさんの共通の友だちを探します。データベースから持ってきたレコードを手動でjoinする処理です。今回は言語の実行速度のみを知りたいのでデータベースから持ってくる部分は測る時間に含めていません。
速度を意識した実装はしないで、普段書いているような記述にしています。評価環境はmacBookPro&#8221;15 2.4GHz Core i5 です。
javascript
node.js 0.4.11を使いました。だいたい2.9秒。
function virtual_friends() {
	var friends = [];
	while (friends.length &#60; 100) {
		var n = Math.floor(Math.random()*10000);
		if (!friends.some(function (v) {return v === n})) {
			friends.push({user_id:n});
		}
	}
	return friends;
}
var a = virtual_friends();
var b = virtual_friends();

var starts = Date.now();
	for (var i = 0; i &#60; 100 * 1000; i++) {
		var user_id_key_table_a = {};
		a.forEach(function (u) [...]]]></description>
			<content:encoded><![CDATA[<h3>はじめに</h3>
<p>WebKit, Chrome, Firefox, Operaでjavascriptのスピードアップ合戦を繰り広げている結果そのへんのLightweight programing languageより速くなっているのではないか、という予測におおまかな数字を与えるために測ったものです。本当にどちらが速いのかはHTTPサーバ・データベース・アプリケーションによるので、これはあくまでどの程度なのかを知るためのものです。</p>
<h3>ユースケース</h3>
<p>友だちが100人ずついるAさんとBさんの共通の友だちを探します。データベースから持ってきたレコードを手動でjoinする処理です。今回は言語の実行速度のみを知りたいのでデータベースから持ってくる部分は測る時間に含めていません。</p>
<p>速度を意識した実装はしないで、普段書いているような記述にしています。評価環境はmacBookPro&#8221;15 2.4GHz Core i5 です。</p>
<h4>javascript</h4>
<p>node.js 0.4.11を使いました。だいたい2.9秒。</p>
<pre><code>function virtual_friends() {
	var friends = [];
	while (friends.length &lt; 100) {
		var n = Math.floor(Math.random()*10000);
		if (!friends.some(function (v) {return v === n})) {
			friends.push({user_id:n});
		}
	}
	return friends;
}
var a = virtual_friends();
var b = virtual_friends();

var starts = Date.now();
	for (var i = 0; i &lt; 100 * 1000; i++) {
		var user_id_key_table_a = {};
		a.forEach(function (u) {
			user_id_key_table_a[u.user_id] = true;
		});

		var friends_in_common = [];
		b.forEach(function (u) {
			if (u.user_id in user_id_key_table_a) {
				friends_in_common.push(u);
			}
		});
	}
var ends = Date.now();
console.log((ends - starts) / 1000);
</code></pre>
<h4>PHP</h4>
<p>PHP 5.3.4を使いました。だいたい3.25秒。</p>
<pre><code>&lt;?php
function virtual_friends()
{
	$friends = array();
	while (count($friends) &lt;  100) {
		$n = rand(1, 10000);
		$m = array_search($n, $friends);
		if ($m === false) {
			$friends[] = array(
				'user_id' =&gt; $n
			);
		}
	}
	return $friends;
}
$a = virtual_friends();
$b = virtual_friends();

$starts = microtime(true);
	for ($i = 0; $i &lt; 100 * 1000; $i++) {
		$user_id_key_table_a = array();
		foreach ($a as $u) {
			$user_id_key_table_a[$u['user_id']] = true;
		}

		$friends_in_common = array();
		foreach ($b as $u) {
			if (isset($user_id_key_table_a[$u['user_id']])) {
				$friends_in_common[] = $u;
			}
		}
	}
$ends = microtime(true);

print $ends - $starts;
</code></pre>
<h3>考察</h3>
<p>というわけで、これだけではなんとも言えませんが、この例ではjavascript(node.js/V8)のほうが速かったです。この例はV8のJITが効きまくるのが明らかなのでV8に有利すぎる設定なのかもしれません。</p>
<p>この共通の友だちを探すのは一般的なウェブアプリケーションのロジックの中では例外的にCPU intensiveな処理で、実際のアプリケーションでコードを見てみたところ大半はDBから持ってきた変数をテンプレートエンジンにセットするだとか、JITの効かなそうな処理が多かったです。それでもnode.jsインスタンスがずっと動いているなら二度目のリクエストからはJITの恩恵に預かれるのかもとか、そんなことを考え始めるときりがないのでこのへんで。</p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2011/08/22/javascript-vs-php-speed-comparison/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Androidで画像がぼやけるのはなんで</title>
		<link>http://ido.nu/kuma/2011/01/03/why_images_are_blured_on_android_browser/</link>
		<comments>http://ido.nu/kuma/2011/01/03/why_images_are_blured_on_android_browser/#comments</comments>
		<pubDate>Sun, 02 Jan 2011 18:24:06 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[android]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1813</guid>
		<description><![CDATA[画像の1ピクセルが実際のデバイス上で何ピクセルとしてレンダリングされるかを示す-webkit-device-pixel-ratioという値があります(この値はwebkit系であればwindow.devicePixelRatioに入っています)。
iPhone4ではこの値が2になっていて、今まで通りに画像を表示させると自動的に拡大されてなんかぼんやりしたかんじになってしまいます。
これを避けるには、実際に表示させたいサイズの2倍のピクセルサイズのものを用意して、でも縦横を1/2にして表示させると画像の1ピクセルとデバイスの1ピクセルが1:1対応になって拡大されることなく表示されるようになります。
で、日本のキャリアが販売している多くのandroid端末でこのdevicePixelRatioが1.5になっています。意味わかんない。

画面を写真に撮ったものなのでわかりにくいですが、上が45&#215;100ピクセルの画像をそのまま45&#215;100ピクセルで表示したもの。下は90&#215;200ピクセルの画像を45&#215;100ピクセルで表示したものです。上はなんか滲んでますが下はきれいに表示されています(ぼんやりしてるのは写真だから)。
身近にあった端末でdevicePixelRatioを調べたところ以下のとおり。



端末
devicePixelRatio


IS02
1.5


IS03
2


xperia
1.5(たぶん)


SH-03C(LYNX 3D)
1.5


005SH
1.5


001HT(Disire HD)
1.5


001DL
1


004HW
1



というわけで表示させたいピクセル数の1.5/2倍のサイズで画像を用意して表示すればぼんやりしないです。

追記
Philosophical Games: Customize Android Browser Scaling with target-densityDpi
WebView &#124; Android Developers
&#60;meta name="viewport" content="width=device-width; target-densitydpi=device-dpi" /&#62;でデバイスの1ピクセルに画像の1ピクセルが表示されるようになります(そのぶんページ全てがちっちゃく表示されます)。 via Twitter / shogo: @ku これかな http://darkforge. &#8230;
]]></description>
			<content:encoded><![CDATA[<p>画像の1ピクセルが実際のデバイス上で何ピクセルとしてレンダリングされるかを示す<var>-webkit-device-pixel-ratio</var>という値があります(この値はwebkit系であれば<var>window.devicePixelRatio</var>に入っています)。<br />
iPhone4ではこの値が2になっていて、今まで通りに画像を表示させると自動的に拡大されてなんかぼんやりしたかんじになってしまいます。</p>
<p>これを避けるには、実際に表示させたいサイズの2倍のピクセルサイズのものを用意して、でも縦横を1/2にして表示させると画像の1ピクセルとデバイスの1ピクセルが1:1対応になって拡大されることなく表示されるようになります。</p>
<p>で、日本のキャリアが販売している多くのandroid端末でこの<var>devicePixelRatio</var>が<em>1.5</em>になっています。意味わかんない。<br />
<img class="border block" src="http://ido.nu/kuma/wp-content/uploads/2011/01/lynx.png" alt="Lynx" hspace="4" vspace="4" width="519" height="388" /><br />
画面を写真に撮ったものなのでわかりにくいですが、上が45&#215;100ピクセルの画像をそのまま45&#215;100ピクセルで表示したもの。下は90&#215;200ピクセルの画像を45&#215;100ピクセルで表示したものです。上はなんか滲んでますが下はきれいに表示されています(ぼんやりしてるのは写真だから)。</p>
<p>身近にあった端末で<var>devicePixelRatio</var>を調べたところ以下のとおり。</p>
<table border="0">
<tbody>
<tr>
<td>端末</td>
<td>devicePixelRatio</td>
</tr>
<tr>
<td>IS02</td>
<td>1.5</td>
</tr>
<tr>
<td>IS03</td>
<td>2</td>
</tr>
<tr>
<td>xperia</td>
<td>1.5(たぶん)</td>
</tr>
<tr>
<td>SH-03C(LYNX 3D)</td>
<td>1.5</td>
</tr>
<tr>
<td>005SH</td>
<td>1.5</td>
</tr>
<tr>
<td>001HT(Disire HD)</td>
<td>1.5</td>
</tr>
<tr>
<td>001DL</td>
<td>1</td>
</tr>
<tr>
<td>004HW</td>
<td>1</td>
</tr>
</tbody>
</table>
<p>というわけで表示させたいピクセル数の1.5/2倍のサイズで画像を用意して表示すればぼんやりしないです。</p>
<div class="note">
<h3>追記</h3>
<p><a href="http://darkforge.blogspot.com/2010/05/customize-android-browser-scaling-with.html">Philosophical Games: Customize Android Browser Scaling with target-densityDpi</a><br />
<a href="http://developer.android.com/reference/android/webkit/WebView.html">WebView | Android Developers</a></p>
<p><code>&lt;meta name="viewport" content="width=device-width; target-densitydpi=device-dpi" /&gt;</code>でデバイスの1ピクセルに画像の1ピクセルが表示されるようになります(そのぶんページ全てがちっちゃく表示されます)。 via <a href="http://twitter.com/os0x/status/21647304477900800">Twitter / shogo: @ku これかな http://darkforge. &#8230;</a></div>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2011/01/03/why_images_are_blured_on_android_browser/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flashのことを笑っている場合じゃない</title>
		<link>http://ido.nu/kuma/2010/05/04/stop-laughing-at-flash/</link>
		<comments>http://ido.nu/kuma/2010/05/04/stop-laughing-at-flash/#comments</comments>
		<pubDate>Tue, 04 May 2010 06:08:04 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[log]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1804</guid>
		<description><![CDATA[Web開発の現状を25のトゥウィートで斬るとこうなる–iPhoneを見捨てたFacebookデベロッパの告白のはなし。
Apple vs Adobeで大揉めしてみんなに楽しい娯楽を提供してくれているけれど、我々ウェブ開発者(というのは大雑把すぎるくくりだけれど)にとってはFlashなんてはなから選択肢に入っていないのだから単なるゴシップでしかない。
でもJoe Hewittの話はひとごとではない。
彼は10年前の2001年にcanvasを実装し[canvas]、Firebugを作り[firebug]、facebookのiPhone向けWeb版を作り、facebookのiPhoneアプリを作りセットでいろんなiPhoneアプリで使われてるthree20を作り、Appleの身勝手にうんざりしてiPhoneアプリはもうやらないと宣言してた。
彼のいまのウェブに対する見方はこのふたつのtweetに集約されてる。

I&#8217;ve always preferred the web, but native platforms have been kicking its ass. I go where the power is.
Twitter / Joe Hewitt: @sprynmr I&#8217;ve always prefe &#8230;


Hopefully we&#8217;ll look back on today as the day the mobile web began to eclipse proprietary mobile platforms. Still a ways to go, though.
Twitter / Joe [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://jp.techcrunch.com/archives/20100430joe-hewitt-web-development/">Web開発の現状を25のトゥウィートで斬るとこうなる–iPhoneを見捨てたFacebookデベロッパの告白</a>のはなし。</p>
<p>Apple vs Adobeで大揉めしてみんなに楽しい娯楽を提供してくれているけれど、我々ウェブ開発者(というのは大雑把すぎるくくりだけれど)にとってはFlashなんてはなから選択肢に入っていないのだから単なるゴシップでしかない。</p>
<p>でも<a href="http://twitter.com/joehewitt">Joe Hewitt</a>の話はひとごとではない。<br />
彼は10年前の2001年にcanvasを実装し<sup class="footnote"><a href="#canvas">[canvas]</a></sup>、Firebugを作り<sup class="footnote"><a href="#firebug">[firebug]</a></sup>、facebookのiPhone向けWeb版を作り、facebookのiPhoneアプリを作りセットでいろんなiPhoneアプリで使われてる<a href="http://github.com/facebook/three20">three20</a>を作り、Appleの身勝手にうんざりしてiPhoneアプリはもうやらないと宣言してた。</p>
<p>彼のいまのウェブに対する見方はこのふたつのtweetに集約されてる。</p>
<blockquote><p>
I&#8217;ve always preferred the web, but native platforms have been kicking its ass. I go where the power is.</p>
<p><a href="http://twitter.com/joehewitt/status/13032980959">Twitter / Joe Hewitt: @sprynmr I&#8217;ve always prefe &#8230;</a>
</p></blockquote>
<blockquote><p>
Hopefully we&#8217;ll look back on today as the day the mobile web began to eclipse proprietary mobile platforms. Still a ways to go, though.</p>
<p><a href="http://twitter.com/joehewitt/status/13031002283">Twitter / Joe Hewitt: Hopefully we&#8217;ll look back &#8230;</a>
</p></blockquote>
<p>いつだってウェブのほうが好きだけど、今はネイティブアプリがきてる。自分はパワーのあるところに行く。<br />
いつか今日が独占的モバイルプラットフォームをモバイルウェブが侵食し始めた日だったって振り返れたらいいね。まだまだ先そうだけど。</p>
<h3>the web sucks</h3>
<p>TechCrunchには載ってなかったけどHewittがtwitterで紹介していた <a href="http://sachin.posterous.com/the-web-sucks">The web sucks. Browsers need to innovate &#8211; Sachin&#8217;s Posterous</a> この記事は秀逸だ。いかにブラウザを基盤としたウェブアプリがだめで、ネイティブプラットホーム上のアプリが優れているかについて細かく例を挙げて教えてくれる。(日本語でも読めるよ <a href="http://d.hatena.ne.jp/mirakui/20100504/1272958906">PosterousのCEO「Webはクソ。ブラウザはマジなんとかしろ」 &#8211; 床のトルストイ、ゲイとするとのこと</a>)</p>
<p>そして現実にiPhoneユーザの多くは普段ネイティブのアプリを利用していて、ウェブアプリを使っていることは稀だ。twitterやgmailはiPhone向けに最適化されたウェブページを持っているが一体誰がそれを使っているだろうか？ ネイティブアプリは文字通りなんでもできる(Appleがダメだということを除いて)。ウェブアプリにはブラウザでできることしかできない。<br />
いままでウェブ開発者はブラウザでできないことはできないのだと無意識に思い込んでいたけれど、iPhoneアプリがコンピュータにはなんだってできるんだということを思い出させてくれたはずだ。アプリで写真をとって位置情報つきでサーバにアップロードするみたいな今となっては当たり前のようにやっていることができないし、後で読むためのフィードデータをバックグラウンドでデータをダウンロードして保存しておくことはウェブアプリでもできるけどネイティブアプリと比較するとパフォーマンスが悪すぎる。</p>
<p>これからの主戦場である(既にそうだ)モバイルプラットホームでウェブ/ウェブアプリはユーザに選ばれなくなって、代わりにネイティブのアプリケーションに時間が費やされている。</p>
<p>スティーブジョブズはiPhoneにFlashを載せない理由として<a href="http://www.apple.com/hotnews/thoughts-on-flash/">Thoughts on Flash</a>で&#8221;中間層がイノベーションを阻害するから&#8221;だと言った。それは&#8221;Flashを載せないため&#8221;の理由でしかないだろう。Flashのことは我々には関係ない。でもHTMLだってプラットホーム上にある中間層であり、イノベーションについていけてない(=阻害している)のはFlashと同じだ。</p>
<p>この一連の話が気になったのは、まえに似たようなことを思ったからだ。<br />
2008年の12月にiPhoneのアプリを書いてたときにこう書いてた。</p>
<blockquote><p>
なるほど、ウェブの時代は終わって再びソフトウェアの時代が帰ってきたのだ。</p>
<p><a href="http://ku.tumblr.com/post/64968773">not enough memory</a>
</p></blockquote>
<h3>余談</h3>
<p>ウェブアプリケーションだけがウェブじゃないみたいな話は <a href="http://benward.me/blog/understand-the-web">Understand The Web · Ben Ward</a> に書かれてました。</p>
<p><a href="http://sachin.posterous.com/the-web-sucks">The web sucks. Browsers need to innovate &#8211; Sachin&#8217;s Posterous</a>に</p>
<blockquote><p>People are using apps more because the experience is much better. We will see a decline in web traffic and search in the coming years</p></blockquote>
<p>というくだりがあってはっとさせられるもののそんなでもないんじゃないかと思うけど、でも既にGoogleはちゃんとAndroid+AdMobを持っている。</p>
<h3>参考</h3>
<ol class="footnote">
<li id="canvas"><a href="http://twitter.com/joehewitt/status/13099010823">Twitter / Joe Hewitt: While waxing nostalgic, I &#8230;</a><br />
 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=102285">Bug 102285 – create xul canvas tag for custom painting control</a></li>
<li id="firebug"><a href="https://addons.mozilla.org/ja/firefox/addon/1843">Firebug :: Add-ons for Firefox</a></li>
</ol>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2010/05/04/stop-laughing-at-flash/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>GoogleChromeの拡張を作る上でFirefoxアドオン作者が知っておくべきやればできること</title>
		<link>http://ido.nu/kuma/2009/12/15/all-firefox-addon-devs-should-know-how-tos/</link>
		<comments>http://ido.nu/kuma/2009/12/15/all-firefox-addon-devs-should-know-how-tos/#comments</comments>
		<pubDate>Tue, 15 Dec 2009 14:01:01 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[Firefox]]></category>
		<category><![CDATA[chrome]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1778</guid>
		<description><![CDATA[GoogleChromeの拡張を作る上でFirefoxアドオン作者が知っておくべき10の違い【GoogleChromeでニコ動拡張を作ってみた感想】 &#8211; love_firefoxportableの日記についてMySpaceのMP3ファイルにID3tagを埋め込みつつダウンロードするJSActionsスクリプトを作ったあたりからFirefoxアドオンの柔軟さに魅了されていろいろ作ってきたけどChromeのUIのブロックしなさが快適でChromeにスイッチしようとしている人間が書きます。
将来にわたってChromeのextensionでFirefox addonのような自由度が実現されるようなことはないと思いますが、それでも今の段階でやればできることもちょっとあります。大半はできないけど。
右クリックはいじれない
いじれません。このへんまだ実装自体がやっつけな感じなので将来的にはいじれるようになるんじゃないかと思ってます。
API Wish List (The Chromium Projects)にも載っています。

補足 2009.12.16

Context menu is potentially on the M5 list.
Exposing Chrome Extensions APIs to DOM UI. &#8211; Chromium-dev &#124; Google Groups

だそうなので来年前半には実装されそうです。

データのダウンロード保存はできない
chromeのダウンローダでダウンロードすることはできませんが、どうしてもダウンロードしたければNPAPI pluginを作ればできます。
クリップボードの操作はできない

補足 2010.1.7
execCommandで可能です。
Twitter / utatane: Chromeのcopyは, たしか, 隠しinput &#8230;

NPAPI pluginを作ればできます。(ex. chromeでMake LinkみたいにページのHTMLリンクをコピるCreateLink « ku)
通常NPAPI pluginを使うと通常のウェブページからもpluginの昨日にアクセスできてしまいますが、chromeのNPAPI pluginはextensionのオリジンからだけ有効にすることができるオプションがあります。これによってobjectタグを通じて通常のウェブページからは利用できないけれどextensionからは使える関数を用意することができます。
ただ現状プラットフォームごとにべつべつのバイナリを用意することができなくて、ぜんぶおんなじバイナリを読み込むのでターゲットのプラットホーム以外で読み込むとクラッシュしたりします(公式リリースではextensionはwindowsでしか動かないことになっているので問題ないといえば問題ないんでしょうけど&#8230;)。これは中の人もちょう怒ってました。Extensions and the Mac &#8211; Chromium-dev &#124; Google Groups
ブラウザの通信に対してフックをかけることはできない
できません。
が、Extensions API proposal: access to [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://d.hatena.ne.jp/love_firefoxportable/20091214/1260801125">GoogleChromeの拡張を作る上でFirefoxアドオン作者が知っておくべき10の違い【GoogleChromeでニコ動拡張を作ってみた感想】 &#8211; love_firefoxportableの日記</a>について<a href="http://ido.nu/kuma/2007/08/07/jsactions-script-download-and-implant-id3tag-myspace-mp3-file/">MySpaceのMP3ファイルにID3tagを埋め込みつつダウンロードするJSActionsスクリプト</a>を作ったあたりからFirefoxアドオンの柔軟さに魅了されていろいろ作ってきたけどChromeのUIのブロックしなさが快適でChromeにスイッチしようとしている人間が書きます。</p>
<p>将来にわたってChromeのextensionでFirefox addonのような自由度が実現されるようなことはないと思いますが、それでも今の段階でやればできることもちょっとあります。大半はできないけど。</p>
<h4>右クリックはいじれない</h4>
<p>いじれません。このへんまだ実装自体がやっつけな感じなので将来的にはいじれるようになるんじゃないかと思ってます。<br />
<a href="http://dev.chromium.org/developers/design-documents/extensions/apiwishlist">API Wish List (The Chromium Projects)</a>にも載っています。</p>
<div class="note">
<h4>補足 2009.12.16</h4>
<blockquote cite="http://groups.google.com/group/chromium-dev/msg/5ac86399448c0b6e" title="Exposing Chrome Extensions APIs to DOM UI. - Chromium-dev | Google Groups"><p>
Context menu is potentially on the M5 list.<br />
<cite><a href="http://groups.google.com/group/chromium-dev/msg/5ac86399448c0b6e">Exposing Chrome Extensions APIs to DOM UI. &#8211; Chromium-dev | Google Groups</a></cite>
</p></blockquote>
<p>だそうなので来年前半には実装されそうです。
</p></div>
<h4>データのダウンロード保存はできない</h4>
<p>chromeのダウンローダでダウンロードすることはできませんが、どうしてもダウンロードしたければNPAPI pluginを作ればできます。</p>
<h4>クリップボードの操作はできない</h4>
<div class="note">
<h3>補足 2010.1.7</h3>
<p><code>execCommand</code>で可能です。<br />
<a href="http://twitter.com/Constellation/status/7188365498">Twitter / utatane: Chromeのcopyは, たしか, 隠しinput &#8230;</a>
</div>
<p>NPAPI pluginを作ればできます。(ex. <a href="http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/">chromeでMake LinkみたいにページのHTMLリンクをコピるCreateLink « ku</a>)<br />
通常NPAPI pluginを使うと通常のウェブページからもpluginの昨日にアクセスできてしまいますが、chromeのNPAPI pluginはextensionのオリジンからだけ有効にすることができるオプションがあります。これによってobjectタグを通じて通常のウェブページからは利用できないけれどextensionからは使える関数を用意することができます。</p>
<p>ただ現状プラットフォームごとにべつべつのバイナリを用意することができなくて、ぜんぶおんなじバイナリを読み込むのでターゲットのプラットホーム以外で読み込むとクラッシュしたりします(公式リリースではextensionはwindowsでしか動かないことになっているので問題ないといえば問題ないんでしょうけど&#8230;)。これは中の人もちょう怒ってました。<a href="http://groups.google.com/group/chromium-dev/browse_thread/thread/45c7682e688213c2/a6846464c036ef44?show_docid=a6846464c036ef44">Extensions and the Mac &#8211; Chromium-dev | Google Groups</a></p>
<h4>ブラウザの通信に対してフックをかけることはできない</h4>
<p>できません。<br />
が、<a href="http://groups.google.com/group/chromium-extensions/browse_thread/thread/fb8c1f28c4a63670">Extensions API proposal: access to the HTTP request &#8211; Chromium-extensions | Google Groups</a>で作りたいっていってdesign docを書いてる人がいたのでできるようになるかもしれません。書かれたのは3ヶ月前でその後音沙汰ないですが&#8230;</p>
<h4>DOM構築前のデータを弄ることはできない</h4>
<p>できません。これってFirefoxだとどうやったら実現できるのか知りたいです！</p>
<h4>ブラウザの下部に新しくツリーボックスを作る等、ブラウザの構造を変えることはできない</h4>
<p>できません。ここはFirefoxの奇跡だと思っています。</p>
<p>昔Netscape社でNavigator6を作り、今はChromeの開発をしている<a href="http://en.wikipedia.org/wiki/Ben_Goodger">Ben Goodger</a>さんの<a href="http://www.bengoodger.com/2009/12/google-chrome-extensions/">millennium | Google Chrome Extensions</a>を読むと、もともとFirefoxのextensionでブラウザ自体のUIをいじれるようになっているのは意図して設計されたわけではなかったと書かれています。Navigatorの内部で使うためのAPIをハックしてUIをカスタマイズできることが発見されて、それが人気があったので長い年月を経て生き残り、現在のようなextensionにまで成熟したと書かれています。</p>
<blockquote><p>If this “back door” into browser customization hadn’t existed by virtue of Netscape’s componentized install, it’s not necessarily a given that Firefox would _ever_ have had extensions. Think about that. It’s awesome that it did, because it’s a feature users love.</p></blockquote>
<p>Firefox extensionの自由さは偶然から生まれて今に至るのです。</p>
<h4>外部exeを実行することはできない</h4>
<p>NPAPI pluginでできます。</p>
<h4>XMLHttpRequestはクロスドメイン制限を受ける（content_scriptsの場合）</h4>
<p>これはいちおうbackground pageからきるけどreferrerがつけられないことが大きな制約として残るだろうと<a href="http://twitter.com/Constellation/status/6238496071">Constellationさんが言っていました</a>。が、NPAPI pluginでやればなんでもできます。</p>
<h4>content_scripts内のjsからlocalStorageにアクセス出来ない</h4>
<p>バグな気もします。Greasemonkeyとは名前空間の分離の仕方が違うことに起因してます。Chromeでどうやって分離しているかはAaronのブログに図解があります。 <a href="http://www.aaronboodman.com/2009/04/content-scripts-in-chromium.html">aaronboodman.com &#8211; Aaron Boodman&#8217;s work blog</a></p>
<h4>javascript1.6とか1.7とか1.8は無い</h4>
<p>1.6の範囲はchromeでもサポートされています。個人的にはE4Xがサポートされてないのが辛いです。でもこのへんはFirefoxでしか使えないのでFirefoxが勝手(?)に色々つけくわえてるという印象が&#8230;</p>
<h4>拡張を大量にぶちこんでも重くならない</h4>
<p>FirefoxのUIがブロックする=重たい印象になってると思われるのでFirefoxでもelectrolysisでかなり改善されるんじゃないかと思っています。</p>
<p>たしかにChromeは拡張の量が増えてもUIは重くなりませんが、絶対的に重くならないなんてことは当然なくて、たくさんインストールするとレンダリング終了までにかかる時間は長くなるという結果がパフォーマンステストから示されています。<br />
<a href="http://groups.google.com/group/chromium-dev/browse_thread/thread/72c636095b3cafc7/">Extensions performance data &#8211; Chromium-dev | Google Groups</a></p>
<h3>結論</h3>
<ul>
<li>Chromeでサポートされていないけど欲しいものはNPAPI pluginを使って自分で作ればいろいろできるようになります。NPAPI pluginを作るのは面倒ですが<a href="http://code.google.com/p/nixysa/">nixysa</a>を使うと少しは楽に開発できるらしいです。いまのところnixysaを利用してWindowsで動くバイナリを作るにはハックしてモノにする必要があります。そのハックはネイティブのアプリケーション開発に詳しくないと難しかんじです(<a href="http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/">CreateLink</a>はふつうに手で書いて作りましたが、その時バージョンストリングなどが入ったリソースファイルをリンクしないとchromeがpluginとして認識してくれないという謎現象に遭遇しました)。</li>
<li>Firefoxアドオンの自由度は奇跡的です。<a href="http://www.bengoodger.com/2009/12/google-chrome-extensions/">millennium | Google Chrome Extensions</a>を読んでその奇跡を噛み締めましょう。</li>
</ul>
<h3>所感</h3>
<p>自分も「GoogleChromeマジ神wwwwwwwwFirefox（笑）」な人を見るとアホかと思いますが、実際のところ大半の人は現在のChromeの貧弱なAPIでできる範囲の拡張でほとんど困らないんだと思います。</p>
<p>それはたまたまなわけでもなくてAaron Broodmanが書いているように</p>
<blockquote cite="http://www.aaronboodman.com/2009/04/content-scripts-in-chromium.html" title="aaronboodman.com - Aaron Boodman's work blog"><p>Here&#8217;s an interesting factoid about browser extensions: lots of them are not about extending the browser at all. By my count, about 75% of the this week&#8217;s top 20 Firefox extensions are more about extending the web content rendered by the browser than extending the browser itself.<br />
<cite><a href="http://www.aaronboodman.com/2009/04/content-scripts-in-chromium.html">aaronboodman.com &#8211; Aaron Boodman&#8217;s work blog</a></cite>
</p></blockquote>
<p>AMO上位20拡張のうち75%はGreasemonkeyでできることしかやっていない現実を反映しているだけなんでしょう。たしかに自分も職場のWindowsマシンのChromeには<a href="https://chrome.google.com/extensions/detail/aeolcjbaammbkgaiagooljfdepnjmkfd">AutoPatchWork</a>しか入っていません。そしてこのExtensionはGreasemonkeyでできる範囲のことしかやっていません。実際AutoPatchWorkの祖先である<a href="http://userscripts.org/scripts/show/8551">AutoPagerize</a>はGreasemonkeyのスクリプトです。</p>
<p>ただ予め意図されているようなextensionしか作れないChromeに押され、極めて柔軟で大半のことは実現できるFirefox extensionの開発者が減っていけば、ブラウザの使い方が均質化して行き、ひいてはウェブ上でのサービスの進化が鈍ってしまうのではないかという恐れを感じます。</p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2009/12/15/all-firefox-addon-devs-should-know-how-tos/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>pearのHTTPプロキシ設定</title>
		<link>http://ido.nu/kuma/2009/12/15/pear-http-proxy-setting/</link>
		<comments>http://ido.nu/kuma/2009/12/15/pear-http-proxy-setting/#comments</comments>
		<pubDate>Tue, 15 Dec 2009 07:03:29 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[PEAR]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1775</guid>
		<description><![CDATA[借りてるサーバでpearが全然動かない。
% sudo pear install HTTP_Client
No releases available for package "pear.php.net/HTTP_Client"
Cannot initialize 'channel://pear.php.net/HTTP_Client', invalid or missing package file
Package "channel://pear.php.net/HTTP_Client" is not valid
install failed

よくわからないままchannel-updateしても動かない。
% sudo pear channel-update pear.php.net
audit_log_user_command(): Connection refused
Updating channel "pear.php.net"
Cannot retrieve channel.xml for channel "pear.php.net" (Connection to `172.20.25.95:18080' failed: Connection timed out)

困ってソースを見ているうちにpearにPEAR/Config.phpという設定ファイルっぽいものがあるのを知った。
それならばその設定を見るオプションがあると考え探すとpear config-showで見られることが分かった。
% pear config-show
Configuration (channel pear.php.net):
=====================================
Auto-discover new Channels     auto_discover  [...]]]></description>
			<content:encoded><![CDATA[<p>借りてるサーバでpearが全然動かない。</p>
<pre><code>% sudo pear install HTTP_Client
No releases available for package "pear.php.net/HTTP_Client"
Cannot initialize 'channel://pear.php.net/HTTP_Client', invalid or missing package file
Package "channel://pear.php.net/HTTP_Client" is not valid
install failed
</code></pre>
<p>よくわからないままchannel-updateしても動かない。</p>
<pre><code>% sudo pear channel-update pear.php.net
audit_log_user_command(): Connection refused
Updating channel "pear.php.net"
Cannot retrieve channel.xml for channel "pear.php.net" (Connection to `172.20.25.95:18080' failed: Connection timed out)
</code></pre>
<p>困ってソースを見ているうちにpearにPEAR/Config.phpという設定ファイルっぽいものがあるのを知った。<br />
それならばその設定を見るオプションがあると考え探すと<code>pear config-show</code>で見られることが分かった。</p>
<pre><code>% pear config-show
Configuration (channel pear.php.net):
=====================================
Auto-discover new Channels     auto_discover    &lt;not set&gt;
Default Channel                default_channel  pear.php.net
<span class="em-color">HTTP Proxy Server Address      http_proxy       http://172.20.25.95:18080/
</span>PEAR server [DEPRECATED]       master_server    pear.php.net
Default Channel Mirror         preferred_mirror pear.php.net</code></pre>
<p>無効なproxyが設定されていた。</p>
<pre><code>% sudo pear config-set http_proxy ""
config-set succeeded</code></pre>
<p>これで解決。pearが使えるようになった。</p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2009/12/15/pear-http-proxy-setting/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>chromeでMake LinkみたいにページのHTMLリンクをコピるCreateLink</title>
		<link>http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/</link>
		<comments>http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/#comments</comments>
		<pubDate>Thu, 10 Dec 2009 14:45:17 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[chrome]]></category>
		<category><![CDATA[extension]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1766</guid>
		<description><![CDATA[
Twitterにページのリンクを貼るときや、ブログを書くときにFirefoxではMake Linkというアドオンを使うと右クリックのメニューから選ぶだけでテキスト+URLや
chromeでMakeLinkみたいにページのHTMLリンクをコピるCreateLink « ku http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/
HTMLのリンクをクリップボードに作ってくれます。
&#60;a href=&#8221;http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/&#8221;&#62;chromeでMakeLinkみたいにページのHTMLリンクをコピるCreateLink « ku&#60;/a&#62;
そのchrome版を作りました。NPAPIを使っているのでwindowsでしか動きません。
インストール
Google Chrome Extensions: Create Link
コード
ku&#8217;s CreateLink at master &#8211; GitHub
余談
クリップボードにデータを転送する部分はちぎってほかのextensionから使うことができるので、クリップボードを使いたいときにはご利用ください(ただデータをセットできることしか必要なかったのでそれしか実装してません)。
予定

NPAPIはChrome Galleryのレビューを通過できるのか試してみます
ほんもののMakeLinkのようにフォーマットをカスタマイズできるようにしたいです

]]></description>
			<content:encoded><![CDATA[<p><img src="http://ido.nu/kuma/wp-content/uploads/2009/12/createlink.png" height="320" width="489" hspace="4" vspace="4" alt="Createlink" class="border block" /></p>
<p>Twitterにページのリンクを貼るときや、ブログを書くときにFirefoxでは<a href="https://addons.mozilla.org/ja/firefox/addon/142">Make Link</a>というアドオンを使うと右クリックのメニューから選ぶだけでテキスト+URLや</p>
<blockquote><p>chromeでMakeLinkみたいにページのHTMLリンクをコピるCreateLink « ku http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/</p></blockquote>
<p>HTMLのリンクをクリップボードに作ってくれます。</p>
<blockquote><p>&lt;a href=&#8221;http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/&#8221;&gt;chromeでMakeLinkみたいにページのHTMLリンクをコピるCreateLink « ku&lt;/a&gt;</p></blockquote>
<p>そのchrome版を作りました。<del>NPAPIを使っているのでwindowsでしか動きません。</del></p>
<h3>インストール</h3>
<p><a href="https://chrome.google.com/extensions/detail/gcmghdmnkfdbncmnmlkkglmnnhagajbm">Google Chrome Extensions: Create Link</a></p>
<h3>コード</h3>
<p><a href="http://github.com/ku/CreateLink">ku&#8217;s CreateLink at master &#8211; GitHub</a></p>
<h3>余談</h3>
<p>クリップボードにデータを転送する部分はちぎってほかのextensionから使うことができるので、クリップボードを使いたいときにはご利用ください(ただデータをセットできることしか必要なかったのでそれしか実装してません)。</p>
<h3>予定</h3>
<ul>
<li>NPAPIはChrome Galleryのレビューを通過できるのか試してみます</li>
<li>ほんもののMakeLinkのようにフォーマットをカスタマイズできるようにしたいです</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2009/12/10/create-html-link-with-createlink-for-chrome-like-makelink/feed/</wfw:commentRss>
		<slash:comments>16</slash:comments>
		</item>
		<item>
		<title>ManualPatchWorkを使って手動でAutoPatchWorkにページをロードさせる</title>
		<link>http://ido.nu/kuma/2009/12/10/force-autopatchwork-to-load-next-page-manually-with-manualpatchwork/</link>
		<comments>http://ido.nu/kuma/2009/12/10/force-autopatchwork-to-load-next-page-manually-with-manualpatchwork/#comments</comments>
		<pubDate>Thu, 10 Dec 2009 13:02:54 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[chrome]]></category>
		<category><![CDATA[extension]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1759</guid>
		<description><![CDATA[
補足
Chrome Keyconfigでも手動でロードできます。

日経ビジネスオンラインの記事のようにフッタが異常に長くて本文の最後まで読んでもAutoPatchWorkが次のページを読み込んでくれないようなサイトでJを押したら手動で次のページを読み込むことができるchrome extensionをつくりました。
インストール
manualpatchwork.crx

こんなかんじで本文よりもフッタのほうが長いページでもJを押したら次のページがロードされます。

はじめREMAIN_HEIGHTで判断するのをやめてnextLinkとpageElementの位置関係とスクロール状態から次のページをロードするかどうか決めれば自動でできないかと思ったけど本文の下にリンクが有るとは限らないのとnextLinkがpageElementの中に入ってたりすることもあるので無理そうでした。
]]></description>
			<content:encoded><![CDATA[<div class="note">
<h3>補足</h3>
<p><a href="https://chrome.google.com/extensions/detail/okneonigbfnolfkmfgjmaeniipdjkgkl">Chrome Keyconfig</a>でも手動でロードできます。
</div>
<p><a href="http://business.nikkeibp.co.jp/article/topics/20091001/206099/">日経ビジネスオンラインの記事</a>のようにフッタが異常に長くて本文の最後まで読んでも<a href="https://chrome.google.com/extensions/detail/aeolcjbaammbkgaiagooljfdepnjmkfd">AutoPatchWork</a>が次のページを読み込んでくれないようなサイトで<code>J</code>を押したら手動で次のページを読み込むことができるchrome extensionをつくりました。</p>
<h3>インストール</h3>
<p><a href="/kuma/files/manualpatchwork.crx">manualpatchwork.crx</a></p>
<p><img class="block" src="http://ido.nu/kuma/wp-content/uploads/2009/12/before.png" alt="Before" hspace="4" vspace="4" width="753" height="628" /><br />
こんなかんじで本文よりもフッタのほうが長いページでも<code>J</code>を押したら次のページがロードされます。</p>
<p><img class="block" src="http://ido.nu/kuma/wp-content/uploads/2009/12/after.png" alt="After" hspace="4" vspace="4" width="753" height="628" /></p>
<p>はじめ<code>REMAIN_HEIGHT</code>で判断するのをやめて<code>nextLink</code>と<code>pageElement</code>の位置関係とスクロール状態から次のページをロードするかどうか決めれば自動でできないかと思ったけど本文の下にリンクが有るとは限らないのと<code>nextLink</code>が<code>pageElement</code>の中に入ってたりすることもあるので無理そうでした。</p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2009/12/10/force-autopatchwork-to-load-next-page-manually-with-manualpatchwork/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTTP::Request::Commonでsjisをエスケープしたパラメータにゴミが入る</title>
		<link>http://ido.nu/kuma/2009/11/25/sjis-string-is-garbled-in-httprequestcommon/</link>
		<comments>http://ido.nu/kuma/2009/11/25/sjis-string-is-garbled-in-httprequestcommon/#comments</comments>
		<pubDate>Wed, 25 Nov 2009 03:06:53 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[perl]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/?p=1751</guid>
		<description><![CDATA[
解決
tokuhiromさんのコメント参照。
name =&#62; "北海道";

を
'name' =&#62; "北海道";

とクオートしたら期待通りに動きました。
ありがとうございます。

use strict;
use warnings;
use utf8;
use Encode;
use HTTP::Request::Common;

my $name = "北海道";
$name = encode('shift_jis', $name);
my $req = POST 'http://ido.nu/kuma/pref', [
    name =&#62; $name
];
print $req-&#62;as_string;

こういうコードでクエリで送る文字列をsjisでエスケープされたものにしたかったんだけどうまく行かないので表示させてみたら
POST http://ido.nu/kuma/pref
Content-Length: 31
Content-Type: application/x-www-form-urlencoded

name=%C2%96k%C2%8AC%C2%93%C2%B9

%96k%8AC%93%B9になるべきところに%C2がやたら混じっていて文字が壊れている。
use bytesで囲めば直る。
{
  use bytes;

  my $req = POST 'http://ido.nu/kuma/pref', [
      name =&#62; $name
  ];
  print $req-&#62;as_string;
}

でももとのコードでなんでうまくいかないのか分からない。
]]></description>
			<content:encoded><![CDATA[<div class="note">
<h3>解決</h3>
<p><a href="http://ido.nu/kuma/2009/11/25/sjis-string-is-garbled-in-httprequestcommon/comment-page-1/#comment-87071">tokuhiromさんのコメント</a>参照。</p>
<pre><code>name =&gt; "北海道";
</code></pre>
<p>を</p>
<pre><code>'name' =&gt; "北海道";
</code></pre>
<p>とクオートしたら期待通りに動きました。<br />
ありがとうございます。
</p></div>
<pre><code>use strict;
use warnings;
use utf8;
use Encode;
use HTTP::Request::Common;

my $name = "北海道";
$name = encode('shift_jis', $name);
my $req = POST 'http://ido.nu/kuma/pref', [
    name =&gt; $name
];
print $req-&gt;as_string;
</code></pre>
<p>こういうコードでクエリで送る文字列をsjisでエスケープされたものにしたかったんだけどうまく行かないので表示させてみたら</p>
<pre><code>POST http://ido.nu/kuma/pref
Content-Length: 31
Content-Type: application/x-www-form-urlencoded

name=%C2%96k%C2%8AC%C2%93%C2%B9
</code></pre>
<p><code>%96k%8AC%93%B9</code>になるべきところに<code>%C2</code>がやたら混じっていて文字が壊れている。</p>
<p><code>use bytes</code>で囲めば直る。</p>
<pre><code>{
  use bytes;

  my $req = POST 'http://ido.nu/kuma/pref', [
      name =&gt; $name
  ];
  print $req-&gt;as_string;
}
</code></pre>
<p>でももとのコードでなんでうまくいかないのか分からない。</p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2009/11/25/sjis-string-is-garbled-in-httprequestcommon/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>chrome + NPAPI / nixysa</title>
		<link>http://ido.nu/kuma/2009/11/22/chrome-npapi-nixysa/</link>
		<comments>http://ido.nu/kuma/2009/11/22/chrome-npapi-nixysa/#comments</comments>
		<pubDate>Sat, 21 Nov 2009 19:02:49 +0000</pubDate>
		<dc:creator>ku</dc:creator>
				<category><![CDATA[C/C++]]></category>
		<category><![CDATA[chrome]]></category>

		<guid isPermaLink="false">http://ido.nu/kuma/2009/11/22/chrome-npapi-nixysa/</guid>
		<description><![CDATA[Google Japan Blog: Google Chrome 拡張（Extensions） を作ってみませんか？に参加しました。事前のアイディアソンでSCRAPBOOK :: Firefox Extensionみたいにページの中身をダウンロードしてローカルに保存してあとで見られるようにするextensionを(HTML5チーム6人で)作る、ということになったのはいいものの、ちょっと調べてみるとファイルをローカルにダウンロードするいい方法がありません。
chrome extensionのAPIにはファイルをダウンロードさせるAPIがありません。gearsのlocal serverを使うと新しいドメインで使用するたびにgearsを使っていいかのダイアログが出るのに加えて同じドメインにある画像しか保存できません(画像はamazonS3だったりするサービスも多くなってきているのでページと同じドメインしかキャッシュできないのは困る)。
nixysa
そういえばextensionでNPAPIのpluginを読み込ませられるからそれで解決できるのでは、と思って何も知らないところから調べ始めたらFirefoxやChromeのPlugin開発に便利なnixysa // CIOを目指しつつの8makiのアレにnixysaというので簡単にNPAPI pluginが書けるというのを発見しました。じゃあこれでやってみるかということではじめにHelloWorldWalkThru &#8211; nixysa &#8211; Hello World Walk-Thruをやりました。環境はWindowsXP SP2+VisualStudio2008です。
scons
どうもこのチュートリアルはLinuxを対象にしているようでWindowsで動かしたい時は書いてありません。でもchromium本体をビルドする時にBuild Instructions (Windows)に従って作ったcygwin環境を使ったらビルドすることができました。ただはじめにsconsがpythonのモジュールplyとgflagsがないと言ってこけます。これはnixysaをsvnからcheckoutしてきたときにthird_party/の中に入っているのでそれを
./setup.py install

でインストールすれば動くようになります(入っているのに気がつかなくて自分でダウンロードしてきました&#8230;)。
std::wstring
sconsが動いてコンパイルが始まると今度はnixysa/static_glue/npapi/common.hでgccがstd::wstringというクラスはないと言い出してこけます。これはcygwinのgccがそういうものだそうでgcc(cygwin)でのstd::wstringの利用方法 -OKWaveに素っ気なく書いてある
typedef basic_string&#60;wchar_t&#62; wstring;
としてみる

という回答以上に詳しいことが書かれているものを見つけられなかったのでcommon.hにそう書いたらコンパイルできるようになりました。なんでcygwinのgccはwstringが使えないんでしょう？
about:plugins
これでsconsを実行するとめでたくhelloworld.dllができあがりました。manifest.jsonにpluginsを追加してhelloworld.dllを指定するとchromeでabout:pluginsを開くと、プラグインのリストにhelloworldが入ってるはずなのですが出てきません。なんとかしたいけどそもそもNPAPIがどういう仕組みになっているのかがわかってない状態でnixysaがなんで動かないのかがわかるはずがないのでnixysaはあきらめました。たぶんLinuxだとちゃんと動くんだと思います。
npsimple.dll
ふつうにNPAPIで検索するとFirefox用のコードばかり出てくるので、原理的にはそれでも問題ないはずだけど問題が出た時に何も知らない素人には解決できないからchromeで動くことが分かっているNPAPI pluginのコードを手に入れてそれをいじるという方針に変えて探していたらIssue 13564 &#8211; chromium &#8211; NPAPI Chrome crash &#8211; STRINGZ_TO_NPVARIANT &#8211; Project Hosting on Google CodeにNPAPI pluginのひな形のようなものがあるのを見つけました。テスト用についているnpsimple.dllをmanifest.jsonで読み込むように指定するとちゃんとabout:pluginsに出てきます(これでnixysaで作ったDLLがちゃんと機能していないのに確信を持ちました)。
コード自体はnixysaで書くのに比べるとたしかに面倒なのですが、nixysaで簡単になる部分はNPAPIからブラウザにオブジェクトを返すとき、読み込む時のメモリ管理だけで、けっきょくC++でjsのオブジェクトを操作するというめんどくささは変わらないので全体の作業量からすればそんなに便利にはならないと感じました。でもnixysaだと公開するメソッドのインターフェイスをIDLで記述できるので圧倒的に見通しがよくなるし、ミスで引数が違っていて落ちる、というようなこともなくなります。NPAPIの仕組み自体はGecko Plugin API Reference &#8211; MDCにしっかり書いてあるので読むとよくわかります。ただ、できることは非常に限られていて、ブラウザに特定のURLをリクエストさせてそのbodyをストリームとして読み取ること、与えられたウインドウ矩形を描画すること、OSネイティブのイベントをハンドリングすることぐらいしかできません。デスクトップアプリケーション開発者ならなんでもできて楽しいかんじですが、ウェブ開発者からしたら&#8221;ダウンロードしかできない&#8221;かんじです。
で、指定したファイルをダウンロードしてきてローカルファイルに保存する、というNPAPI pluginを作ったけど時間がなくてパラレルにリクエストしたりしてもちゃんと動くのかとか実用に堪えるのかのテストは全くできていなかったのであとで泣きを見たりしそうだったのと手動で環境変数を設定しないと動かないインチキ実装なのとで怖いからハッカソンでは使いませんでした。
コード
ku&#8217;s npapicache &#8211; GitHub
]]></description>
			<content:encoded><![CDATA[<p><a href="http://googlejapan.blogspot.com/2009/11/google-chrome-extensions.html">Google Japan Blog: Google Chrome 拡張（Extensions） を作ってみませんか？</a>に参加しました。事前のアイディアソンで<a href="http://amb.vis.ne.jp/mozilla/scrapbook/index.php?lang=ja">SCRAPBOOK :: Firefox Extension</a>みたいにページの中身をダウンロードしてローカルに保存してあとで見られるようにするextensionを(HTML5チーム6人で)作る、ということになったのはいいものの、ちょっと調べてみるとファイルをローカルにダウンロードするいい方法がありません。<br />
chrome extensionのAPIにはファイルをダウンロードさせるAPIがありません。gearsのlocal serverを使うと新しいドメインで使用するたびにgearsを使っていいかのダイアログが出るのに加えて同じドメインにある画像しか保存できません(画像はamazonS3だったりするサービスも多くなってきているのでページと同じドメインしかキャッシュできないのは困る)。</p>
<h3>nixysa</h3>
<p>そういえばextensionでNPAPIのpluginを読み込ませられるからそれで解決できるのでは、と思って何も知らないところから調べ始めたら<a href="http://blog.8maki.jp/2009/10/nixysa-npapi-gluecode-genereator.html">FirefoxやChromeのPlugin開発に便利なnixysa // CIOを目指しつつの8makiのアレ</a>に<a href="http://code.google.com/p/nixysa/">nixysa</a>というので簡単にNPAPI pluginが書けるというのを発見しました。じゃあこれでやってみるかということではじめに<a href="http://code.google.com/p/nixysa/wiki/HelloWorldWalkThru">HelloWorldWalkThru &#8211; nixysa &#8211; Hello World Walk-Thru</a>をやりました。環境はWindowsXP SP2+VisualStudio2008です。</p>
<h4>scons</h4>
<p>どうもこのチュートリアルはLinuxを対象にしているようでWindowsで動かしたい時は書いてありません。でもchromium本体をビルドする時に<a href="http://dev.chromium.org/developers/how-tos/build-instructions-windows">Build Instructions (Windows)</a>に従って作ったcygwin環境を使ったらビルドすることができました。ただはじめにsconsがpythonのモジュール<code>ply</code>と<code>gflags</code>がないと言ってこけます。これはnixysaをsvnからcheckoutしてきたときに<code>third_party/</code>の中に入っているのでそれを</p>
<pre><code>./setup.py install
</code></pre>
<p>でインストールすれば動くようになります(入っているのに気がつかなくて自分でダウンロードしてきました&#8230;)。</p>
<h4>std::wstring</h4>
<p>sconsが動いてコンパイルが始まると今度は<code>nixysa/static_glue/npapi/common.h</code>でgccが<code>std::wstring</code>というクラスはないと言い出してこけます。これはcygwinのgccがそういうものだそうで<a href="http://okwave.jp/qa2132513.html">gcc(cygwin)でのstd::wstringの利用方法 -OKWave</a>に素っ気なく書いてある</p>
<blockquote><p>typedef basic_string&lt;wchar_t&gt; wstring;<br />
としてみる
</p></blockquote>
<p>という回答以上に詳しいことが書かれているものを見つけられなかったので<code>common.h</code>にそう書いたらコンパイルできるようになりました。なんでcygwinのgccはwstringが使えないんでしょう？</p>
<h4>about:plugins</h4>
<p>これでsconsを実行するとめでたく<code>helloworld.dll</code>ができあがりました。<code>manifest.json</code>に<code>plugins</code>を追加して<code>helloworld.dll</code>を指定するとchromeで<code>about:plugins</code>を開くと、プラグインのリストにhelloworldが入ってるはずなのですが出てきません。なんとかしたいけどそもそもNPAPIがどういう仕組みになっているのかがわかってない状態でnixysaがなんで動かないのかがわかるはずがないのでnixysaはあきらめました。たぶんLinuxだとちゃんと動くんだと思います。</p>
<h3>npsimple.dll</h3>
<p>ふつうにNPAPIで検索するとFirefox用のコードばかり出てくるので、原理的にはそれでも問題ないはずだけど問題が出た時に何も知らない素人には解決できないからchromeで動くことが分かっているNPAPI pluginのコードを手に入れてそれをいじるという方針に変えて探していたら<a href="http://code.google.com/p/chromium/issues/detail?id=13564">Issue 13564 &#8211; chromium &#8211; NPAPI Chrome crash &#8211; STRINGZ_TO_NPVARIANT &#8211; Project Hosting on Google Code</a>にNPAPI pluginのひな形のようなものがあるのを見つけました。テスト用についている<code>npsimple.dll</code>を<code>manifest.json</code>で読み込むように指定するとちゃんと<code>about:plugins</code>に出てきます(これでnixysaで作ったDLLがちゃんと機能していないのに確信を持ちました)。</p>
<p>コード自体はnixysaで書くのに比べるとたしかに面倒なのですが、nixysaで簡単になる部分はNPAPIからブラウザにオブジェクトを返すとき、読み込む時のメモリ管理だけで、けっきょくC++でjsのオブジェクトを操作するというめんどくささは変わらないので全体の作業量からすればそんなに便利にはならないと感じました。でもnixysaだと公開するメソッドのインターフェイスをIDLで記述できるので圧倒的に見通しがよくなるし、ミスで引数が違っていて落ちる、というようなこともなくなります。NPAPIの仕組み自体は<a href="https://developer.mozilla.org/ja/Gecko_Plugin_API_Reference">Gecko Plugin API Reference &#8211; MDC</a>にしっかり書いてあるので読むとよくわかります。ただ、できることは非常に限られていて、ブラウザに特定のURLをリクエストさせてそのbodyをストリームとして読み取ること、与えられたウインドウ矩形を描画すること、OSネイティブのイベントをハンドリングすることぐらいしかできません。デスクトップアプリケーション開発者ならなんでもできて楽しいかんじですが、ウェブ開発者からしたら&#8221;ダウンロードしかできない&#8221;かんじです。</p>
<p>で、指定したファイルをダウンロードしてきてローカルファイルに保存する、というNPAPI pluginを作ったけど時間がなくてパラレルにリクエストしたりしてもちゃんと動くのかとか実用に堪えるのかのテストは全くできていなかったのであとで泣きを見たりしそうだったのと手動で環境変数を設定しないと動かないインチキ実装なのとで怖いからハッカソンでは使いませんでした。</p>
<h3>コード</h3>
<p><a href="http://github.com/ku/npapicache">ku&#8217;s npapicache &#8211; GitHub</a></p>
]]></content:encoded>
			<wfw:commentRss>http://ido.nu/kuma/2009/11/22/chrome-npapi-nixysa/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
