Javascript 中 atob/btoa
解决 Javascript 中 atob 方法解码中文字符乱码问题
由于一些网络通讯协议的限制,你必须使用
window.btoa()
方法对原数据进行编码后,才能进行发送。接收方使用相当于window.atob()
的方法对接受到的 base64 数据进行解码,得到原数据。例如,发送某些含有 ASCII 码表中 0 到 31 之间的控制字符的数据。
window.btoa
与 window.atob
不支持中文
对于 unicode 编码的字符进行 base64 编码之后,通过浏览器原生的 btoa 方法界面中文会乱码。
在 bash 终端,将“中文”转成 base64 编码
$ echo 中文 | base64
5Lit5paHCg==
在 Chrome console 通过 window.atob
解码,结果为乱码
> 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 编码。
借助 encodeURIComponent
和 decodeURIComponent
转义非中文字符
由于 btoa
仅支持 ASCII 字符序列,如果通过 encodeURIComponent
将中文字符编码成ASCII字符序列,再通过 btoa
进行 base64 编码。
编码
> window.btoa(encodeURIComponent('中文'))
"JUU0JUI4JUFEJUU2JTk2JTg3"
解码
> 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'))
from:https://www.cnblogs.com/lxg0/p/7543991.html
Javascript 中 atob/btoa相关推荐
- Javascript 中 atob 方法解码中文字符乱码问题
解决 Javascript 中 atob 方法解码中文字符乱码问题 由于一些网络通讯协议的限制,你必须使用 window.btoa() 方法对原数据进行编码后,才能进行发送.接收方使用相当于 wind ...
- 解决 Javascript 中 atob 方法解码中文字符乱码问题
转载地址:http://blog.sqrtthree.com/2015/08/29/utf8-to-b64/ 首先, 为什么要编码? 由于一些网络通讯协议的限制, 又或者是出于信息加密的目的, 我们就 ...
- 解析JavaScript中的字符串类型与字符编码支持
JavaScript中的字符串也像Python那样支持反斜杠的转移,并且字符集方面默认为Unicode,下面就来详细解析JavaScript中的字符串类型与字符编码支持 定义 字符串就是零个或多个排在 ...
- Javascript中Base64编码解码的使用实例
Javascript为我们提供了一个简单的方法来实现字符串的Base64编码和解码,分别是window.btoa()函数和window.atob()函数. 1 var encodedStr = win ...
- 使用Edge.js,在JavaScript中调用C# .Net
2019独角兽企业重金招聘Python工程师标准>>> Edge.js能够让开发者在JavaScript中调用C#的接口,提高应用的扩展能力.这里介绍如何调用C#接口获取图片数据,并 ...
- Javascript中的AES加密和Java中的解密
AES代表高级加密系统,它是一种对称加密算法,很多时候我们需要在客户端加密一些纯文本(例如密码)并将其发送到服务器,然后由服务器解密以进行进一步处理.AES加密和解密更加容易在相同的平台(例如Andr ...
- 在JavaScript中从base64字符串创建Blob
本文翻译自:Creating a Blob from a base64 string in JavaScript I have base64-encoded binary data in a stri ...
- JavaScript中的Blob你知道多少
很多开发者可能用过Blob,但是却并没有认真了解过Blob是什么?Blob的API有哪些?我们什么时候会用到Blob? 下面跟我一起详细了解下Blob吧~ 一.Blob 是什么 Blob(Binary ...
- JS拼接字符串的过程中将JSON对象存到某个标签的属性中,encodeURIComponent(),btoa()用法介绍
JS拼接字符串的过程中将JSON对象存到某个标签的属性中 JS拼接字符串的过程中将JSON对象存到某个标签的属性中,encodeURIComponent(),btoa()用法介绍 案例描述 实现方法 ...
最新文章
- java中的抛出异常throws与throw
- Eclipse 代码自动提示的设置
- linux挂载一个新的硬盘
- UVA-10212 The Last Non-zero Digit. 分解质因子+容斥定理
- Graphpad Prism 9绘制子列图与柱状图
- ★教师工资为什么这么低?
- springboot---整合redis
- nssl1269-射击【贪心,堆】
- 找出二维数组中每行的最小数但最小数的列不能相同
- Spring Data Jpa 审计功能
- 代码阅读是写好程序的基本能力
- 解决qt调试时Unknown debugger type No Engine
- Diamond简介和快速应用
- 设计测试用例的常用方法
- 可以自学计算机考证吗
- SQL server 身份验证
- 监控服务器时间无法修改怎么办,监控服务器目录修改时间
- 转 Python爬虫实战一之爬取糗事百科段子
- vue显示农历_vue中通过时间转换农历得方法封装
- Simple Operations on Sequence
热门文章
- CSS绘制常见的几何图形
- 联想拯救者wif开不了_联想拯救者为什么连不上wifi
- [转载]关于如何选择5D2和6D的忠告_我是亲民_新浪博客
- 无缝轮播图无缝轮播图
- Python中的排列和组合
- PB实现国密SM2/SM3/SM4算法(DLL方式)
- 习题4-9 打印菱形图案 (15 分)
- canvas——实现图片验证码(功能实现)
- ปอเช็ตติโน่ เสียดายโอกาสของทีมในเกมฟัดหงส์
- 侏罗纪怪兽世界怎么登陆服务器未响应,全金属怪物一直登入不进去怎么办