Clickjacking？
本家Slashdotで「Alarm Raised For "Clickjacking" Browser Exploit」という記事がありました。 Zdnet上の「Clickjacking: Researchers raise alert for scary new cross-browser exploit」という記事を話題にしたものです。
Zdnetでの記事は、OWASP NYC AppSec 2008 Conferenceで発表されるはずだった「Clickjacking」という脆弱性についてでした。 「Clickjacking」は結局発表されずに、ベンダが対策を出来る期間をあけるということでした。 Clickjackingは、IE、Firefox、Safari、Opera、Adobe Flashなど多くのブラウザで実現可能であり、かつJavaScriptとは関係がない技術ということらしいです。 しかし、実際には内容が公開されていないため、何かFUDっぽい伝わり方になっています。
まあ、実際にClickjackingが何かは発表されてみないとわからないのですが、本家スラドのスレッドにて「これじゃね？」という書き込みがあり、CSSだけを使ってonclickを実現する方法が紹介されていました(BonRouge : CSS onclick)。 これなんですかね？ ちょっと調べてみました。
CSS onclickの仕組み
JavaScriptを全く使わず、CSSのみでクリック処理をしてしまうサンプルです。 「BonRouge : CSS onclick」で示されているサンプルを説明のために削ってみました。
このサンプルの肝は3つあります。
- CSSにてa spanがdisplay:noneになっているところ
- CSSにてa:active spanがdisplay:blockになっているところ
- HTMLにてa hrefが#nに向いているところ(a:activeが持続する)
下記サンプルでは、LIでリストされているリンクをクリックすると右側に文字が表示されます。 結果的に、CSSのみでのクリック処理になります。
<HTML>
<HEAD>
<STYLE TYPE="text/css">
<!--
#cssonclickswitch a:active,
#cssonclickswitch a:focus {
color:#fff;
background-color:red;
}
#cssonclickswitch a span {display: none;}
#cssonclickswitch a:active span,
#cssonclickswitch a:focus span {
display: block;
position: absolute;
top: 0;
left: 170px;
width: 50px;
color:black;
}
-->
</STYLE>
</HEAD>
<BODY>
<ul id="cssonclickswitch" class="cfix">
<li><a href="#n">A<span>AAAA</span></a></li>
<li><a href="#n">B<span>BBBB</span></a></li>
<li><a href="#n">C<span>CCCC</span></a></li>
</ul>
</BODY>
</HTML>
これを応用してリンク内容が変更できるのか？
これを応用して、本来あるリンクの上にCSSを使って別リンクをオーバーレイできるのかな？と思って試してみましたが駄目でした。 このCSS onclickの手法はaの中のspan部分だけ表示/非表示にするのがポイントですが、spanの中にaを入れようと思うと、aの中にaが入ってしまい、結果としてspanによる非表示ができなくなってしまいました。
Clickjackingって何なのでしょうか？ 気になって夜も眠れなくなりそうな今日この頃です。
トラックバックURL : http://www.geekpage.jp/cgi-bin/tb.cgi?id=2008/9/26/1
