• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > javascript使用btoa和atob来进行Base64转码和解码

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

作者:jiangxiaobo 字体:[增加 减小] 来源:互联网 时间:2017-05-11

jiangxiaobo通过本文主要向大家介绍了javascript btoa,btoa,window.btoa,js btoa,btoa是什么意思等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

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

好了,前言说了一大堆,Base64转码和解码有哪些方法:

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

var str = 'javascript';

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

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

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

var str = "China,中国"
window.btoa(str)
</div>

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,中国"
</div>

btoa与atob的使用方法就是这么简单,大家可以尝试一下。希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

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

相关文章

  • 2017-05-11Java中int与integer的区别(基本数据类型与引用数据类型)
  • 2017-05-11微信小程序 在线支付功能的实现
  • 2017-05-11jQuery实现的简单排序功能示例【冒泡排序】
  • 2017-05-11微信小程序实现图片轮播及文件上传
  • 2017-05-11AngularJS双向绑定和依赖反转实例详解
  • 2017-05-11微信小程序中子页面向父页面传值实例详解
  • 2017-05-11JavaScript & jQuery完美判断图片是否加载完毕
  • 2017-05-11discuz表情的JS提取方法分析
  • 2017-05-11Bootstrap警告(Alerts)的实现方法
  • 2017-05-11JS二叉树的简单实现方法示例

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 浅谈JavaScript中的apply/call/bind和this的使用
    • vue.js学习笔记:如何加载本地json文件
    • three.js绘制地球、飞机与轨迹的效果示例
    • Angular.js实现多个checkbox只能选择一个的方法示例
    • jquery插件ContextMenu设置右键菜单
    • 原生js实现放大镜
    • EasyUi 打开对话框后控件赋值及赋值后不显示的问题解决办法
    • Javascript 高性能之递归,迭代,查表法详解及实例
    • 微信小程序访问node.js接口服务器搭建教程
    • js Canvas绘制圆形时钟效果

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有