PHPデベロッパーのためのJavaScriptセキュリティ入門(株)セキュアスカイ・テクノロジー
常勤技術顧問 長谷川陽介

PHPカンファレンス福岡 2016
Secure Sky Technology Inc.

#phpconfuk自己紹介長谷川陽介 (はせがわようすけ / @hasegawayosuke)

 （株）セキュアスカイ・テクノロジー 常勤技術顧問
 セキュリティキャンプ講師 (2008年～)
 OWASP Kansaiチャプターリーダー
 OWASP Japanボードメンバー
 CODE BLUEカンファレンス レビューボード http//utf-8.jp/
 jjencodeとかaaencodeとかSecure Sky Technology Inc.

#phpconfuk宣伝： 本が出ました！！

Secure Sky Technology Inc.

#phpconfuk

ブラウザハック Wade Alcorn、 ChristianFrichot、Michele Orrù著
 園田道夫、西村宗晃、はせがわ
ようすけ監修 http://www.shoeisha.co.jp/
book/detail/9784798143439

Secure Sky Technology Inc.

#phpconfuk

ブラウザハック書籍内、日本人で唯一のバイネームな記述

Secure Sky Technology Inc.

#phpconfuk

ブラウザハック書籍内、日本人で唯一のバイネームな記述
監修者まえがき「特に原稿が遅いはせがわ
ようすけさんにはハラハラさせられました」（´Д｀；）まじすみません

Secure Sky Technology Inc.

#phpconfuk

ブラウザハック書籍内、日本人で唯一のバイネームな記述
監修者まえがき「特に原稿が遅いはせがわ
ようすけさんにはハラハラさせられました」「2009年に日本のセキュリ
ティ研究家のはせがわよう（´Д｀；）まじすみません
すけが、[],$_+:~{}とその他
わずかの∥のみで
JavaScriptコードを…」

jjencode!! v(*'ω'*)v

Secure Sky Technology Inc.

#phpconfukなぜJavaScriptなのか
おれはPHP
デベロッパーだ！
いまさら
JSなんて…

Secure Sky Technology Inc.

#phpconfukなぜJavaScriptなのかブラウザの高機能化

 HTML5による表現力の向上
 JavaScriptの処理速度の向上

JavaScriptプログラミング効率の向上
 言語仕様の充実化
 プログラミング環境の改善

実行コードのブラウザ上へのシフト

 ネイティブアプリからWebアプリへ
 従来サーバ側で行っていた処理がクライアントの
JavaScript上へ

Secure Sky Technology Inc.

#phpconfukセキュリティ対策もフロントエンドへ脆弱性もフロントエンドで増加

 JavaScriptコード量や扱うデータが増加
 比例して脆弱性も増加
 XSSやCSRFなどの比重が増加

Web開発者であるからにはフロントエンドの知識も要求されて普通という時代へ
 今だからこそのJavaScript 当然、セキュリティに関連する技術も必要
 サーバサイドでもセキュアなAPIのデザインなど
Secure Sky Technology Inc.

#phpconfukフロントエンドでのセキュリティ問題
ブラウザ上で発生する脆弱性

 オープンリダイレクタ
 DOM-based XSS
 CSRF Ajaxデータの漏えい クライアントサイドでの不適切なデータ保存
 DOM APIの不適切な使用 などなど…

サイトを訪問することによって発生
 すなわち受動的攻撃

Secure Sky Technology Inc.

#phpconfukフロントエンドのセキュリティ対策
攻撃側は新しいWeb技術をもっとも活用できる

 新しいブラウザの機能、新しいHTML要素、新しいJSAPI クロスブラウザ対応は不要
 誰に遠慮する必要もなく、使いたい技術を選んで使える
 多少不安定な技術でも構わない残念ながら「銀の弾丸」は存在しない

 「これさえやっておけば」という効果的な対応方法は存在しない 地道な努力、地道な対応あるのみ

Secure Sky Technology Inc.

#phpconfuk今日の話
フロントエンドの比重が高まるなかで、最低限のJavaScriptのセキュリティ対策の話に限定
JavaScriptに関するセキュリティ問題
 オープンリダイレクタ
 DOM-based XSSPHPデベロッパーでもこれくらいは対応しておいてほしいという思いで話します！
Secure Sky Technology Inc.

#phpconfuk

っと、その前に…

「脆弱性」ってなんだっけ。

Secure Sky Technology Inc.

#phpconfukクロスサイトスクリプティング

強制ブラウズ

書式文字列攻撃リモートファイルインクルード

SQLインジェクション LDAPインジェクション
パストラバーサル

バッファオーバーフロー

CSRF

セッションハイジャック

そもそも「脆弱性」って何?
OSコマンドインジェクション
オープンリダイレクタ
DoS

セッション固定攻撃

HTTPレスポンス分割
XPathインジェクション

メモリリーク

HTTPヘッダインジェクション

そもそも「脆弱性」って何？
「脆弱性」という言葉を使ったことは？
「脆弱性」を見つけたことは？
「脆弱性」を説明できる人、挙手！

Secure Sky Technology Inc.

#phpconfuk

「脆弱性」の定義
経済産業省告示第235号“

ソフトウエア等において、コンピュータウイルス、コンピュータ不正アクセス等の攻撃によりその機能や性能を損なう原因となり得る安全性上の問題箇所
ウェブアプリケーションにあっては、ウェブサイト運営者がアクセス制御機能により保護すべき情報等に誰もがアクセスできるような、安全性が欠如している状態を含む”

http://www.meti.go.jp/policy/netsecurity/downloadfiles/vulhandlingG.pdf
Secure Sky Technology Inc.

#phpconfuk

「脆弱性」の定義
IPAによる定義“

脆弱性とは、ソフトウエア製品やウェブアプリケーショ
ン等におけるセキュリティ上の問題箇所です。コン
ピュータ不正アクセスやコンピュータウイルス等により、この問題の箇所が攻撃されることで、そのソフトウ
エア製品やウェブアプリケーションの本来の機能や性能を損なう原因となり得るものをいいます。
また、個人情報等が適切なアクセス制御の下に管理されていないなど、ウェブサイト運営者の不適切な運用により、ウェブアプリケーションのセキュリティが維持できなくなっている状態も含みます。

”

http://www.ipa.go.jp/security/vuln/report/index.html
Secure Sky Technology Inc.

#phpconfuk

「脆弱性」の定義
Microsoftによる定義“

セキュリティの脆弱性とは、攻撃者が製品の完全性、可用性、または機密性を侵害する可能性のある製品の弱点です。

”
http://technet.microsoft.com/ja-jp/library/gg983510.aspx
Secure Sky Technology Inc.

#phpconfuk

「脆弱性」の定義
脆弱性はただのバグ
脆弱性はバグの一種です。
一般的なバグは「できるはずのことができない」というものですが、脆弱性は「できないはずのことができる」というバグです。もっと言うと、「できてはいけないことができる」ということです
HASHコンサルティング

徳丸浩さん

Secure Sky Technology Inc.

#phpconfuk

脆弱性はただのバグ
バグの少ないプログラム = 脆弱性も少ない

 脆弱性を減らすにはバグを減らせばいい 「バグは少ないのに脆弱性が多い」「バグは多いのに脆弱性が少ない」という例はほとんどないまずはプログラムの品質をあげよう！

Secure Sky Technology Inc.

#phpconfuk本題： JavaScriptのセキュリティ

Secure Sky Technology Inc.

#phpconfukJavaScriptに関するセキュリティ問題
ブラウザ上で発生する問題 - 受動的攻撃

 攻撃者のしかけた罠をトリガに、ユーザーのブラウザ上で問題が発生する
能動的攻撃
Webサーバー

受動的攻撃
Webサーバー

Secure Sky Technology Inc.

#phpconfukJavaScriptに関するセキュリティ問題
主なセキュリティ上の問題

 JavaScriptによるオープンリダイレクタ
 DOM-based XSS
 XHRを用いたCSRF
 Ajaxデータの漏えい クライアントサイドでの不適切なデータ保存
 その他DOM APIの不適切な使用

Secure Sky Technology Inc.

#phpconfukJavaScriptに関するセキュリティ問題
主なセキュリティ上の問題

 JavaScriptによるオープンリダイレクタ 今日話す内容
 DOM-based XSS
 XHRを用いたCSRF
 Ajaxデータの漏えい クライアントサイドでの不適切なデータ保存
 その他DOM APIの不適切な使用

Secure Sky Technology Inc.

#phpconfukJavaScriptに関するセキュリティ問題
主なセキュリティ上の問題

 JavaScriptによるオープンリダイレクタ 今日話す内容
 DOM-based XSS
 XHRを用いたCSRF
 Ajaxデータの漏えい クライアントサイドでの不適切なデータ保存
 その他DOM APIの不適切な使用
JPCERT/CC「HTML5を利用したWebアプリケーショ
ンのセキュリティ問題に関する調査報告書」を参照
http://www.jpcert.or.jp/research/html5.html

Secure Sky Technology Inc.

#phpconfukJSによるオープンリダイレクタ

Secure Sky Technology Inc.

#phpconfukJSによるオープンリダイレクタ
JavaScriptによるリダイレクト(ページ移動)
location.href = url;
location.assign( url );遷移先ページが攻撃者によってコントロール可能な場合、オープンリダイレクタとなる// bad code. URL中の#より後ろを次のURLとして表示する。
// http://example.jp/#next など。
var url = "/" + location.hash.substr(1); //「/next」に移動
location.href = url;

攻撃者はhttp://example.jp/#/evil.utf-8.jp/などにユーザーを誘導
location.href = "//evil.utf-8.jp/"

Secure Sky Technology Inc.

#phpconfukJSによるオープンリダイレクタ
オープンリダイレクタ

 任意のサイトにリダイレクトされてしまう それ自体は実質的に大きな問題があるわけではない間接的な影響 元サイト内のコンテンツのように見せかけてユー
ザーを誘導
 フィッシングサイトへの誘導 ドメインを信頼して訪問したユーザーを裏切ることにもなる

Secure Sky Technology Inc.

#phpconfukJSによるオープンリダイレクタ
オープンリダイレクタとならないために
 遷移先を固定リストで持つ// URL中の#より後ろを次のURLとして表示する。
// http://example.jp/#next など。
const pages = { next:"/next", foo:"/foo", bar:"/bar" };const url = pages[ location.hash.substr(1) ] || "/notfound";location.href = url;

 遷移先URLとして自サイトのドメイン名を先頭に付与する
const url = location.origin + "/" + location.hash.substr(1);location.href = url;

Secure Sky Technology Inc.

#phpconfukJSによるオープンリダイレクタ
オープンリダイレクタとならないために(続き) Chrome,FirefoxではURLオブジェクトを利用してオリジンを確認// 相対URL等を絶対URLのURLオブジェクトに変換
const url = new URL( text, location.href );if( url.origin === "http://example.jp" ){location.href = url;} IEではa要素を使って同種のことが実現可能
コードは割愛http://d.hatena.ne.jp/hasegawayosuke/20151204/p1

Secure Sky Technology Inc.

#phpconfukDOM-based XSS

Secure Sky Technology Inc.

#phpconfukDOM-based XSS
JavaScriptが引き起こすXSS

 サーバ上でのHTML生成には問題なし

JavaScriptによるレンダリング時にブラウザ上で問題が発生する// bad code// http://example.jp/#<img src=0 onerror=alert(1)><html><script>
document.write( location.hash.substring(1) );</script></html>Secure Sky Technology Inc.

#phpconfukDOM-based XSS
JavaScriptが実行されるまでXSSの存在がわからない既存の検査ツールでは検出不可な場合も

 生成されるHTML自体には問題はない リクエスト/レスポンスの監視だけでは見つからない
検査ツール

<xss>

Webサーバー

ブラウザ

<xss>

<xss>

Secure Sky Technology Inc.

#phpconfukDOM-based XSS
静的コンテンツのみでもXSSする可能性

 動的にHTMLを生成する「Webアプリケーション」ではなく、*.htmlしか提供してなくてもXSSのある可能性がある<html><script>
document.write( location.hash.substring(1) );</script></html>静的コンテンツのみの
Webサーバー

Secure Sky Technology Inc.

ブラウザ

#phpconfukDOM-based XSS
攻撃者はJavaScriptを読むことができる じっくり読んで脆弱性を探すことが可能
 脆弱性の有無を確認するための試行リクエストは不要 「一撃必殺」でXSSを成功させる

Secure Sky Technology Inc.

#phpconfukDOM-based XSS

IE10, XSSフィルターを通過
Secure Sky Technology Inc.

#phpconfukDOM-based XSS
圧倒的に不利な状況

 JavaScriptコード量の大幅な増加
 XSSフィルタを通過することがある
 サーバのログに残らないことがある これまでの検査方法では見つからない 静的コンテンツでもXSSする
 攻撃者は時間をかけてXSSを探す

開発時点で作りこまない必要性

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
原因

 攻撃者の与えた文字列が JavaScript上のコードのどこかで
 文字列からHTMLを生成 あるいは JavaScript
コードとして実行される//http://example.jp/#<img src=0 onerror=alert(1)><html><script>
document.write( location.hash.substring(1) );</script></html>Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
原因

 攻撃者の与えた文字列が JavaScript上のコードのどこかで
 文字列からHTMLを生成 あるいは JavaScript
コードとして実行される//http://example.jp/#<img src=0 onerror=alert(1)><html><script>
document.write( location.hash.substring(1) );</script></html>Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
原因

 攻撃者の与えた文字列が JavaScript上のコードのどこかで
 文字列からHTMLを生成 あるいは JavaScript
コードとして実行される//http://example.jp/#<img src=0 onerror=alert(1)><html><script>
document.write( location.hash.substring(1) );</script></html>Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
原因

 攻撃者の与えた文字列が JavaScript上のコードのどこかで
 文字列からHTMLを生成 あるいは JavaScript
コードとして実行される//http://example.jp/#<img src=0 onerror=alert(1)><html><script>
document.write( location.hash.substring(1) );</script></html>ソース
シンク

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
ソース

 攻撃者の与えた文字列の含まれる箇所

シンク

 文字列からHTMLを生成したりコードとして実行する部分

ソース

Secure Sky Technology Inc.

処理

シンク

#phpconfukDOM-based XSS 原因と対策
ソース

 攻撃者の与えた文字列の含まれる箇所

シンク

 文字列からHTMLを生成したりコードとして実行する部分
document.
referrer

location.
hashlocation.
searchソース

XHR
Secure Sky Technology Inc.

処理

シンク

etc...

#phpconfukDOM-based XSS 原因と対策
ソース

 攻撃者の与えた文字列の含まれる箇所

シンク

 文字列からHTMLを生成したりコードとして実行する部分
document.
referrer

location.
hashlocation.
searchソース

XHR
Secure Sky Technology Inc.

location.
href
処理etc...

document.
write
シンク

eval

etc...

innerHTML#phpconfukDOM-based XSS 原因と対策
対策

 HTML生成時にエスケープ/適切なDOM操作
 URLの生成時はhttp(s)に限定
 使用しているライブラリの更新

サーバ側でのXSS対策と同じ

 これまでサーバ上で行っていたことをJavaScript上で行う

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
対策

 HTML生成時にエスケープ/適切なDOM操作
 URLの生成時はhttp(s)に限定
 使用しているライブラリの更新

サーバ側でのXSS対策と同じ

 これまでサーバ上で行っていたことをJavaScript上で行う

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
HTML生成時に適切なDOM操作

 JavaScriptでレンダリングされる直前
 「エスケープ」ではなく適切なDOM操作関数// bad code
document.write( location.hash.substring( 1 ) );const text = document.createTextNode(location.hash.substr( 1 ));document.body.appendChild( text );Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
テキストノードだけでなく属性値も// bad code
var text = "...."; //変数textは攻撃者がコントロール可能
form.innerHTML ='<input type="text" name="key" value="' + text + '">';<input ... value=""><script>...</script "">const text = "...."; //変数textは攻撃者がコントロール可能
const elm = document.createElement( "input" );elm.setAttribute( "type", "text" );elm.setAttribute( "name", "key" );elm.setAttribute( "value", text ); // 属性値を設定する
form.appendChild( elm );Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
HTML生成時に適切なDOM操作関数

 テキストノードの生成
createTextNode, innerText, textContent
 属性の設定
setAttributeシンクとなるAPIを不用意に使用しない innerHTML, document.write, ...

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
とはいえinnerHTMLを使わざるを得ないケースもある サーバからHTML断片をXHRで取得しHTML内に挿入する等// bad code// http://example.jp/#news のようなURLでアクセスすると// /news の内容をXHRで取得してHTMLとして挿入
var url = "/" + location.hash.substr(1);var xhr = new XMLHttpRequest();xhr.open( "GET", url, true );xhr.onload = function(){document.getElementById( "news-list" ).innerHTML =xhr.responseText}
xhr.send( null );Secure Sky Technology Inc.

#phpconfuk

XMLHttpRequest経由でのXSS
攻撃者が http://example.jp/#/attacker.example.com/のようなURLに誘導することで本来とは異なるサーバからHTML断片がロードされてしまう// bad code// http://example.jp/#news のようなURLでアクセスすると// /news の内容をXHRで取得してHTMLとして挿入
var url = "/" + location.hash.substr(1);var xhr = new XMLHttpRequest();xhr.open( "GET", url, true );url = " //attacker.example.com/ "xhr.onload = function(){document.getElementById( "news-list" ).innerHTML =xhr.responseText}
xhr.send( null );Secure Sky Technology Inc.

#phpconfuk

XMLHttpRequest経由でのXSS
サーバ側で生成済みのHTML断片をブラウザ内に流し込みたいHTML断片なのでテキストノードとして扱えない
innerHTMLを使うしかない
対策：自身のサーバ以外とは接続できないよう
URLを限定する
 オープンリダイレクタ対策と同様
 URLを固定リストで持つ
 自サイトのドメイン名を先頭に付与する
 URLオブジェクトを使って絶対URLを生成

Secure Sky Technology Inc.

#phpconfuk

XMLHttpRequest経由でのXSS
対策 - 自身のサーバ以外とは接続できないようにする
 URLを固定リストで持つ// URL中の#より後ろを次のURLとして表示する。
// http://example.jp/#next など。
const pages = { news:"/news", info:"/info", foo:"/foo" };const url = pages[ location.hash.substr(1) ];if( url ){xhr = new XMLHttpRequest();xhr.open( "GET", url, true );xhr.onload = function(){ elm.innerHTML = xhr.responseText; }xhr.send( null );}Secure Sky Technology Inc.

#phpconfuk

XMLHttpRequest経由でのXSS
対策 - 自身のサーバ以外とは接続できないようにする
 URL先頭に自身のホスト名を付与する方法はオープ
ンリダイレクタが存在していると攻撃者に回避されてしまうのであまり勧められない// あまりよくないコード
const url = location.origin + "/" + location.hash.substr(1);if( url ){xhr = new XMLHttpRequest();xhr.open( "GET", url, true );...

http://example.jp/redir?url=http://utf-8.jp/ のようなオープン
リダイレクタが存在していると
http://example.jp/#redir?url=http://utf-8.jp/ のような指定で他サイトからXHRで取得してしまう
Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
対策

 HTML生成時にエスケープ/適切なDOM操作
 URLの生成時はhttp(s)に限定
 使用しているライブラリの更新

サーバ側でのXSS対策と同じ

 これまでサーバ上で行っていたことをJavaScript上で行う

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
URLの生成時はhttp(s)に限定//bad code// <a id="link">リンク</a>var url = "...."; //変数urlは攻撃者がコントロール可能
var elm = document.getElementById( "link" );elm.setAttribute( "href", url );<a id="link" href=" javascript:alert(1) ">リンク</a>// urlが「http://」「https://」で始まる場合のみに限定
if( url.match( /^https?:¥/¥// ) ){const elm = document.getElementById( "link" );elm.setAttribute( "href", url );}Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
URLの生成時はhttp(s)に限定

 他のスキームが入り込まないように。
javascript:, vbscript:, data:,

<a>要素だけでなくlocationオブジェクトの操作時にも注意// bad codevar url = "javascript:alert(1)";location.href = url;// XSS
location.assign( url );// XSSif( url.match( /^https?:¥/¥// ) ){locatoin.href = url;}
Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
Chrome,FirefoxであればURLオブジェクトも利用可能
const url = new URL( text, location.href );if( url.protocol.match( /^https?/ ) ){// http or https}

IEではa要素を使って同種のことが実現可能
 コードは割愛

http://d.hatena.ne.jp/hasegawayosuke/20141030/p1

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
対策

 HTML生成時にエスケープ/適切なDOM操作
 URLの生成時はhttp(s)に限定
 使用しているライブラリの更新

サーバ側でのXSS対策と同じ

 これまでサーバ上で行っていたことをJavaScript上で行う

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
使用してるライブラリの更新

 JavaScriptライブラリの脆弱性対応
 使用しているJSライブラリの更新を把握すること
Masato Kinugawa Security Blog: jQuery Mobile 1.2
Beta未満は読み込んでいるだけでXSS脆弱性を作ります
http://masatokinugawa.l0.cm/2012/09/jquery-mobile-location.href-xss.html

サーバ側のミドルウェア等の運用と同じ

Secure Sky Technology Inc.

#phpconfukDOM-based XSS 原因と対策
対策

 HTML生成時にエスケープ/適切なDOM操作
 URLの生成時はhttp(s)に限定
 使用しているライブラリの更新

サーバ側でのXSS対策と同じ

 これまでサーバ上で行っていたことをJavaScript上で行う

Secure Sky Technology Inc.

#phpconfuk

まとめブラウザ上、JavaScript上の脆弱性が増加
 JSコード量、処理量の増加

脆弱性はただのバグ バグを減らす = 脆弱性が減る

攻撃者有利な状況

 脆弱性を作りこまない必要性

Secure Sky Technology Inc.

#phpconfuk

質問？
hasegawa@utf-8.jp
hasegawa@securesky-tech.com@hasegawayosuke
http://utf-8.jp/

Secure Sky Technology Inc.

#phpconfuk