Base64 编码原来这么简单

大家好,我是若川。持续组织了8个月源码共读活动,感兴趣的可以 点此加我微信ruochuan12 参与,每周大家一起学习200行左右的源码,共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外:目前建有江西|湖南|湖北籍前端群,可加我微信进群。


做了六七年程序员,经常用到 Base64 编码,但对于为什么要用,以及它的原理,一直是不求甚解。最近在某本书上看到了 Base64 的编码原理,原来这么这么这么简单。

Base64 解决了什么问题

假如我们要在网络中传输下面的问题

你好  小朋友我是砖家你是谁?

这段文本中包含了空格、换行、回车等不可见字符,在网络传输中,各个设备对不可见字符处理机制可能不同,会存在信息传输错误的情况。此时我们就需要一种编码机制,把不可见字符统统转成可见字符。

Base64 编码原理

接下来我们通过将 abcd二字转为 Base64 编码,来了解下它的原理。

  1. 把字符三三分组,不够时通过 0 补齐。比如 abc三个字符归一组,d 不够三位,通过 0 补齐为 d00

5ee082dbea311459de2486b4fe67d264.png

  1. 把字符转换成二进制 ASCII 编码

d88b2375c62e4471a8959da34b481751.png

  1. 把转换后的二进制,每六位分隔开

6bab7ad1209b876a59d556d58d0e0400.png

Q:为什么第一步需要分三个字符一组?

A:因为 ASCII 码每个字符是 8 位二进制,3 * 8 = 24。正好可以被第三步拆分为 4 个 6 位二进制,4 * 6 = 24。

  1. 6 位二进制能代表 0-63,我们有一个彩虹表,可以将 0-63 分别对应一个字符,彩虹表如下:

d2cb4bb7889bc3d794d69c98c4af623a.png

通过彩虹表,我们可以将每 6 位分割后的二进制做一次转换

c663d157e12f846b5ef765d706fab538.png

需要注意的是,凡是补位产生的 0,需要用 = 来表示。所以最后的两位都是 =

最后 abcd 转换为 Base64 编码后为 YWJjZA==,整体原理还是比较简单的,不涉及到高深的算法。

Base64 周边

  1. 由于 Base64 转码后会包含 +/=字符,在 URL 不能正常传输。所以有一种 URL 友好型的 Base64 编码,它存在使用 _-来代替 +/,并且不在末尾追加 =

  2. Base32、Base16 的原理和 Base64 基本一致

  3. Base64 并不适合加密,因为解密太简单了

  4. 汉字通过 gb2312utf-8gbk编码后,即可转成二进制处理。这里借用网上的一个图片说明:77c90d1a10f468a3177341957e24af68.png

Base58 与 Base58Check

Base58 是比特币在生成钱包地址时使用的一种编码形式。它和 Base64 的主要区别是去掉了肉眼容易看错的字符 0(零)、O(大写字母 O)、I(大写字母 i)、l(小写字母 L)和几个影响双击选择的字符:/ 和 + 这种编码的目的比较简单,就是防止在转账时,看错账号,转错账。Base58 的原理更简单一些,只涉及到进制的转换,大致步骤如下:

  1. 将字符转成 ASCII 码

  2. 将 ASCII 码转换成 58 进制

  3. 通过彩虹表映射即可

比如 abcd转换:

  1. 转成 ASCII 码 97-98-99-100

  2. 转换成 58 进制 3-28-21-49-5-22

  3. 通过如下彩虹表映射为 3VNr6P

2a25fd61444366f46bb1fb38680ad214.png

Base58Check 编码,顾名思义是可以对 Base58 编码进行检查。比如我在传输 qH912cvztx编码时,如果网络异常等各种原因,导致数据错乱或丢失,接收方要能够识别出来数据有问题。Base58Check 编码基本原理如下:

  1. 在 data 前面添加一个版本标识 prefix,用来识别编码的数据类型,比如比特币地址的前缀是 0(十六进制是 0x00)

  2. 通过 hash 算法计算 prefix + data的 hash 值:SHA256(prefix + data)

  3. 将生成的 hash 值截断为前四位,拼接到后面 prefix + data + 4 位 hash

  4. 将上一步生成的结果进行 Base58 编码计算,得到最终结果


1887dce8db56578cb08565427c685412.gif

················· 若川简介 ·················

你好,我是若川,毕业于江西高校。现在是一名前端开发“工程师”。写有《学习源码整体架构系列》20余篇,在知乎、掘金收获超百万阅读。
从2014年起,每年都会写一篇年度总结,已经坚持写了8年,点击查看年度总结。
同时,最近组织了源码共读活动,帮助4000+前端人学会看源码。公众号愿景:帮助5年内前端人走向前列。

a37aa89e4e0d2e5f7caad0b5bd28243c.png

扫码加我微信 ruochuan12、拉你进源码共读

今日话题

目前建有江西|湖南|湖北 籍 前端群,想进群的可以加我微信 ruochuan12 进群。分享、收藏、点赞、在看我的文章就是对我最大的支持~

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

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

相关文章

spring事物 设计模式_是什么使事物变得美丽,以及如何在设计中使用它

spring事物 设计模式What do you think about the phrase “beautiful design”? You like it, don’t care or does it make you wince?w ^帽子你想想那句“美丽的设计”? 您喜欢它,不在乎还是让自己畏缩了? For many, “beautiful” is …

历时一个月!50+Vue经典面试题详解,值得收藏!

大家好,我是若川。持续组织了8个月源码共读活动,感兴趣的可以 点此加我微信ruochuan12 参与,每周大家一起学习200行左右的源码,共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

页面滚动时触发图片逐帧播放_如何在滚动效果上创建逐帧运动图像

页面滚动时触发图片逐帧播放A step by step guide on how to create that dynamic image background you see everywhere.有关如何创建随处可见的动态图像背景的逐步指南。 内容 (Content) Introduction 介绍 Result demo 结果演示 Prerequisite 先决条件 Step by step guide …

前端监控的搭建步骤,别再一头雾水了!

大家好,我是若川。持续组织了8个月源码共读活动,感兴趣的可以 点此加我微信ruochuan12 参与,每周大家一起学习200行左右的源码,共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

1812:网格_指导设计:网格的历史

1812:网格The grid has long played a central role in the development of art and design due to its organizational nature; acting as a matrix for controlling the placement of elements. In art: Foreground and background. In design: Image and type. And so on.网…

HDU ACM 1728 逃离迷宫 (广搜BFS)

http://acm.hdu.edu.cn/showproblem.php?pid1728 题意:给出一张图,转弯数k,起点(x1,y1),(x2,y2)判断能不能最多只转k个弯时从起点走到终点 输入时注意起点与终点是先y后x的 思路:用point[4][2]表示方向向量,每次遍历遍历一行或者一列,遍历时要注意遇到遍历过的点要跳过去,继续…

Element使用的async-validator表单校验库源码超详细解析

大家好,我是若川。持续组织了8个月源码共读活动,感兴趣的可以 点此加我微信ruochuan12 参与,每周大家一起学习200行左右的源码,共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

从零手写 Vue 之响应式系统

大家好,我是若川。持续组织了8个月源码共读活动,感兴趣的可以 点此加我微信ruochuan12 参与,每周大家一起学习200行左右的源码,共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

WPF 分页控件应用

效果图&#xff1a; 前台代码&#xff1a; <UserControl x:Class"Layout.UI.Comm.Pager"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml"xmlns:mc"http:/…

李宁品牌重塑_迈伊多品牌重塑的幕后

李宁品牌重塑This post was originally published on the Maido blog.这篇文章最初发表在 Maido博客上 。 You might notice that we’ve had a little facelift at Maido. Or you might not — and that’s totally fine. What we launched at the end of last year was not r…

搭建前端监控,如何采集异常数据?

大家好&#xff0c;我是若川。持续组织了近一年的源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。…

产品经理如何提高创造力_如何提高产品设计师的创造力

产品经理如何提高创造力When David Kelley, Bill Moggridge, and Mike Nuttall founded IDEO, a consulting firm that would become one of the most innovative companies of the late 90s, they brought a new perspective in product development.当大卫凯利(David Kelley)…

Github上8个很棒的Vue项目

大家好&#xff0c;我是若川。持续组织了近一年的源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。…

python 投资组合_成功投资组合的提示

python 投资组合Lately, I’ve had some free time during my job transition and have been reviewing a few of my friends’ design portfolios. Gradually, I found some common themes around the feedback I’ve given. And it occurred to me that others might find so…

Github上8个很棒的React项目

大家好&#xff0c;我是若川。持续组织了近一年的源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。…

屏幕广播系统_如何设计系统,而不是屏幕

屏幕广播系统重点 (Top highlight)Over the past several decades, rapid advances in technology have dramatically enhanced the digital customer experience and their expectations. In the face of these heightened customer expectations, the role of the Interactio…

Umi 4 发布啦

大家好&#xff0c;我是若川。持续组织了近一年的源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。…

Win32汇编--加载菜单资源

基本上的窗口都会有一个菜单,现在就来看看Win32汇编中是如何加载菜单的: 1>在工程中添加新的菜单资源 2>双击新添加的菜单资源进行编辑 3>菜单栏:Make->Compile RC来编译资源文件 4>导出资源中的ID号并写到数据段的.const中 5>下面是完整的源代码供参考:(工程…

Futura:从纳粹主义到月球-甚至更远

Reading the title of this article, the first thing that will come to mind for some is the funny expression of Buzz Lightyear — the Disney character — when he stretches his arms outwards and utters the famous phrase “To infinity and beyond!” before jump…

如何碎片化时间高效学习前端~

前端技术日新月异&#xff0c;发展迅速&#xff0c;作为一个与时俱进的前端工程师&#xff0c;需要不断的学习。这里强烈推荐几个前端开发工程师必备的优质公众号&#xff0c;希望对你有所帮助。大家可以像我一样&#xff0c;利用碎片时间阅读这些公众号的文章。前端从进阶到入…