WordPress嫌いの覚え書き

これどっからどう見てもWo*dP*essなんだよなぁ、はっきり分かんだね

ビリーズブートキャンプ2014に行ってきました!

1日目

初日からすごくハードな運動でした!

SEO対策用

  • セキュリティ・キャンプ 2014 全国大会 Webセキュリティクラス
  • セキュリティ・キャンプ 2014 全国大会 Webセキュリティクラス
  • セキュリティ・キャンプ 2014 全国大会 Webセキュリティクラス
  • セキュリティ・キャンプ 2014 全国大会 Webセキュリティクラス
  • セキュリティ・キャンプ 2014 全国大会 Webセキュリティクラス
  • セキュリティ・キャンプ 2014 全国大会 Webセキュリティクラス

CTFの妨害コンテンツに普通に入ってきそう

ほんとの1日目

交通費支給が学割前提の計算だったんだけど、直前になって「学割証!?ファッ!?」ってなったので仕方なく差額は自腹切りました。まぁ普段ほとんど電車乗らないし、知らなくてもしょうがないね。多少はね。

会場に着いたら…そこには愛しのらまっこが!思ってたより一回り大柄だったけどむしろ抱き心地良さそうだったしこのまま屋上まで連れて行きたかったなぁ(意味深)

それにしても…Tシャツのアッピル効果絶大!

f:id:To_aru_User:20140818191449p:plain

みんなもアイコンベースにしてUT作ろうよ!

昼ぐらいから開講式始まって、そのままセキュリティ基礎で「脆弱性の正しい取り扱い方」「どこまでならセーフ?」といったものを再確認しました。SQLインジェクションを合法的に試すときはとりあえずO'Reilly入れとけって話は非常に勉強になりました。これ以上黒歴史を作りたくない自分にとっては肝に銘じたいものですね。

後はなにがあったっけ…(スケジュール表を見ずに記憶だけでブログを書く人間の鑑)

そうだ、この辺で睡眠不足から早速ダウンしかけて目を見開くことに必死になっていたんだった。何があったのかは覚えていません 技術力的にも精神力的にも法律的にもぶっ飛んでる筑波大学の某アヒルボート先輩の爆笑トークと、警察大学校の人のありがたいお話がありました。SoftEtherVPNにシリアルが仕込まれていると知ったのでついさっきアンインストールしてきました、今までありがとう!これからはTor君のお世話になることにしたよ!いや別に何もヤバいことしてないからね、してないからね、大事なことなので2回言いました

2日目

待ちに待ったWebセキュリティクラスの専門講義が本格的に始まりました!

専門講義

今回、主軸として扱ったのはFirefoxOSです。世界では既に発売されている国もあるそうで、日本ではKDDIから今年中に発売されるようです。このクラスで扱った、貸出用端末はFlameという名前でした。FireからとってFlameのような感じ?ちなみにFireとFlameには以下のような意味の差異があるようです(どうでもいい)

[調査] fire と flame の違い - 英語学習SNS Q-Eng

いろいろ弄ってみて、出たての端末にあるような初々しさを感じていました。そりゃね、コピペ機能が無いテキスト入力中のボタンが無い状態だもんね。現在開発中ということなので、これは待つしかないですね…その他に、未修整のバグと思われる挙動によってundefinedが現れて、「あーほんとに全部HTML+CSS+JavaScriptで動いてるんだなぁ」ということを改めて実感しました。あらゆるもののクラウド管理に関しては大賛成なので、今後の発展に期待したいところです!

さて今回事前課題として「FirefoxOSアプリを作る」というものが出ていましたが、何と…6時間で作りました!まぁセキュキャンの応募用紙も締切直前に2時間で書いたような奴だし、しょうがないね。

  • 7月20日週
    大学の期末テスト3つ、レポート1つ、ホモ4人でのナガスパオフ
  • 7月27日週
    大学の期末テスト5つ、レポート2つ
  • 8月7日週
    夏休み前の焼き肉オフ、ホモ9人での1泊2日熱海オフ

ほら忙しかったし(ホモ特有の言い訳)もっと前からやっとけって?締切が近づかないと動かないのは自分の悪い癖です。ほんとにすみません。許してください。何でもしますから。

普段は真性のPHPerJavaScriptとか全然触らないので、問題を見つけるとググっては修正しての繰り返しでした。そうしてたたき上げで煩雑に作ったアプリがこちら、YouTube Viewerです!

f:id:To_aru_User:20140818192138p:plain

みんな大好きBootstrap使ってます!え、手抜き?うるせーよ(開き直り)せっかくなのでjQueryも今回初めて使ってみることにしました。

f:id:To_aru_User:20140818192435p:plain

下までいくとこんな風にMoreボタンが現れて、タップすると残りの分を読み込みます。最初は領域外に引っ張ると(スマホ特有のビヨーンって伸びるアレ)をやりたかったのですが、やり方が分からなかったので今回はパスしておきました。

f:id:To_aru_User:20140818192820p:plain

画像かタイトルをタップするとこのように再生用画面が立ち上がります。

よくある質問

  • 画面小さすぎィ!
    うるせーなとりあえずモーダルダイアログ使ってみたかったんだy察しろ
  • HTML5のvideoタグなんで使わないの
    ようつべ兄貴は直接APIで提供してくれなくて結構めんどいんだよ察しろ
  • これ公式Webの完全劣化だよな?
    そうだよ(便乗)
  • どうせならニコ動でやれよ
    最初そうしようとしてたんですがニコ動は更に敷居が高かったので諦めました(もっと早く着工してたらやってたかもしれない)

ってな感じでいろいろ突っ込みどころはあるんですが察してあげてください。

今回このアプリを作る上でネックとなったのが、CSP (Content Security Policy)ですね。知らない人はググってね。単刀直入に言えば、HTML・JavaScriptCSSの完全な分離を強制させ、XSS攻撃等を根絶することが狙いのセキュリティポリシーです。どうやらFirefoxOSのアプリでは、これを必ず守らなければならない仕様となっているようです。

ハマりポイント

  • styleタグ, style属性などは一切使ってはいけない
  • onclick属性, onload属性などは一切使ってはいけない
  • javascript:といったスキームも使用出来ない

だからこうする

  • CSSの内容を全て外部に分離させる
  • JavaScriptの内容を全て外部に分離させ、イベントにはイベントリスナーを用いて対応する
  • イベントの取り消しにはe.preventDefault()を用いる

一般的なブラウザにおいてはこれでCSPは守ったことになるのですが、FirefoxOSはこれだけでは不十分で、manifest.webappにて以下のような対応が必要です。

  • typeをprivilegedに設定する
  • permissionsにsystemXHRを追加する
{
  "version": "1.0",
  "name": "YouTube Viewer",
  "description": "絶賛手抜きアプリ",
  "launch_path": "/main.html",
  "icons": {
    "128": "/logo.png"
  },
  "developer": {
    "name": "mpyw",
    "url": "http://mpyw.hateblo.jp"
  },
  "type": "privileged",
  "permissions": {
    "systemXHR": {
      "description": "ようつべAPI用"
    }
  }
}

これで行けると思ったのですが…なんと、jquery.min.jsの修正まで必要でした。XMLHttpRequestコンストラクタに特別なオブジェクトを渡さなければならないようです。というわけで、ライブラリに対して検索をかけて、

...new XMLHttpRequest...

となっていた部分を

...new XMLHttpRequest({mozSystem: true})...

と書き換えて、ようやく動いてくれました。いやー、ほんとに大変でした。フォロワーさんにもいろいろ教えていただいて勉強になりました、ありがとうございました。

…というように事前に大事な内容を自ずから予習するような状態だったので、講義の方も復習するような感じでしっかり頭に入ってきましたね。ちょうどよかった。

BoF(Birds of Feather)

その後にあった、講義を聞きたいグループのところに行って自由に過ごすやつですね。形態としては悪くないと思うんですが、何せ…

うるさすぎィ!

なんであの広さの空間で4グループもカオスにしゃべり倒してんの?何も聞こえないよ!

というのが率直な感想です。正直これは中身が良かったとしても、その中身が聞き取れなければ時間の無駄にしかならないので、幾らかの改善はあったほうがいいと思いました。

3日目

企業見学

トレンドマイクロさんの東京本社の方にお伺いしてきました!

f:id:To_aru_User:20140818201335j:plain

f:id:To_aru_User:20140818201933j:plain

2枚目の写真はベリサイン本社です、トレンドマイクロじゃないです。最初はこんな感じのオフィスをイメージしていたんですが、東京の一角にあるビルの各階に飛び飛びで存在しているような感じでした。厳重にロックされたマルウェア解析ルームと、営業向けの広々とした部屋が対象的でしたね。

出迎えで3人の方にプレゼンをしていただきましたが、最も強く心を打たれたのは3人目の女性社員の方でした。「先方の2名が真面目なプレゼンをしたので私は軽~く」という出だしのようでしたが、学生時代にPHPスクリプトを書いて大金を稼いだという点に真性PHPerの自分に通ずるものを感じ、その後の

「道具や手段を愛しすぎてはいけない。創造こそ愛すべきものである。」

というような言葉が、創造的なことを怠るようになってしまった自分の胸に強く刺さりました。まさに最近自分が悩んでいたようなことだったので、ハッと目を覚まさせられるような感銘を受けました。その後時間が無くてサッと流されたネタスライド内の「恋愛はUDPで行け」という言葉もかなりウケましたwww

その後の座談会では偶然にも(運良く?)お隣に来ていただき、そこまでの自分の思いを打ち明け、直接のお言葉を頂くことが出来ました。本当に素敵な方でした。もうちょっと歳が近かったならなぁ…

脆弱性探し

「あのお姉さん絶対モテるよね」という話をこあつう氏とTwitter上で交わしながら、バスの中でらまっこと彼の大好きなXSSについて熱いトークをして帰路を辿ってゆきました。

戻ってからは専門講義の続きとして、オレオレSNSという、わざと脆弱性が仕掛けられたWebサイトを見つけて攻撃していくゲームが始まりました。以前名古屋のミニ・セキュリティ・キャンプで参加させていただいたときはサーバーサイドへの着眼点が多く、今回はFirefoxOSアプリを使用するということで、クライアントサイドの脆弱性が中心とな

…るはずでしたが、

講師陣「CSP強すぎィ!(脆弱性作り込めない)」

まぁしょうがないね、多少はね(納得)

また、「さすがにこれは脆弱性としてはあり得ないだろwww誰がこんな酷いシステムにするんだよwww」と突っ込みたくなるようなものまで見つかりました。

さすがにちょっとこれはやりすぎ?普通はあり得ないかも…

  • クエリにIDを付加するだけでその人になりすませる
  • クエリをちょっと操作するだけで管理者権限になれる

着眼点としてはいいかも!

  • 秘密の質問への回答に成功するとすぐログインが完了する
  • 画像のEXIFデータ出力部分にXSS脆弱性がある
  • 符号化を暗号化として謳っている

4日目

午前中に前日の演習のまとめを発表した後、午後からお待ちかね、CTF(Capture The Flag)が始まりました。脆弱性を突いて内部にあるフラッグファイルを回収したり、暗号の問題を解いたりすることによって得られた点数を競い合うゲームですね。

さぁ、張り切っていくぞー!

…解けない!Webの問題なのに全然解けない!開始直後からこんな状態でした。CTF自体はほとんどやったことが無く、初心者と言えば初心者なのですが…全く解けないのはつらかった。

そしてようやく最初に解けた問題が、スマホについた指紋跡の画像からロック解除パターンを特定するというものでした。15回まで回答出来るのですが、何と一発で正解しました。今回のCTFで自慢できるのこれだけですね(人権喪失)

  • CSPの問題は解けそうだったのですが、最後の詰めが甘く、末尾に"をつけ忘れているというような凡ミスになかなか気づけずに苦しみました。最終的には仲間のサポートもあって正解までこぎつけることが出来ましたが、得たのはたった50ポイント…
  • SQLインジェクションの問題は、MySQLload_file 関数の結果を UNION でくっつけて任意のファイルの情報を読み出せるところまでいきました。PHPファイルのソース自体や、データベース内の任意のユーザーのパスワードのハッシュ値も特定可能でした。そして、この問題を作成したやぎはしゅさんのアカウントが管理者権限を持っていることも突き止めました。それなのに………解けませんでした。時間をかけたのに解けなくてすごく悔しかった。
  • スクリーンキャプチャの500点問題(100×5)は、頭が固すぎて、最初の1問目の解き方に気付いたのが終了10分前でした。2問目以降もPHP好きな自分ならば解けてたような問題だったらしいので、本当に勿体なかった…

(途中でアタックチャンスに出てなかったら違ったけど)最終成績は最下位です。こんな感じで非常に悔しい結果となりました。解けそうで解けないような問題が多かったのも痛いですが、深刻に感じたのは

他のクラスの人はWebの問題が理解出来るのに、Webの人は他のクラスの問題が理解できない

ということです。講義の内容は良かったのですが、バイナリ系の問題の占める率が高いCTF目線で考えると、この場では役に立たないようなものが多いと感じました。

  • 「いや、そこは自分がWeb選んでやってるんだから、自習が必要でしょ」
  • 「レイヤーの差が気になるのは抽象化が足りていないだけだろ」

こういう意見もご尤もなのですが、何ともいえない「実力の差」を見せつけられたような気分になりました。5日目の帰り際にどうしてもそういった気持ちが抱えきれなくなったので、講師陣のにしむねあさんはせがわさんにお伝えさせていただきました。

来年のセキュキャンでは是非、ネットワークの内容もやってください!

と。

…とはいっても、もう自分には参加の機会はやってこないので、自分で何とかしていくしかありません。ちょうど大学で夏休み明けから始まるネットワーク性能評価という講義で、パケット解析のような低レイヤーの内容も触っていけそうな感じなので、この講義は是非履修しておこうと考えています。単位は出にくいらしいですけど

高レイヤーばかり触っていて、低レイヤーのことを(大学で触れた内容以外で)ほとんど知らなかった自分の実力不足を痛感させられたCTFでした。自分の憧れの存在であるフルスタックエンジニア(低レイヤーから高レイヤー、はたまたデザインまで何でも出来るエンジニア)には程遠いかもしれませんが、トレンドマイクロ訪問時にも痛感した同じ方法を繰り返す適用するだけで満足するようになってしまったアスペルガーのような自分を何とか打開するいいきっかけになればいいなと思います。

5日目

5日目はグループワークでネタに走ったよーーーーーーーーwwwwwwwwww中身スッカラカンサーセンwwwwwwwwwwwww

いやーまぁいろいろあったけど5日間楽しかったです!みなさんお疲れ様でした!