えんたつの記録

　最近ツイートをサイトに埋め込む方法を探していたので、その過程で見つけた手法から使い勝手が良さそうな物を紹介します。各サンプルも用意しました。

・Twitter ウィジェット
・Juitter
（Juitterを現在使えるようにする方法もまとめました）
・jTweetsAnywhere

---

■Twitter ウィジェット
　公式に提供されている方法です。あらゆるサイトで見かけますね。特に事情が無い限りこれを選べば良いでしょう。
サンプル

特徴
・非常にシンプル
・指定できるのは、自分のツイート、キーワードの検索結果、自分のお気に入り、自分のリスト
・表示は自動更新されます
・色、サイズ、表示するツイート数、スクロールバーの有無などの設定が可能で簡単
・表示項目のカスタマイズはできない

---

■Juitter
　シンプルで、表示の更新頻度などのカスタマイズも容易。jQuery Pluginとして動作し、MIT Licenseが採用されています。カスタマイズしつつサイトに埋め込みたい場合、非常に使い勝手が良いです。。
サンプル

特徴
・検索にのみ対応
・表示は自動更新されます
・表示更新時間、フィルター、などの設定が可能
・動作させる為にjsファイルに少し修正が必要
・jsやCSSを書き換える事で、デザインの変更が可能

　なお、現在のtwitter仕様や日本語検索に対応するため、以下の修正が必要です。（情報がまとまってなかったので今回ここにまとめました。詳しい検証は行っていません。）

・status IDの修正
2010年末にtwitterの仕様変更があった事に対応する為、status IDを[id(float型)]から[id_str(string型)]に変更する必要がある。（なおこの件に関しては、例えばこちらやこちらがわかりやすい。
jquery.juitter.jsの120行目付近

var link =  "http://twitter.com/"+item.from_user+"/status/"+item.id;

を

var link =  "http://twitter.com/"+item.from_user+"/status/"+item.id_str;

に修正します。

・ハッシュタグへの対応
ハッシュタグを検索する場合、「#」は「%23」にしておく必要があります。
jquery.juitter.jsの40行目を

param=opt.searchObject;

から

param=escape(opt.searchObject);

にすれば良さそうです。

・日本向けの時刻表時
時刻表示を、UTCからJSTへ対応させます。例えばこちらやこちらで紹介されている変更を加えて下さい。

・system.jsを適宜設定する
各種設定がここで可能です。4行目の検索ワードを指定しましょう。それ以外に例えば9行目の検索の言語設定をjaに、10行目の自動更新間隔を適当に、18行目のフィルターも適当に。この辺りの説明はファイルに書いてあるので、読みながら修正しましょう。

・CSSの適用
Juitterのサイトの「Juitter website source code」から入手できるCSSを書き直すのが良いでしょう。その場合、「#juitterContainer .twittLI{}」の「height:55px;」を消しておくと、高さが自動で調整されます（元のプログラムは英語が表示される前提で調整がされているのでずれる）。

---

■jTweetsAnywhere
　機能が豊富で、@anywhereにも対応しているのが特徴です。サイトにきちんとtwitterの機能を盛り込む事も可能でしょう。
サンプル（@Anywhereが動かないのは原因不明です）

特徴
・ユーザー、リスト、検索結果を表示できる
・その他何がどのように表示されるかは、デモを見て下さい。
・@anywhereに対応（オプションです）
・Reply,Retweet,Favoriteメニューも表示されます。
・ドキュメントもしっかりしている。
・表示のカスタマイズも可能

なお、@anywhereを利用する時には、dev.twitterのサイトでアプリを作成した後、Application typeをRead and Writeに変更し、@Anywhere domain
にドメインを登録するのを忘れないようにしましょう。

　昨年12月、「徳丸本をブロガーに差し上げちゃうキャンペーン」に応募しました所、当選し、サイン入りの徳丸本（体系的に学ぶ 安全なWebアプリケーションの作り方）を頂きました。徳丸様ありがとうございます。約束通り、感想を書かせて頂きます。


■目次
・読む前の認識
・読んだ後の感想
・各章の感想

---

■読む前の認識

○私の現在のスキル
・PHPをほんの少しだけアルバイトで書いていた。
・サーバー周りはほぼわからない。
・ログイン処理を実装した事は無い（座学のみ）。
・iPhoneとAndroidアプリをちょっと書いてる。
・情報処理の試験は応用情報まで取ったが実務経験が無いので座学のみ。情報セキュリティの試験は大学生の頃に落ちた（中途半端な座学知識がある）。
・SQLは文字の上では勉強したが、実際に触った事はほとんど無い。
・こういった知識が必要な業界に進むので、勉強しないとやばい。

○セキュリティのイメージと周辺事項
・サーバーで持ってる情報抜かれたり、利用者に害を与えるものから防ぐために、色々とする必要がある（具体的な事はよく知らない）。
・情報漏洩したら、そのサービスが会社ごとつぶれかねない。
・イメージとして最初に出てくるのは「こんにちはこんにちは!!」。mixiとかAmebaなうであったはまちちゃん事件。
・対策として知っている事はほとんど無い。エスケープとかしとけばいいのかな、という程度の認識。（「サニタイズ脳」という単語は最近知った）
・そういえばSQLインジェクションについてはこれを見た記憶がある（具体的な事をあまり知らない）。xkcd: Exploits of a Mom（和訳）
・twitterやEvernote(こことここ)のような有名サービスでもこういう事が発生した事あるし、完全な対策は難しいのだろうか。

○セキュリティの学習について
・例えばphpを勉強する時、体系的に学習する部分もある。しかし何かを作りたいといった動機から入っているので、「動く」という事が目標になる。
・セキュリティの事を考慮しなくてもプログラムはとりあえず動くので、言語を学習する時にセキュリティの事を考えない。考えたとしても優先順位が低くなってしまっている。

○その他
・この本の範囲外だが「欺術」で書かれているようなソーシャルエンジニアリングのイメージもある。
・パスワード問い合わせると、パスワードが平文で返ってくるシステムは嫌い（あらゆる就活サイトは今すぐ直して欲しい）。



■読んだ後の感想

・読む前は、ごく普通に作ったウェブサイトは脆弱性を持たず、何か特殊な事や、下手な事をやってしまうと、脆弱性が入るものだと思ってました。全然違いますね。勉強不足だったり、様々な事を想定していない事が、すぐに脆弱性に繋がる事がよく理解できました。サンプルが用意されているのはありがたかったです。
・攻撃パターンは多彩であり、様々なパターンを意識しないと、きちんと対策が立てられない。また対策を立てるにしても、どこが脆弱性になるのか体系的に理解しておく必要があるようです。
・サンプルの例示->原因の解説->具体的な対策、という流れがかなりわかりやすかった。
・この本は「安全なアプリケーションの作り方」なので、アプリケーションを作る人にとってはこれが最低限知っておくべきだと思うと道のりが長い。徳丸本はしばらく辞書的に使う必要がありそう。

---

ここからは各章の感想です。

○第01章　脆弱性とは何かについて。
・p6「脆弱性が生まれる理由」に「バグによるもの」と「チェック機能の不足によるもの」とある。脆弱性がバグであると読んでしまうと違和感があるが、バグが脆弱性になるという意味だから確かにそうだ。

○第02章　学習用の環境構築について。
・HTTP通信を見る環境まで入っている徹底ぶりに驚く。

○第03章　基礎（HTTP、セッション管理、同一生成元ポリシー）
・何が偽装可能なのかは常に把握していないといけなそう。

○第04章　脆弱性について（原理、影響、対策）
・入力値検証は基準の決定が大事そう（仕様との兼ね合い。仕様によってはセキュリティ的意味合いは無くなる）
・入力値検証は、用意されてる関数で囲むだけではダメ、プログラムの挙動に関する性格な知識が必要（特に各関数の挙動を正確に知っている必要がある、どう悪用されるのかについてもパターンを熟知している必要がある、と、実際に自分がプログラムを組む時に気にするべき点は沢山ありそうだ。
・ただp69に「Webアプリケーションの脆弱性は、機能との関連性が強いため、設計やプログラミングをしている時点で、注意すべき脆弱性は自動的に判別できます」とあるように、整理しやすくはある。
・出力側のエスケープもhtmlspecialcharsで囲めばいいかなーぐらいの認識だったが、p102辺りを読んで、仕様をきちんと理解しないといけないんだなと認識。（バージョンの違いによる仕様変更も把握する必要がある）
・XSSで急に難易度が…。時間掛かりました。
・SQLインジェクションから繋がる攻撃の種類が豊富で凄い。
・CSRFとXSSの比較(p146)を見て少しすっきりした。
・セッションIDについてもphpの仕様をきっちり知っている必要がありそう。
・クッションページの存在意味がやっとわかった（p192）
・ディレクトリトラバーサル、OSコマンドインジェクション、ファイルアップロードなどの辺りはphpの知識が足りないので少し実感が持てないが、影響範囲が凄い。
・この章は今後も何度も読む必要があるだろう。

○第05章　セキュリティ機能（認証、認可、アカウント管理、ログ管理）
・認証周りの事は自分の中で断片的な知識の集まりだったが、整理された…かもしれない。
・アカウント管理については、設計をよく考えないといけないですね。

○第06章　文字コード
・ほとんど知識が無い状態からスタート。複雑です…。
・尾骶骨テストなる言葉があるとは。。

○第07章　携帯電話向けの脆弱性対策
・いわゆる「かんたんログイン」の話はよく高木先生が話題にしているが、いまいちよくわかってなかった。
・p415のかんたんログインの（十分条件かはわからない）必須条件で整理できた。

○第08章　アプリケーション以外の側面の脆弱性と対策
・知らない事柄が多い。とても多い…。

○第09章　マネジメント
・実務経験は無いのであまりイメージはわかない。この辺りは来年度以降読み直す必要がありあそう。


■付記

・レビューが遅かった言い訳としては、修論が…修論提出がまだ終わってないんですよ…。（いや、ちょっと別のエントリーも書いてましたけど…(汗)）
・まとまらなく、自分勝手な内容になっていましたらすみません。自分が勉強をする前のセキュリティに対するイメージはこれからも記憶しておかないとと思いながら書きました。
・なんだかレンタルサーバー借りたくなってきました。
・このレビューを書いている時にこちらのスライドを拝見し、こんな背景があったのかと後から知りました（「徳丸本ができるまで」スライドを公開します - ockeghem(徳丸浩)の日記）
・正誤表を参照しました（ソフトバンク クリエイティブ:【正誤情報】『体系的に学ぶ 安全なWebアプリケーションの作り方』）。

　昨日書いたガチャコンプまでの金額計算機を、こちらのシミュレーター向けに改造してみました。

アイドルマスターシンデレラガールズコンプガチャシミュレーター

　昨日との条件の違いは、コンプ対象レアの中に、出現確率の異なるものが入っている事です。ちょっと書き直すだけのつもりが、少々強引な実装になってしまいました（結果の正しさについてですが、カード出現確率について見た目でチェックしただけです。...多分大丈夫でしょう。）
　あと、本来は5連+1ガチャで1回1500モバコインですが、面倒なので、1回250モバコインのガチャに置き換えて計算しています。つまり、この実験結果よりももうちょっとお金が掛かるかもしれません。



　昨日よりも左によった分布をしていますね。

---

　ソースコードはこちらです。整理できてないです。。

　ソーシャルゲームは近年よく話題に上りますが、ユーザーから見た場合、面白さと、いくらかかるのかが気になる所です。もちろん無料でも楽しいと言われていますが、はまるとお金を使ってしまうとも言います。
　カードゲームをベースにしたゲームでは、「コンプ」という概念、というかイベントが存在します。ガチャによってカードを引いて行き、特定のレアカードをコンプリートするのが目的。
　コンプまでにいくらかかるのかは、このようなシミュレーターが存在します。

カードコンプシミュレーター

　最初の数枚はすぐに集まりますが、最後の方ではなかなか集まらない事が確認できる、素晴らしいシミュレーターです。で、こちらを見ているうちに、参加者全体の分布が気になったので、Rで実験してみました。こちらが実験結果です。
　

---

　コンプ対象カードの出現確率5%のガチャを8枚コンプするまで300円ガチャを回した場合、いくらでコンプできるか1万人でシミュレート
　
　
　コンプ対象カードの出現確率3%のガチャを10枚コンプするまで300円ガチャを回した場合、いくらでコンプできるか1万人でシミュレート
　
　
　コンプ対象カードの出現確率0.3%のガチャを10枚コンプするまで300円ガチャを回した場合、いくらでコンプできるか1万人でシミュレート
　（やまもといちろうさんの問題設定です。理論値とほぼ同じ金額になったので、それなりに上手く計算できているようです）
　

　

---

　眺めてみると、１つ目の設定だとしてもかなりの金額が必要な事がわかりますね。また、運が悪いと相当な金額が必要となります。おそらくこういったグラフをベースにして、どのようなサービスにするのか細かく調整しているでしょう。
　そもそもここで設定された確率というのは噂であり、検証の妥当性はわかりません。しかし設定された金額のラインがこの辺りであるとするならば、中々きついものがあります。
　
　なお、使ったプログラムはこちらです。改良などご自由にどうぞ。