HTMLDOM中的API之btoa和atob

news2024/11/30 10:52:10

btoa()

btoa() 方法可以将一个二进制字符串(例如,将字符串中的每一个字节都视为一个二进制数据字节)编码为 Base64 编码的 ASCII 字符串。

  • 示例:
let encodedData = window.btoa("Hello, world"); // 编码
let decodedData = window.atob(encodedData);    // 解码

在这里插入图片描述

atob()

atob() 对经过 base-64 编码的字符串进行解码。

  • 示例:
let encodedData = window.btoa("Hello, world"); // 编码
let decodedData = window.atob(encodedData);    // 解码

在这里插入图片描述


但是,使用btoa不可以对中文字符进行编码,可以使用encodeURIComponent包裹一下


encodeURIComponent

encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。

该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( )

其他字符(比如 :;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号),都是由一个或多个十六进制的转义序列替换的。

decodeURIComponent

decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。

所以,我们在对字符串进行编码解码的时候可以使用如下:

let str = btoa(encodeURIComponent('你好')) // 编码
decodeURIComponent(atob(str)) // 解码

如果是数组、对象,我们还可以使用JSON包裹一下:

let str = btoa(encodeURIComponent(JSON.stringify({}))) // 编码
JSON.parse(decodeURIComponent(atob(str))) // 解码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/41207.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【C++笔试强训计划】第一天

遇事不决,可问春风,春风不语,即随本心 欢迎来到我的笔试强训计划专栏,这是计划正式开始的第一天。另外,我想说的是:博主本身水平有限,本专栏只作为学习笔记分享记录使用,对于一些题目…

Linux中如何获得进程的运行时堆栈

关于这个话题,我们一般是为了处理一下生产环境中程序出现死循环或者死锁等问题。我们一般想到的方法就是gdb attach上一个运行中的进程。但是这个需要手动交互。通过网上查找和实践,可以有以下几种选择: 第一种:pstack 进程ID …

【电商】管理后台--采购管理(执行层)

采购,从表面上看是公司花钱的部门,实则担负了寻找、管理供应商的重任,确保公司绝大部分的供应链成本可以保质、保量的完成。 现在很多电商企业,都不自己生产产品,产品的来源基本上都是从供应商那里采购,所以…

【服务器搭建】教程四:域名怎样进行备案?快来看~

前言 购买一台服务器,再来个域名,搭建一个自己的个人博客网站,把一些教程、源码、想要分享的好玩的放到网站上,供小伙伴学习玩耍使用。我把这个过程记录下来,想要尝试的小伙伴,可以按照步骤,自己…

你好,法语!A2知识点总结(1)

1.语式及时态 语式: 1.1直陈式: -直陈式现在时 1)动词变位: 以er结尾的动词为第一组动词 变位规则: 去er,得到词根,加上相应词尾 e es e ons ez ent 第二组动词变位 以ir结尾为第二组动词…

LeetCode 图解 | 141.环形链表

141.环形链表题目描述思路分析快慢指针思想代码实现题目描述 给你一个链表的头节点 head ,判断链表中是否有环。 如果链表中有某个节点,可以通过连续跟踪 next 指针再次到达,则链表中存在环。 为了表示给定链表中的环,评测系统内…

Nuxt 3.0.0正式发布,集成Element Plus和Ant Design Vue脚手架

发布说明 Nuxt 是使用简便的 Web 框架,用于构建现代和高性能的 Web 应用,可以部署在任何运行 JavaScript 的平台上。 Nuxt 3.0 11天前正式发布了稳定版,3.0 基于 Vue 3,为 TypeScript 提供了 “一等公民” 支持,并进行…

【Unity3D】卷轴特效

1 原理 当一个圆在地面上沿直线匀速滚动时,圆上固定点的运动轨迹称为旋轮线(或摆线、圆滚线)。本文实现的卷轴特效使用了旋轮线相关理论。 以下是卷轴特效原理及公式推导,将屏幕坐标 (x) 映射到纹理坐标 (u)。 注意:屏…

Controller Area Network(CAN)简介

文章目录前言-什么是通讯?一、CAN是什么?二、CAN的应用示例CAN网络细分三、CAN发展历史四、汽车网络汇总总结前言-什么是通讯? “通讯是两个或两个以上参与者之间交换信息的有意识活动,目的是通过符号和语义规范的共享系统来发送…

微服务系列之初探“微服务架构”

随笔 有时你必须对你想得到的东西充满敬畏。 参考书籍: “凤凰架构”“微服务架构设计模式” 在了解微服务架构之前我们有必要解答“什么是架构”、“什么是架构的风格”这两个问题,同时需要带着“架构并不是被发明出来的,而是持续演进的…

[AI] LRTA*ls(k)搜索算法

LRTA*LS[K]一、LRTA*(K)算法的缺点二、LRTA∗LS(k)LRTA*_{LS}(k)LRTA∗LS​(k)算法1、选择局部空间2、更新局部空间论文在这里! 一、LRTA*(K)算法的缺点 LRTA*(K)算法每次要更新队列Q里的state,但有三点缺陷: 如果state y进入 Q&#xff0c…

【网络工程】6、防火墙介绍及配置实操

接上篇《5、路由器介绍及配置实操》 之前我们讲解了网络设备路由器的介绍,以及完成了路由器的相关配置实操。本篇我们来讲解防火墙的基础知识以及相应的实操案例。 一、什么是防火墙? 防火墙是一个安全产品,它可以把安全的内网和不安全的外网…

【前端】jQuery-概述+基本使用+常用API

目录 一、jQuery概述 1.1JavaScript库 1.2jQuery的概念 二、jQuery的基本使用 2.1jQuery的下载 2.2jQuery的使用步骤 2.3jQuery的入口函数 2.4jQuery的顶级对象$ 2.5jQuery对象和DOM对象 三、jQuery常用API 3.1jQuery选择器 3.1.1jQuery基础选择器 3.1.2jQuery层级选…

Linux下C语言实现HTTP文件服务器和TCP协议实现网络数据传输

在实际开发中经常用到web框架,比如Servlet,SpringBoot等,这些开发框架提高了我们的开发效率,节省了开发时间。但是这会令我们技术人员处于浮云之上,看不到其本质。说实话,Java语言那么流行,其本…

springboot-自动配置

一、简介 在搭建springboot应用的时候,无需像之前spring的时候,要一堆繁琐的配置文件之类的。一个main的方法,就能把springboot的项目run起来。和其他框架整合也是非常的简单,只需要使用到Enablexxxxx注解就可以搞起来。 二、原理…

外卖项目09---Redis了解

目录 Redis了解 141 一、Redis入门 143 1.1Redis简介 143 1.2Redis下载与安装 143 1.3Redis入门---Redis服务启动 144 1.3.1Redis服务启动 1.3.2设置密码远程连接 二、Redis数据类型 145 三、Redis常用命令 146 3.1Redis常用命令---字符串string操纵命令 3.2Redis…

现代密码学导论-21-分组密码

目录 3.6.3分组密码及其操作模式 ECB(Electronic Code Book) 电码本模式 CBC(Cipher Block Mode) 密文分组链接方式 THEOREM 3.32 CBC模式的CPA安全 连锁CBC模式 OFB(Output Feedback Mode) 输出反馈模式 CTR(Counter) 计数器模式 THEOREM 3.33 CTR多明文PCA安全 THE…

C语言学习之路(基础篇)—— 复合类型(自定义类型)

说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 结构体 1) 概述 数组:描述一组具有相同类型数据的有序集合,用于处理大量相同类型的数据运算。 结构体:将多个…

工具分享:Springboot+Netty+Xterm搭建一个网页版的SSH终端

一. 简述 搭建一个web ssh,主要是借助websocket和xterm,可以实现一个类似于xshell的效果,如图: 二. 技术栈 这里使用了springboot、netty、jsch、react、Ts,xterm。 这里我用了springboot和netty实现了websocket,js…

稳了,我用 Python 可视化分析和预测了 2022 年 FIFA 世界杯

许多人称足球为 “不可预测的游戏”,因为一场足球比赛有太多不同的因素可以改变最后的比分。 预测一场比赛的最终比分或赢家确实是很难的,但在预测一项比赛的赢家时就不是这样了。在过去的5年中,Bayern Munich 赢得了所有的德甲联赛&#xf…