ＳＱＬ
A. PNG B. Jpeg
C. GIF D. BMP
問題12
95
Web関連技術
•
Base64•
DataURI• JavaScript
• 画像ファイルフォーマット
•
DataURI
• セキュリティ
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
• バイナリデータを表示可能なテキストデータに変換
する方法。•
ASCIIテキスト(半角英数字+記号)しか扱えないシス テム(メールなど)がまだ沢山残っているため必要。•
メールに日本語や画像を含めるためには、ASCIIの 印字可能文字の範囲にデータを変換する必要がある•
変換には変換表を使用する。Base64(1)
97
Base64(2)
Base64 変換表
0 A 16 Q 32 g 48 w
1 B 17 R 33 h 49 x
2 C 18 S 34 i 50 y
3 D 19 T 35 j 51 z
4 E 20 U 36 k 52 0
5 F 21 V 37 l 53 1
6 G 22 W 38 m 54 2
7 H 23 X 39 n 55 3
8 I 24 Y 40 o 56 4
9 J 25 Z 41 p 57 5
10 K 26 a 42 q 58 6
11 L 27 b 43 r 59 7
12 M 28 c 44 s 60 8
13 N 29 d 45 t 61 9
14 O 30 e 46 u 62 +
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
GIFファイルの場合、先頭に”GIF87a”という文字列が埋め込 まれています。そのうちの”GIF”をBase64で変換してみましょ う。
• “GIF”を2進数で表現 (ASCIIコード)
→
01000111 , 01001001 , 01000110
• 6bitずつに分割 (括弧内は10進表記)
→
010001(17),110100(52),100101(37),000110(6 )
• 変換表で変換
→
R0lG
Base64 変換例
99
後述のData URIの章で 確認してみましょう
•
HTML/CSSが読み込む外部ファイルの代わりに、データ(画像、スタイルシート、JavaScriptなど)を HTMLに埋め込むことが出来る機能。
•
HTMLに埋め込むことで全体のファイル数を減らし、サーバとの通信回数を少なくすることができる。
Data URI
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
data:[<MIME-type>]
[;charset=<encoding>][;base64],<data>
Data URIの書式
101
<img src="data:image/
gif;base64,R0lGODdhEAAQAPAAAP////8AACH/
C1hNUCBEYXRhWE1QCD94cGFja2V0ACwAAAAAEAA QAAACHoQfGceo38CbilHq7jQa9w
+GYieNZZiRqRaxEbcxBQA7" >
使用例 画像を表示する→
Base64についての説明で間違っているものを選択し てください。
A. 画像にしか使用できない
B. 64文字でデータを表現する
C. 元データに比べると、データ量は4/3倍になる D. メール送信にも使用される
問題13
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
Web関連技術
103
• JavaScript
• 画像ファイルフォーマット
• DataURI
•
セキュリティ
•
ディレクトリ・トラバーサル• SQL
インジェクション•
クロスサイト・スクリプティング• CSRF
• HTTP
ヘッダインジェクションディレクトリ・トラバーサル
Webサーバ Webクライアント
http://省略/form.php?tmp=form1.html
header
eyecatch
footer
入力フォーム
form.php
form1.html
指定されたファイルを
埋め込み
send
A:
B:
C:
send A:
B:
yes no
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
ディレクトリ・トラバーサル
105
Webサーバ Webクライアント
http://省略/form.php?tmp=/etc/passwd
header
eyecatch
footer
入力フォーム
form.php
/etc/passwd
root:x:0:0:root:/root:/bin/
bin:x:1:1:bin:/bin:/sbin/no daemon:x:2:2:daemon:/sb
非公開ファイル の内容が表示さ れ、より悪質な 攻撃に繋ってし まう。
サーバのユーザ一覧 ファイル
クロスサイトスクリプティング
Webサーバ Webクライアント
http://省略/search.php?key=りんご
header
eyecatch
footer 検索:りんご
指定されたキーワードを 表示
りんごについて 製品概要:りんご
Q&A:りんご
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
クロスサイトスクリプティング
107
Webサーバ Webクライアント
http://省略/search.php?key=<form…
header eyecatch
footer
search.php
指定された<form>タグを そのまま表示してしまう
と、ニセの問い合わせ
フォームを表示してしまう (スタイルを操作し、元の
内容を隠すこともできる)
send
A:
B:
C:
ニセの問い合わせフォー ムのタグを指定する。
入力データの送信先を、
攻撃者のサイトにしてお けば、情報は盗み放題。
SQLインジェクション
Webサーバ Webクライアント
http://省略/search.php?key=りんご
search.php データベース
SELECT * FROM posts
WHERE text LIKE ʻ%りんご%ʼ;
SQLを使用して、データベースか ら入力されたキーワードを検索
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
SQLインジェクション
109
Webサーバ Webクライアント
http://省略/search.php?key=';DELETE…
search.php データベース
SELECT * FROM posts WHERE text LIKE ʻ%ʼ
;DELETE FROM posts;
SELECT * FROM posts ʻ%%ʼ；
ʻ; で一度命令を閉じて、別の命 令を埋め込んでしまう。
HTTPヘッダインジェクション
Webサーバ Webクライアント
HTTP/1.1 302 Found
Location: http://本来のリダイレクト 先<改行>
Location: http://攻撃用サイト
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプル</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
</body>
攻撃者 攻撃用リンク
http://省略/redirect.php?url=本来の リダイレクト先<改行>Location: htt...
HTTP HTTP Header
HTTPヘッダのLocation で転送先を指定。
複数ある場合は後の行 が有効になる。
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
エスケープ処理による対処
111
•
ユーザが入力したデータに含まれる記号などを置き替えること で安全なデータに変更する•
HTMLに埋め込む場合、< > ” ʼ & といった記号があると入力さ れたデータがHTM Lのタグや属性として処理されてしまうため、記号を変換する。(PHPならhtmlentitiesなどを使用する)
変換前 変換後
< <
> >
ʻ '
“ "
& &
<form> → <form>
Webブラウザの表示上 は<form>と表示される
クロスサイトスクリプティングの場合 ＳＱＬインジェ
クション、HTTP ヘッダインジェ クションでは対 処すべき記号が 異なる
CSRF (Cross site request forgeries)
ログイン ログアウトせずに 攻撃者
他のサイトを閲覧
攻撃用ページ
ログイン情報と共に意図しないデータを送信し て、重要な操作を行なってしまう
表示を隠された<form>など。
<form>のaction属性を正規のURLにしておく
The HTML5 Logo is licensed under Creative Commons Attribution 3.0. Unported by the W3C; http://creativecommons.org/licenses/by/3.0/
ユーザの入力をそのままHTMLに書き出してしまうこ とで発生する脆弱性の名称を選択してください。