文档章节

javascript 使用btoa和atob来进行Base64转码和解码

IamOkay
 IamOkay
发布于 2014/11/27 10:18
字数 319
阅读 1162
收藏 0

javascript原生的api本来就支持,Base64,但是由于之前的javascript局限性,导致Base64基本中看不中用。当前html5标准正式化之际,Base64将有较大的转型空间,对于Html5 Api中出现的如FileReader Api, 拖拽上传,甚至是Canvas,Video截图都可以实现。


好了,前言说了一大堆,开发者需要重视:

一.我们来看看,在javascript中如何使用Base64转码

var str = 'javascript';

window.btoa(str)
//转码结果 "amF2YXNjcmlwdA=="

window.atob("amF2YXNjcmlwdA==")
//解码结果 "javascript"

二.对于转码来说,Base64转码的对象只能是字符串,因此来说,对于其他数据还有这一定的局限性,在此特别需要注意的是对Unicode转码。

    

var str = "China,中国"
window.btoa(str)

Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range.

很明显,这种方式是不行的,那么如何让他支持汉字呢,这就要使用window.encodeURIComponent和window.decodeURIComponent

var str = "China,中国";

window.btoa(window.encodeURIComponent(str))
//"Q2hpbmElRUYlQkMlOEMlRTQlQjglQUQlRTUlOUIlQkQ="

window.decodeURIComponent(window.atob('Q2hpbmElRUYlQkMlOEMlRTQlQjglQUQlRTUlOUIlQkQ='))
//"China,中国"


© 著作权归作者所有

IamOkay

IamOkay

粉丝 198
博文 483
码字总数 403041
作品 0
海淀
程序员
私信 提问
base64转码(JS)

base64是一种将二进制数据转为可打印字符的编码方法。在浏览器环境中,JavaScript原生提供两个方法,用来处理Base64转码:btoa方法将字符串或二进制值转化为Base64编码,atob方法将Base64编码...

oneboi
2016/08/18
28
0
js中关于base64的一些事

介绍 其实是一种编码转换方式, 将字符转换成普通文本, 是网络上最常见的用于传输8Bit字节代码的编码方式之一。 由字母、、以及和, 再加上作为垫字的, 一共65字符组成一个基本字符集, 其他所有...

zWing
05/06
0
0
SLICE30K/Base64.js

Base64.js 如果这个项目对你有帮助或者你觉得这个项目还不错的话,给点个星呗! 简介 虽然JavaScript中可以使用原生的btoa和atob函数进行Base64的编解码。但是不支持中文字符,并且不支持url...

SLICE30K
2017/05/22
0
0
记:通过escape和unescape进行编码传值(data-*)

遇到这样一个问题,在初始化页面后获取完数据,进行填充页面,点击后,右侧显示基本信息,如下图所示 由于再重新去数据库中搜索一次不现实,所以,就排除了这种做法,想的是将数据放在中,作...

天上月丶
2018/05/03
0
0
js对文件和二进制操作的一些方法汇总

最近接手了一个项目,接触到一些对文件操作的业务.所以在这边整理一下日常用到的处理方式,当学习笔记吧,有不对的地方,欢迎指正哈 FileReader 首先我们来看一下 这个万能的对象, 就如同它的名字...

noahlam
01/24
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Spring系列教程八: Spring实现事务的两种方式

一、 Spring事务概念: 事务是一系列的动作,它们综合在一起才是一个完整的工作单元,这些动作必须全部完成,如果有一个失败的话,那么事务就会回滚到最开始的状态,仿佛什么都没发生过一样。...

我叫小糖主
53分钟前
4
0
CentOS 的基本使用

1. 使用 sudo 命令, 可以以 root 身份执行命令, 必须要在 /etc/sudoers 中定义普通用户 2. 设置 阿里云 yum 镜像, 参考 https://opsx.alibaba.com/mirror # 备份mv /etc/yum.repos.d/CentO...

北漂的我
昨天
2
0
Proxmox VE技巧 移除PVE “没有有效订阅” 的弹窗提示

登陆的时候提示没有有效的订阅You do not have a valid subscription for this server. Please visit www.proxmox.com to get a list of available options. 用的是免费版的,所以每次都提示......

以谁为师
昨天
3
0
Java设计模式之外观模式(门面模式)

什么是外观模式   外观模式(Facade),他隐藏了系统的复杂性,并向客户端提供了一个可以访问系统的接口。这种类型的设计模式属于结构性模式。为子系统中的一组接口提供了一个统一的访问接口...

须臾之余
昨天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部