JavaScript Security beyond HTML5

スライド概要

Developers Summit 2013 Kansai

profile-image

はせがわようすけ

@hasegawa

作者について:

https://utf-8.jp/

スライド一覧
シェア
埋め込む»CMSなどでJSが使えない場合

公開日

2013-09-20 00:00:00

各ページのテキスト

1. #kansumiB5 JavaScript Security beyond HTML5 ネットエージェント株式会社 長谷川陽介 Developers Summit 2013 Kansai Action!

2. 自己紹介 長谷川陽介 - はせがわようすけ  ネットエージェント株式会社  株式会社セキュアスカイ・テクノロジー 技術顧問  セキュリティ・キャンプ Webセキュリティクラス講師  Microsoft MVP for Consumer Security Oct 2005  http://utf-8.jp/  Internet Explorer、Firefox他多数の脆弱性を発見  JavaScriptの難読化コード書いてます Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

3. 難読化JavaScript

4. Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

5. Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

6. 質問 : Web技術、好きですか? Q. Do you love web technologies?

7. クロスサイトスクリプティング 強制ブラウズ 書式文字列攻撃 リモートファイルインクルード SQLインジェクション パストラバーサル LDAPインジェクション バッファオーバーフロー CSRF セッションハイジャック 質問 : Web技術、好きですか? Q. Do you love web technologies? OSコマンドインジェクション オープンリダイレクタ DoS セッション固定攻撃 HTTPレスポンス分割 XPathインジェクション メモリリーク HTTPヘッダインジェクション

8. Action!

9. Action! 新しい技術への研究が不足してる! 開発者の協力が不可欠! いっしょにセキュアな世の中を!

10. HTML5で増加する脅威

11. HTML5時代のWebアプリ 次々とリリースされるブラウザ 多数の新しい要素と属性 canvas, video, audio, input… 多数の新しいAPI Web Sockets, Web Storage, XHR Lv.2… 最適化されたJavaScriptエンジン 高速化された描画エンジン どのブラウザにどの機能が実装されてい るのか把握できない Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

12. [beta]

HTML5の新機能
マルチメディアのサポート
<video> <audio> <canvas>...
文書構造を表す要素
<section> <header> <footer> ...
フォームの拡張
<input type="email"> ...
JavaScript API
Web Storage, Web Workers, XDM, File…

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

13. HTML5時代のWebアプリ HTML5時代のブラウザ 高速化、高機能化 実行コードのブラウザ上へのシフト ネイティブアプリからWebアプリへ サーバ側で実行されていた処理がブラウザの JavaScript上へ 攻撃もクライアントサイドへシフト JavaScript上の問題点の増加 XSSやCSRFなどの比重が増加 Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

14. HTML5で増加する脅威  XSS HTML5の新要素によるXSS JSコード量の増加 – DOM Based XSS AjaxデータによるXSS  CSRF XMLHttpRequestで攻撃者有利  オープンリダイレクタ JavaScriptによるリダイレクトの増加  その他 Ajaxデータからの情報漏えい APIの使い方の問題 Web Storage、WebWorkers、XDM… Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

15. HTML5で増加する脅威 攻撃もクライアントサイドへシフト JavaScriptを通じた攻撃の比重が増加 XSSのリスクも増加 “ 多くの点から見て、XSS 脆弱性の危険性 はバッファ オーバーフローに匹敵します。 ” セキュリティに関するブリーフィング : Web に対する SDL の適用 http://msdn.microsoft.com/ja-jp/magazine/cc794277.aspx Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

16. クロスサイト スクリプティング

17. クロスサイトスクリプティング 攻撃者が用意した任意のHTMLあるいは JavaScriptが挿入される脆弱性 http://example.jp/search?q=<script>....</script> <html> .... <div>検索結果:「<script>....</script>」</div> 原因 : HTML生成時にエスケープされていな い Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

18. クロスサイトスクリプティング Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

19. クロスサイトスクリプティング 偽情報の表示 偽フォームによるフィッシング 機密情報の漏えい セッション情報の漏えい、強制 その他、ブラウザ上でできること何でも Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

20. [beta]

クロスサイトスクリプティング
原因 : HTML生成時にエスケープされて
いない
対策 : HTML生成時にエスケープする
// PHP
echo htmlspecialchars( $str, ENT_QUOTES, "UTF-8" );

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

21. HTML5の新要素によるXSS これまでの間違ったXSS対策 危険そうな要素を検出 <script> <object> <iframe> onXXX、hrefなどの名称の属性を検出 <div onmouseover=alert(1)> <img src=# onerror=alert(1)> <a href="javascript:alert(1)> これまで仮にこの方法で網羅できていた としても… Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

22. HTML5の新要素によるXSS HTML5で多数の要素、属性、イベントが 導入 <input autofocus pattern="..."> <video onplay="..."> Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

23. HTML5の新要素によるXSS いわゆる「ブラックリスト」での対応に 漏れ <form> <button formaction="javascript:alert(1)">X </button> //http://html5sec.org/#72 そもそもブラックリスト方式は無理がある 「HTML生成時にエスケープ」の原則 HTML5と関係なくXSSを防げる どんなデータに対しても正しいHTMLを出力! Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

24. DOM based XSS

25. DOM based XSS JavaScriptが引き起こすXSS サーバ側のHTML生成時には問題なし JavaScriptによるHTMLレンダリング時の問題 //http://example.jp/#<script>alert(1)</script> div.innerHTML = location.hash.substring(1); JavaScriptの利用に合わせて増加 Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

26. DOM based XSS Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

27. DOM based XSS ブラウザのXSSフィルタを通過することが多い location.hash内の実行コードはサーバ側に ログが残らない //http://example.jp/#<script>alert(1)</script> div.innerHTML = location.hash.substring(1); history.pushStateでアドレスバー書き換 え 技術のあるユーザでもXSSに気づきにくい Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

28. DOM based XSS 原因:攻撃者がコントロール可能な文字 列からHTMLを生成 element.innerHTML = "…"; element.outerHTML = "…"; document.write("…"); a.setAttribute("href", "javascript:..."); $(), $.html(), and more… //jQuery Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

29. DOM based XSS DOM based XSSは増えている JavaScriptの大規模化に伴い増加 サーバ側での対策と原則は同じ HTML生成時にエスケープ URL生成時はhttp(s)のみ CSS backgroundImage等への代入やイベ ントハンドラの動的生成は避ける Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

30. [beta]

DOM based XSS
HTML生成時にエスケープ
div.innerHTML = s.replace( /&/g, "&amp;" )
.replace( /</g, "&lt;" )
.replace( />/g, "&gt;" )
.replace( /"/g, "&quot;" )
.replace( /'/g, "&#x27;" );

むしろtextNodeを使おう!
div.appendChild(
document.createTextElement( s )
);
Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

31. [beta]

DOM based XSS
サーバ側でHTML断片生成し、ブラウザ
上でinnerHTMLに代入する場合
高速化のためなどの理由
$.ajax( {
url : "http://example.jp/api",
dataType:"text",
} ).done( function( html ){
div.innerHTML += html;
} );

任意サイトと通信しないようURLを固定
サーバ側できちんとエスケープする
Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

32. [beta]

DOM based XSS
URL生成時はhttp(s)のみ
// bad code
div.innerHTML = '<a href="' + url + '">' + url + '</a>';

if( url.match( /^https?:¥/¥// ) ){
var elm = docuement.createElement( "a" );
elm.appendChild( document.createTextNode( url ) );
elm.setAttribute( "href", url );
div.appendChild( elm );
}

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

33. オープンリダイレクタ

34. オープンリダイレクタ 本来はWebサイト内でのリダイレクト機能 http://example.jp/go?url=/next/page.html 攻撃者の指定した任意のサイトへジャンプで きてしまう http://example.jp/go?url=http://evil.example.com/ フィッシングやSEOポイゾニングに使用され る サイト自体に被害を与えるわけではない サイトの信頼は損ねる Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

35. オープンリダイレクタ 実在した例 site:www.microsoft.com/japan/ adult Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

36. オープンリダイレクタ JavaScriptによるリダイレクタの増加 // bad code var url = decodeURIComponent( location.hash.substring(1) ); location.href = url; オープンリダイレクタだけでなくXSSにも http://example.jp/#javascript:alert(1) Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

37. オープンリダイレクタ 転送先URLの確認…実は難しい http://example.com/ //example.com/ http:¥¥example.com/ http:/¥example.com /¥example.com/ その他にもいろいろ // bad code if( url.match( /^¥/[^¥/]/ ) ){ location.href = url; } Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

38. [beta]

オープンリダイレクトを防ぐために
根本的対策
転送先URLを事前にリストとして保持
// JavaScriptによるリダイレクト
var pages = { foo:'/foo', bar:'/bar', baz:'/baz' };
var url = pages[ location.hash.substring(1) ] || '/';
location.href = url;

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

39. <input>要素

40. [beta]

<input>要素
HTML5にて大幅に機能強化
様々な入力形式
<input
<input
<input
<input

type="email">
type="date">
type="range">
pattern="^[a-z]+$">

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

41. <input>要素 HTML5で機能強化されたinput要素 JavaScript不要で入力内容を確認 Webアプリケーションを超えて同一の操作性 統一されたエラーメッセージ コード量の低減によるバグの抑制 Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

42. <input>要素 ブラウザ上での入力制限をセキュリティ 上のチェック機構として用いてはいけな い 攻撃者は任意のパターンの値を送信可能 Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

43. Web Storageの 不適切な使用

44. Web Storage JavaScriptでデータを保存する機構 Cookieより大容量 Cookieと違って自動送信されない 永続的に保持されるlocalStorageとセッ ション間だけ保持されるsessionStorage sessionStorage.setItem( "foo", "abcdefg" ); var value = sesseionStorage.getItem( "foo" ); Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

45. Web Storage localStorage 明示的に削除しない限りデータを保持 原則、オリジン単位でデータを保持 IE8ではhttpとhttpsで共有される Safariではプライベートブラウズ時に読み書 きできない localStorage.setItem( "foo", "abcdefg" ); alert( localStorage.getItem( "foo" ) ); // undefined Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

46. Web Storage sessionStorage ブラウザが開かれている間データを保持 新しいタブでは異なるセッション 同一オリジンのiframe、frameではセッ ションを共有(IE8,9を除く) IE8ではhttpとhttpsで共有される Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

47. Web Storage Webアプリケーションの「セッション」 と異なるデータ保持期間 Webアプリケーション: セッション = ログ インからログアウトまで sessionStorage – (原則)タブを閉じるまで localStorage – 無期限 ログインしたユーザに紐づくデータの保 存期間に注意 Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

48. Web Storage 他のユーザとデータが混在する可能性 ユーザA ログイン データを保存 タイムアウトによる 強制ログアウト ユーザB Web Storage ログイン データ読み込み 誤ったデータの使用 データ漏えい Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

49. [beta]

Web Storage
対策
ユーザIDと合わせて保存する
sessionStorage.setItem( userid + "-foo", "abcdefg" );

未ログインでのページロード時やログイン処
理時、ログアウト処理時にstorage内のデー
タを削除する
(ログアウト処理は確実に走るとは限らない)

まだ定石が確立されていない

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

50. Web Workers

51. [beta]

Web Workers
JavaScriptによるバックグラウンド処理
機構
多量の計算などの重い処理をUIをブロックせ
ず実行
var worker = new Worker( "background-task.js" );
worker.onmessage = function( event ){
alert( "completed:" + event.data );
};
// background-task.js
for( var i = 0, sum = 0; i < 1000; i++ ){
sum += i;
}
postMessage( sum );
Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

52. Web Workers 外部からのコードが実行されないよう注 意 // 脆弱なコード // http://example.jp/#data:text/javascript,onmessage=... var src = location.hash.substring(1); var worker = new Worker( src ); 攻撃者が用意したスクリプトがWorkerとし て実行される ただしDOM操作できないので脅威は低い Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

53. [beta]

Web Workers
importScriptsも同様
//脆弱なコード。importScriptsに任意のURIがわたる
var src = location.hash.substring(1);
var worker = new Worker( 'worker.js' );
worker.postMessage( src );
// worker.js
onmessage = function( evt ){
if( evt.data ) importScripts( evt.data );
}

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

54. Cross-Document Messaging

55. [beta]

Cross-Document Messaging
Cross-Document Messaging(XDM)
ブラウザのwindow/iframe間で相互に通信
// http://example.com
<script>
iframe1.contentWindow.postMessage(
"msg", "http://example.jp" );
</script>
<iframe src="http://example.jp" id="iframe1"></iframe>
// http://example.jp
<script>
window.onmessage = function(){
....
}

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

56. Cross-Document Messaging 送信側はpostMessageの第2引数に対象 ドキュメントのオリジンを指定する // メッセージ送信側 iframe1.contentWindow.postMessage( "msg", "http://example.jp" ) オリジンが一致しない場合はメッセージは送 信されない Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

57. Cross-Document Messaging 送信側はpostMessageの第2引数に*を 指定すると任意のオリジンを持つドキュ メントに送信可能 // メッセージ送信側 iframe1.contentWindow.postMessage( "msg", "*" ) iframe内でドキュメントが別オリジンに遷移 している可能性があるため、機密情報を含む メッセージの送信では*を指定しないこと Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

58. [beta]

Cross-Document Messaging
正規の相手以外と通信しないように受信
側は受信データのoriginを確認する
// メッセージ送信側
iframe1.contentWindow.postMessage( "msg",
"http://example.jp" )
// メッセージ受信側 (iframe内に表示)
window.onmessage = function( e ){
if( e.origin == "http://example.com" ){
alert( e.data );
}
}

Developers Summit 2013 Kansai Action!

#kansumiB5

NetAgent http://www.netagent.co.jp/

59. まとめ Conclusion

60. まとめ クライアント側のコード量の増加による 脆弱性は増えている サーバサイドからクライアントサイドへ脆弱 性もシフト まだ研究し尽くされていない 対策方法が確立されていないものもある Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

61. Action!

62. Action! セキュリティ業界は怖い!? 誤解です! 新しい技術への研究が不足してる! 開発者の協力が不可欠! いっしょにセキュアな世の中を! Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/

63. 質問タイム Question ?

64. 質問 hasegawa@utf-8.jp hasegawa@netagent.co.jp @hasegawayosuke http://utf-8.jp/ Developers Summit 2013 Kansai Action! #kansumiB5 NetAgent http://www.netagent.co.jp/