首页 > 其他分享 >btoa atob 与 base64,以及btoa报错

btoa atob 与 base64,以及btoa报错

时间:2023-12-12 18:00:50浏览次数:38  
标签:编码 Base64 btoa 字符串 报错 atob ASCII

在 JavaScript 中,btoaatob 是两个用于 Base64 编码和解码的函数。下面是对这两个函数以及 Base64 的解释和代码示例:

  1. btoa 函数:btoa(表示 base64 encode)将字符串转换为 Base64 编码的数据。它接受一个 ASCII 字符串参数,并返回经过 Base64 编码的字符串。
  • b 表示 "binary",它指示函数处理二进制数据的能力。
  • toa 是 "to ASCII" 的缩写,表明函数将数据从一种格式转换为 ASCII 字符串。

代码示例:

const originalString = 'Hello, World!';
const encodedString = btoa(originalString);
console.log(encodedString); // 输出:SGVsbG8sIFdvcmxkIQ==

btoa处理中文会报错,解决方案是先编译:

var str = '?title=标题&url=https://www.baidu.com'
var strA = window.btoa(encodeURIComponent(str))
var strB = decodeURIComponent(window.atob(strA))
console.log(strA) // 'JTNGdGl0bGUlM0QlRTYlQTAlODclRTklQTIlOTglMjZ1cmwlM0RodHRwcyUzQSUyRiUyRnd3dy5iYWlkdS5jb20='
console.log(strB) // '?title=标题&url=https://www.baidu.com'


  1. atob 函数:atob(表示 base64 decode)将已经进行 Base64 编码的数据解码为原始字符串。它接受一个 Base64 编码的字符串参数,并返回解码后的 ASCII 字符串。
  • a 表示 "ASCII",表明函数可以将 ASCII 字符串转换回原始格式。
  • tob 是 "to binary" 的缩写,表示函数将数据从 ASCII 字符串转换为二进制格式。

代码示例:

const encodedString = 'SGVsbG8sIFdvcmxkIQ==';
const originalString = atob(encodedString);
console.log(originalString); // 输出:Hello, World!

  1. Base64 的名称源自它使用了 64 个字符的 ASCII 子集来表示二进制数据。具体来说,Base64 使用了大小写字母 A-Z、a-z、数字 0-9 以及两个额外的特殊字符 "+" 和 "/"(有时还会有 "=" 符号用于填充)。


    Base64 编码原理很简单:每 3 个字节(24 位)的数据被分割成 4 个 6 位的组合,然后再转换成对应的 ASCII 字符。如果原始数据的字节数不是 3 的倍数,则会在末尾添加一个或两个填充字符(通常是 "=")。


    解码时,将 4 个 Base64 字符组合成 3 个字节的形式。


    Base64 编码的优点包括:


    a. 可读性:Base64 编码使用 ASCII 字符,因此可以在文本环境中容易处理和传输。


    b. 广泛支持:Base64 编码和解码算法在各种编程语言和网络传输协议中都有广泛支持,使得数据可以在不同平台之间进行可靠和兼容的传输。


    c. 安全性:由于 Base64 编码后的数据只包含 ASCII 字符,而不是原始二进制数据,因此可以安全地传输(例如,通过电子邮件)而无需担心字符集或二进制数据导致的问题。
    需要明确的是,Base64 编码不是加密算法。它只是一种将二进制数据表示为文本的转换方法,并没有提供任何数据保护或隐私保密性。

总之,Base64 编码在计算机领域中广泛应用于网络传输、数据存储和数据处理等场景,旨在解决非 ASCII 字符的可靠处理和传输问题。

标签:编码,Base64,btoa,字符串,报错,atob,ASCII
From: https://www.cnblogs.com/ziChin/p/17897499.html

相关文章

  • vite编译为什么会报错“__vite-browser-external:node:path、fs、url...”
    当你在使用Vite打包时,遇到类似于`__vite-browser-external`的错误消息,通常是因为在代码中尝试导入浏览器不支持的模块。`__vite-browser-external`是Vite内部的一个机制,用于替换浏览器环境中无法直接访问的Node.js核心模块。例如,浏览器不具备文件系统访问能力,因此Node.......
  • 解决Python爬虫中Header报错的方法
    在使用Python编写爬虫时,有时会遇到Header报错的情况。本文将介绍常见的Header报错类型,并提供解决方法,帮助您顺利处理Python爬虫中的Header报错问题。当我们使用Python进行爬虫开发时,经常需要设置请求头(Header)来模拟浏览器发送请求。然而,有时可能会遇到一些与Header相关的报错。以下......
  • Python网络连接request报错:OSError: [Errno 113] No route to host
    报错:(pytorch)devil@Monster:~$huggingface-clilogin_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|......
  • gh-ost 报错 ERROR 1236 (HY000): A slave with the same server_uuid/server_id as t
    使用gh-ost 对表在线加索引时,第一次发生了下面的报错(使用gh-ost很长时间了,第一次遇到这个报错):[2023/12/1211:48:08][error]binlogstreamer.go:77closesyncwitherr:ERROR1236(HY000):Aslavewiththesameserver_uuid/server_idasthisslavehasconnectedtoth......
  • 【常见问题】Python报错SyntaxError: Non-ASCII character '\\xe7' in file
    错误原因:windows默认编码格式是GBK,macOS,linux是utf-8。当使用windows且代码内有GBK不支持的字符集的时候,就会报错。解决方法:方法一在python文件的顶部加上编码格式#-*-coding:utf-8-*-方法二在python3.7以及之后,使用utf-8模式https://peps.python.org/pep-0540/pyt......
  • Teamcenter AWC开发报错 ESLintError in plugin "gulp-eslint"
    1、npmrunrefresh没有报错,npmrunbuild会报错✖34problems(1error,33warnings)0errorsand12warningspotentiallyfixablewiththe`--fix`option.[08:47:54]'audit'erroredafter6.31s[08:47:54]ESLintErrorinplugin"gulp-eslint&quo......
  • soapui报错: CXF directory must be set in global preferences
    文章目录下载官网下载网盘下载配置soapui生成代码时报错CXFdirectorymustbesetinglobalpreferences下载需要下载apache-cxf。官网下载官网地址:https://www.apache.org/dyn/closer.lua/cxf/3.5.4/apache-cxf-3.5.4.zip点如下地址即可。Theobjectisinourarchive......
  • 报错:Client does not support authentication protocol requested by server; consider
    IDEA启动项目登录时显示用户或密码错误或者连接mysql数据库时报错原因:mysql8之前的版本中加密规则是mysql_native_password,而在mysql8之后,加密规则是caching_sha2_password,所以可以需要改变mysql的加密规则打开cmd窗口,登录mysql;mysql-uroot-h127.0.0.1-P3306-p......
  • vite5报错Uncaught ReferenceError: require is not defined的代替方案
    constfiles=import.meta.glob('./*.js',{eager:true})//会得到一个对象注意引入路径里绝对不能带有变量,会报错//{eager:true}是定义是否同步引入的参数,去掉会得到几个异步函数,根据自己的需求写就行了console.log(files["./env."+import.meta.env.MODE+".js"].default......
  • Vue报错:error Mixed spaces and tabs no-mixed-spaces-and-tabs
    Vue报错:errorMixedspacesandtabsno-mixed-spaces-and-tabs一、解释在开发过程中使用了ESLint,用来规范代码风格。ESLint是语法检查工具,缺点是对所写代码要求过于严格。这里是因为空格的使用导致的。二、报错可能出现的地方我第一次出现这个问题是在App.vue文件的<scr......