文字列を Base64 形式にエンコードしたりデコードしたりする

前回、ActiveX を使用した滅茶苦茶レガシーなやり方で文字列を Base64 形式にエンコードしたり、それをデコードしたりした (前回はそれに加えて暗号化もしていたが)。

今回は、Base64 エンコードの今風なやり方を調べた。

/** 文字列を Base64 文字列にエンコードする */
function encodeText(str) {
  return btoa(unescape(encodeURIComponent(str)));
};

/** Base64 文字列を通常の文字列にデコードする */
function decodeText(str) {
  return decodeURIComponent(escape(atob(str)));
};

これだけ。

btoa() と atob()

Base64 エンコードは btoa()、デコードは atob() というメソッドでできる。Binary To Ascii と、Ascii To Binary の略だろう。

だが、これはユニコード文字列を渡すと例外が発生してしまう。つまりいきなり日本語を投げ込んで btoa('日本語') とはできない、ということ。

encodeURIComponent() で UTF8 エンコード

そこで、エンコードする文字列を encodeURIComponent() に突っ込み、UTF-8 での URL 形式にエンコードする。いわゆるパーセントエンコーディングだ。

さらに unescape() でアンエスケープする

escape() と unescape() は非推奨になっているのだが、パーセントエンコーディングされた文字列をアンエスケープし、ASCII 表現にするというワケ。

んでデコードする時はこの逆で decodeURIComponent() と escape() を使う。

一見不思議な実装だが、これで今のところうまくいけるよ、という簡単 Base64 エンコードでした。