近況とか。

• 最近はTwitterに出没してます。
• iPhone 4買いました。WILLCOMとはお別れの予定です。10年使ってたんですけどね。

このエントリを読むとエスケープという処理が如何に理解されていないか、ということが見えてくる。

誤解1. エスケープによってサーバに帰ってきたときに結果が変化すると思いこむ

「テキスト」として表示される情報は表示された時点で役目を終えますが、<input>や<textarea>の情報はサーバに返ってくるものなので、変更せずに返された場合は可能な限り元の情報と同じとなるようなエスケープ処理を施したい。

サーバに帰ってくるデータは、ブラウザ (ユーザエージェント) がHTMLを解釈し、アンエスケープした後のデータである。例を出そう。

<form action="/some/where" method="get">
<input type="text" name="foo" value="&#x41;BC">
<input type="text" name="bar" value="A&#x42;&#x43;">
</form>

<a href="/some/where?foo=&#x41;BC&amp;bar=A&#x42;&#x43;">blah blah</a>

HTMLエスケープはたかだか、出力したHTMLを解釈する時点において効果を発揮するに過ぎない。HTMLパーサはエスケープを入力時に正しくアンエスケープする (データ入力時のアンエスケープ行為)。ユーザエージェントが出力する際に、アンエスケープ後のデータを出力するメソッド (フォームの場合はURLエンコードパーセントエンコーディング) で正しくエスケープする。

鳩丸ご意見番 – URI の中に & を書くべからず も参考にして欲しい (この記事も若干誤解を招くタイトルだが)。

誤解2. 見た目が同じならば解釈はいつも同じだと思ってしまう

「テキスト」や<textarea>は一部のタグや改行コードなどの制御記号を許容したり改行→<br>タグへの変換を行う事もありますが、<input>タグでは制御コードもタグも許容しない（<input>でタグを許容する事ってあるのかな？）。

テキストに一部のタグを許容、するのはまだ良いのだが、textareaや果てはinput要素にまで「タグを許容」云々の話が出てくるのは、完全に間違いである。

1. textearea要素はその内容に一切のタグを書く (要素を入れる) ことはできない。内容はただのテキストデータである。
2. input要素のvalue属性 (というより全ての要素の全ての属性) は、HTMLにとってただのテキストデータであって、「タグ」という存在が入り込む余地がない。
3. ただし、スペース・改行・タブ以外の制御コードを排除するサニタイズを施すことは、たいてい無害であり、時には有用である。¹

たとえば、 <input type="text" value="<br>"> というHTML断片は、文法的に正しいHTMLであるが、このinput要素のvalue属性には <br> という文字列が入っているに過ぎない。これはbrタグではない。これは <input type="text" value="&lt;br&gt;"> と記述した場合と完全に等価である。等価でないならば、そのHTMLパーサには根本的なバグがあるから捨てた方がよい。

もっとも、上の例のようなタグはたとえ文法的に正しくても、書くべきではない。属性値ではただしくHTMLエスケープを施し、 <input type="text" value="&lt;br&gt;"> と書くべきである。

誤解3. JavaScriptから読むとタグが解釈されると思っている

<textarea>や<input>タグは、リッチ入力フィールドなどの実装によりJavascriptからも読まれるため、可能な限り記号エスケープは避けたいかも。

誤解2.でも述べたが、textareaの内容や、要素の属性は「単なるテキストデータ」である。これはスクリプトから読もうが同じだ。

ここで注意すべきは、スクリプトがdocument.writeや element.innerHTML等でHTMLとして出力するデータは、HTMLとして出力時のエスケープ処理の対象であるということである。上の例にあるinput要素からvalueの値を取り出し (ここではまだ文字列 "<br>")、他の要素の innerHTML プロパティに代入したとしよう。ここで <br> が初めて「タグ」として解釈される。このときに適切にエスケープする責任はスクリプトにある。

なぜか。リッチテキストをスクリプトで実現するならば、ユーザが危険なタグを自ら入力する際も、適切にエスケープする責任がスクリプトにあるからである。²

結論

基本を守る、つまり……

1. 入力時にアンエスケープを施す。これはライブラリやフレームワークが自動的に行ってくれる場合が多く、また任せるべきである。³
2. 出力時に、出力に合わせた方法でエスケープする。
   • SQLを組み立てる場合のように、内部の処理であっても、そのプログラムにとってSQLという出力であるということを忘れない。
   • HTMLもそうだが、文脈によってエスケープの方法が変わることがある。たとえば、URLのクエリ文字列にデータを埋め込む場合はURLエンコードパーセントエンコーディングを施す必要がある等。
3. またはエスケープしなくて良い出力方法を選択する。
   • DOMであればcreateTextNodeを使う
   • snprintfではなく、strncpyを使う。fprintfではなく、fputsやfwriteを使う。

これらを守っていれば、100%データは安全である。

高木氏のエントリではCSRFについて触れられているが、CSRFではデータの運搬フローが脆弱なだけで、データの意味を途中で改竄されてはいないことに注目したい。

RFC 3986 で %xx のようなURIで使うエンコーディングは パーセントエンコーディング と呼ぶと決まっていたことを思い出したので、訂正した。

² リッチテキストのフォーマット処理をAjaxでサーバ側に委任することも最近は多いと思う。この場合は当然、適切なエスケープの責任はAjaxリクエストを受け入れるサーバ側にある。

³ ただしphpのmagic_quoteは典型的な入力時サニタイズであり、有害である。使ってはならない。

拠点間VPNなので、

1. Point-to-pointで張り、通すプロトコルはIPだけでいいので、TUNデバイスを使う。
2. 前に作ったオレオレ認証局 で公開鍵認証を行う。
3. 拠点甲（サーバ側）のネットワークは 192.168.1.0/24
4. 拠点乙（クライアント側）のネットワークは 192.168.2.0/24
5. POINTOPOINT で使うIPアドレスは 192.168.100.1 & 2

拠点甲

接続を待ち受ける側。

まず、証明書を作る。それぞれ server.crt と server.key

tls-server
proto udp
port 5000

dev tun
comp-lzo

dh /etc/ssl/dh2048.pem
ca /etc/ssl/cacert.pem
cert server.crt
key server.key

ifconfig 192.168.100.1 192.168.100.2
route 192.168.2.0 255.255.255.0
push "ifconfig 192.168.100.2 192.168.100.1"
push "route 192.168.1.0 255.255.255.0" 

keepalive 10 60
ping-timer-rem
persist-key
persist-tun

user openvpn
group openvpn

verb 3
mute 10

ポイント:

• tls-server — TLSサーバ
• dev tun — TUNデバイス (Point-to-point) を使用
• ifconfig — ローカルとピアのIPアドレスを設定
• route — ルーティングの作成 (ip route add 192.168.2.0/24 via 192.168.100.2 と同じ)
• push — 拠点乙のIPアドレス・ルーティング設定をここで書く。乙は pull で呼び出す。

あとは起動

# /etc/init.d/openvpn start

拠点乙

甲に接続する側。

こちらも証明書を作る。CSRと鍵の生成は必ず証明書を使うマシンで行う。こうすることで鍵ファイルを受け渡さなくて済む。あと、甲のCA証明書 (cacert.pem) をコピーして、/etc/openvpn/cacert.pem に保存。

tls-client
remote *****.tietew.jp
proto udp
port 5000
dev tun
comp-lzo

nobind
pull

dh /etc/ssl/dh2048.pem
ca cacert.pem
cert client.crt
key client.key

keepalive 10 60
ping-timer-rem
persist-tun
persist-key

user openvpn
group openvpn

verb 3
mute 10

ポイント:

• tls-client — TLSクライアント
• remote — 接続先（拠点甲）
• nobind — UDPポートをbindしない。
• pull — サーバ側の push を受け取る。これでIPアドレスやルーティングを設定できる。

こんな感じになっていればオッケー（これは甲のほう）

# ifconfig tun0
tun0      Link encap:UNSPEC  HWaddr 00-00-00-00-00-00-00-00-00-00-00-00-00-00-00-00
          inet addr:192.168.100.1  P-t-P:192.168.100.2  Mask:255.255.255.255
          UP POINTOPOINT RUNNING NOARP MULTICAST  MTU:1500  Metric:1
          RX packets:635290 errors:0 dropped:0 overruns:0 frame:0
          TX packets:1218418 errors:0 dropped:0 overruns:0 carrier:0
          collisions:0 txqueuelen:100
          RX bytes:26877015 (25.6 MiB)  TX bytes:1134325226 (1.0 GiB)

いつも思うけどPOINTOPOINTという単語が謎。

SMTP, POP3, IMAP4, あとOpenVPNに使いたいので、第四種オレオレ認証局 を立ち上げて証明書を発行する。ユーザーは俺しか居ない。

ルート証明書（自己署名証明書、通称オレオレ証明書）の準備

# cd /path/to/ca
# touch index.txt
# echo 1 > serial
# mkdir newcerts
# openssl req -new -newkey rsa:2048 -keyout private/cakey.pem -out careq.pem
# openssl ca -in careq.pem -out cacert.pem -selfsign -days 3650 -extensions v3_ca -batch

ポイント

• -newkey rsa:2048 — RSA2048ビットの鍵
• -selfsign — 自己署名
• -days 3650 — 10年間有効 (鍵の管理に自信がないなら真似しないこと!)
• -extensions v3_ca — CAであるというSubject Typeを埋め込む。これを付けないとIE7などのチェックの厳しいブラウザは証明書チェインの検証で失敗する。

主に最後の理由でCA.shを使っていない。これでcacert.pemにCAのルート証明書（オレオレ証明書）ができる。鍵とパスフレーズは死守。

おまけとしてDHパラメタを計算しておくとあとで楽 (i.e. OpenVPNはこれを要求する)。いまどきのCPUなら1分もかからない。

# openssl dhparam -out dh1024.pem 1024
# openssl dhparam -out dh2048.pem 2048

cacert.pemを安全な伝送路（有線LAN、物理メディア、印刷等）でクライアントマシンに伝送し、ブラウザ等にインストールする。

サーバ証明書の作成

まずサーバ管理者の立場で、CSR (Certificate Signing Request) を作成する。

# openssl req -new -newkey rsa:2048 -nodes -keyout cert.key -out cert.csr

次にCA管理者の立場で、ルート証明書を使ってCSRに署名し、サーバ証明書を作成する。

# openssl ca -in cert.csr -out cert.crt -batch

SSLサーバで使うのはcert.crtとcert.key。ApacheならSSLCertificateFileとSSLCertificateKeyFileにそれぞれ指定。

サービスによっては (i.e. courier-pop3d) 証明書、鍵、DHパラメータをまとめたファイルを要求するので、そういう場合は単に繋げてしまえばいい。繋げた場合はパーミッションを忘れずに落としておく。

サーバをリフレッシュしました。
これを機会にBlogにすることにしました。
他のコンテンツは少しずつ移行してゆきます。
まだ暫くご面倒をおかけしますがご容赦ください。

わたしの作ったソフトウェアをお探しの方へ: アーカイブ に置いてあります。取り敢えずそこからダウンロードください。m(__)m

メーリングリストアーカイブとか

メーリングリストアーカイブは統合しました。Ruby on Railsを使った書き下ろしです。それぞれのアーカイブはこちら:

• Becky! Ver.2 関連アーカイブ検索サービス
• C++: language&libraries