Javascript 中 atob/btoa

解决 Javascript 中 atob 方法解码中文字符乱码问题javascript

因为一些网络通信协议的限制,你必须使用 window.btoa() 方法对原数据进行编码后，才能进行发送。接收方使用至关于 window.atob() 的方法对接受到的 base64 数据进行解码,获得原数据。例如，发送某些含有 ASCII 码表中 0 到 31 之间的控制字符的数据。html

window.btoa 与 window.atob 不支持中文

对于 unicode 编码的字符进行 base64 编码以后，经过浏览器原生的 btoa 方法界面中文会乱码。java

在 bash 终端，将“中文”转成 base64 编码web

$ echo 中文 | base645Lit5paHCg==

在 Chrome console 经过 window.atob 解码，结果为乱码windows

> window.atob('5Lit5paHCg==')
中文

在 Chrome console 中执行 windows.btoa 编码，报错浏览器

> window.btoa('中文')
Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.

从错误提示看， btoa 仅支持 ASCII 编码。bash

借助 encodeURIComponent 和 decodeURIComponent 转又非中文字符

因为 btoa 仅支持 ASCII 字符序列，若是经过 encodeURIComponent 将中文字符编码成ASCII字符序列，再经过 btoa 进行 base64 编码。网络

编码app

> window.btoa(encodeURIComponent('中文'))"JUU0JUI4JUFEJUU2JTk2JTg3"

解码ide

> decodeURIComponent(window.atob('JUU0JUI4JUFEJUU2JTk2JTg3'))"中文"

虽然到达了曲线救国的目的，可是因为 encodeURIComponent 和 decodeURIComponent 已经达到了转义控制字符的目的，使用 atob 和 btoa 感受是画蛇添足。

第三方 Base64 工具

webtoolkit.base64是一个第三方实现的 Base64 编码工具，完美的支持 unicode 编码的字符串。

> Base64.encode('中文')"5Lit5paH"> Base64.decode('5Lit5paH');"中文"

另外，若是服务端为 Nodejs ，可用以下 coffee 代码进行 base64 的编码和解码。

btoa: (s)->
    (new Buffer(s, 'utf8')).toString('base64')atob: (s)->
    (new Buffer(s, 'base64').toString('utf8'))