解説
「BASE64」は、メールでバイナリファイルを送るための方式です。現在では、メール以外でも、テキストしか処理できない様々な場所で利用されています。たとえば、HTMLファイルに画像などを埋め込む際には、BASE64形式で変換した画像を指定します。
バイナリファイルのBASE64への変換は、以下の手順で行ないます。
データは01の連続で表されている。 01010111111100000010101000000011 ↓ データを、6個ずつ（6ビットずつ）に分割する。 010101 111111 000000 101010 000000 11 ↓ 末尾も6個になるように0で埋める。 010101 111111 000000 101010 000000 110000 ↓ 変換表により文字に変換する。 V/AqAw ↓ 文字を4個ずつに分割する。 V/Aq Aw ↓ 末尾も4個になるように=記号で埋める。 V/Aq Aw== ↓ BASE64文字列の完成。 V/AqAw==
変換表は、以下のようになっています。
| 10進 | 2進 | 文字 |
|---|---|---|
| 0 | 000000 | A |
| 1 | 000001 | B |
| 2 | 000010 | C |
| 3 | 000011 | D |
| 4 | 000100 | E |
| 5 | 000101 | F |
| 6 | 000110 | G |
| 7 | 000111 | H |
| 8 | 001000 | I |
| 9 | 001001 | J |
| 10 | 001010 | K |
| 11 | 001011 | L |
| 12 | 001100 | M |
| 13 | 001101 | N |
| 14 | 001110 | O |
| 15 | 001111 | P |
| 16 | 010000 | Q |
| 17 | 010001 | R |
| 18 | 010010 | S |
| 19 | 010011 | T |
| 20 | 010100 | U |
| 21 | 010101 | V |
| 22 | 010110 | W |
| 23 | 010111 | X |
| 24 | 011000 | Y |
| 25 | 011001 | Z |
| 26 | 011010 | a |
| 27 | 011011 | b |
| 28 | 011100 | c |
| 29 | 011101 | d |
| 30 | 011110 | e |
| 31 | 011111 | f |
| 32 | 100000 | g |
| 33 | 100001 | h |
| 34 | 100010 | i |
| 35 | 100011 | j |
| 36 | 100100 | k |
| 37 | 100101 | l |
| 38 | 100110 | m |
| 39 | 100111 | n |
| 40 | 101000 | o |
| 41 | 101001 | p |
| 42 | 101010 | q |
| 43 | 101011 | r |
| 44 | 101100 | s |
| 45 | 101101 | t |
| 46 | 101110 | u |
| 47 | 101111 | v |
| 48 | 110000 | w |
| 49 | 110001 | x |
| 50 | 110010 | y |
| 51 | 110011 | z |
| 52 | 110100 | 0 |
| 53 | 110101 | 1 |
| 54 | 110110 | 2 |
| 55 | 110111 | 3 |
| 56 | 111000 | 4 |
| 57 | 111001 | 5 |
| 58 | 111010 | 6 |
| 59 | 111011 | 7 |
| 60 | 111100 | 8 |
| 61 | 111101 | 9 |
| 62 | 111110 | + |
| 63 | 111111 | / |
62、63番目の記号は、使用する環境によって、異なる場合があります。たとえばURLに含める際、+と/は特殊な意味を持つため、他の記号（たとえば_-）を使ったりします。
またメールの添付ファイルに使う場合は、変換したあとの長い文字列の76文字ごとに、改行コードが入ります。
サンプル
HTMLで、BASE64を利用してみます。
ファイルはUTF-8で保存してください。検証はGoogle Chromeで行なっています。
<html>
<head>
<title>「BASE64」のサンプル</title>
<meta charset="UTF-8">
</head>
<body>
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAGUExURf8AAP//AGwf25wAAADiSURBVHjaYmAgAAACiIGBkYERJwBKAgQQSA0eBQwMAAGELI1sLFwMIIAQbHSboaIAAQRjYXMcWBwggBA0pmVgFkAAwSkGTOeBaYAAQqHQVIApgAAiqAAggAgqAAggggoAAoigAoAAIqgAIIBweROuACCAsAcUgs8AEEDIQY0lIBkZAAIIM1YYUWKLASCAsNmNbBoDQABhV4DEBQggXJEE5wMEEBYFqHyAACKoACCACCoACCCCCgACCF+iBysACCCCJgAEECYfzZsAAURQAUAA4dcB5AEEEMHMCxBABDM/QIABAHLxAsRB6/Q0AAAAAElFTkSuQmCC">
</body>
</html>
