先谈谈window.btoa()和window.atob()这种编码/解码方式吧,不多废话,上代码:
var str = 'javascript'; var newstr=window.btoa(str); console.log( newstr ); //转码结果 "amF2YXNjcmlwdA==" console.log( window.atob( newstr ) ); //解码结果 "javascript"
不过值得注意的是:以上这种转码的本质是Base64转码,但是Base64转码的对象只能是字符串,不包括汉字;
var str="你好!Albert_c"; var newstr=window.btoa(str); console.log( newstr ); //Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.
如上图,直接报错,所以当我们遇上汉字还需要进行Unicode转码;具体用到window.encodeURIComponent()和window.decodeURIComponent():
var str="你好!Albert_c"; var str1=window.btoa(window.encodeURIComponent(str)); var str2=window.decodeURIComponent(window.atob(str1)); console.log( str1 ); // 转码结果 "JUU0JUJEJUEwJUU1JUE1JUJEJUVGJUJDJTgxQWxiZXJ0X2M=" console.log( str2 ); // 解码结果 "你好!Albert_c"
还值得一提的是:window.btoa()对IE的兼容性并不好,在IE10以下便无法识别了,不过强大的ITer总会有解决办法,在此分享一段代码:
<script type="text/javascript"> // 先定义Base64()这个函数 function Base64() { // private property _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="; // public method for encoding this.encode = function (input) { var output = ""; var chr1, chr2, chr3, enc1, enc2, enc3, enc4; var i = 0; input = _utf8_encode(input); while (i < input.length) { chr1 = input.charCodeAt(i++); chr2 = input.charCodeAt(i++); chr3 = input.charCodeAt(i++); enc1 = chr1 >> 2; enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); enc4 = chr3 & 63; if (isNaN(chr2)) { enc3 = enc4 = 64; } else if (isNaN(chr3)) { enc4 = 64; } output = output + _keyStr.charAt(enc1) + _keyStr.charAt(enc2) + _keyStr.charAt(enc3) + _keyStr.charAt(enc4); } return output; } // public method for decoding this.decode = function (input) { var output = ""; var chr1, chr2, chr3; var enc1, enc2, enc3, enc4; var i = 0; input = input.replace(/[^A-Za-z0-9\+\/\=]/g, ""); while (i < input.length) { enc1 = _keyStr.indexOf(input.charAt(i++)); enc2 = _keyStr.indexOf(input.charAt(i++)); enc3 = _keyStr.indexOf(input.charAt(i++)); enc4 = _keyStr.indexOf(input.charAt(i++)); chr1 = (enc1 << 2) | (enc2 >> 4); chr2 = ((enc2 & 15) << 4) | (enc3 >> 2); chr3 = ((enc3 & 3) << 6) | enc4; output = output + String.fromCharCode(chr1); if (enc3 != 64) { output = output + String.fromCharCode(chr2); } if (enc4 != 64) { output = output + String.fromCharCode(chr3); } } output = _utf8_decode(output); return output; } // private method for UTF-8 encoding _utf8_encode = function (string) { string = string.replace(/\r\n/g,"\n"); var utftext = ""; for (var n = 0; n < string.length; n++) { var c = string.charCodeAt(n); if (c < 128) { utftext += String.fromCharCode(c); } else if((c > 127) && (c < 2048)) { utftext += String.fromCharCode((c >> 6) | 192); utftext += String.fromCharCode((c & 63) | 128); } else { utftext += String.fromCharCode((c >> 12) | 224); utftext += String.fromCharCode(((c >> 6) & 63) | 128); utftext += String.fromCharCode((c & 63) | 128); } } return utftext; } // private method for UTF-8 decoding _utf8_decode = function (utftext) { var string = ""; var i = 0; var c = c1 = c2 = 0; while ( i < utftext.length ) { c = utftext.charCodeAt(i); if (c < 128) { string += String.fromCharCode(c); i++; } else if((c > 191) && (c < 224)) { c2 = utftext.charCodeAt(i+1); string += String.fromCharCode(((c & 31) << 6) | (c2 & 63)); i += 2; } else { c2 = utftext.charCodeAt(i+1); c3 = utftext.charCodeAt(i+2); string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)); i += 3; } } return string; } } // 再调用Base64()这个函数即可 var b = new Base64(); var str1 = b.encode("javascript"); str2 = b.decode(str1); </script>
套用以上代码和方法即可解决低版本(10-)IE的兼容性问题了。