All about encode & decode

我对编码解码的认识来源于两组js的内置API:

  • encodeURI & encodeURI
  • encodeURIComponent & decodeURIComponent

一直以来,我认为encode/decode就是为了“转义(escape)”,比如, 如果我需要在query string中加入一些保留关键字如?,#, &时,如果不做encode那么就会导致错误。

但是,我还没有真正遇到过因为没有做encode而造成的bug. 所以,其实我一直很疑惑为什么要编码解码?

why we encode/decode?

通过读这篇文章(https://www.urlencoder.io/learn/#url-encoding-percent-encoding),我了解到我一直以来的认知倒也没错。URL只能包含ASCII中的有限字符,不能包含特殊字符比如!@,以及保留字符(也就是对于URL本身有特殊含义的比如/#?:),这是约定俗成。如果不遵照规范,可能会出现bug。

既然如此,为什么不让浏览器自己转?
我发现网浏览器地址栏输空格再回车,确实会帮忙自动转成%20。所以设计这两个API,可能是因为URL不仅流通在浏览器地址栏,还可能流通在代码中,比如可能将要用XHR直接在代码中发出网络请求。

那么,encode 和 decode 到底怎么工作的?跟ASCII,UTF-8有关吗?

How encode/decode works?

首先,我们需要了解在计算机的历史上,机器的语言和人的语言之间如何互相翻译。

ASCII ,UTF 是什么?

找到了一篇非常好的文章,来阐述这个问题。https://blog.hubspot.com/website/what-is-utf-8

简单来说,计算机只能理解二进制数据,准确的来说其实是电流信号,比如0101->低高低高。但是人只能理解各自的语言,让人的语言和计算机的语言能够互相翻译,就需要编码。

很早之前,计算机技术还不发达,只有灯塔国用计算机,那么他们就只给英文用到的字符编码,这其实就是ASCII,用一个byte也就8个bits来表示字母。


https://ascii-tables.com/

但是随着计算机技术的发展,世界上很多别的语言体系也需要编码了,ASCII的256个字符明显不够用了。

这时候就出现了Unicode, 可以简单理解为它会为任何语言的任何字符一个身份证号,至于具体的实现原理很复杂,我还没研究。有了Unicode, 极大扩展了字符容量,甚至表情也可以有编码。

但是这还不够,因为Unicode只是一种规范,还并没有对应的实现。这时候的编码还不是010101这种二进制的,计算机依旧不能理解,那么UTF-8就出来了。

UTF-8可以将每个code point转成1,2,3,4个byte的二进制串。这里有一个很巧秒的策略,对于那些常用的字符,用1个byte,比如ASCII中的所有字符,在UTF-8中依旧使用1个byte来表示的,不常用的则用更多的byte来存,整体来看,可以节约不少存储空间。UTF-8目前已经是全球认可的编码规范了。

UTF-16相比UTF-8的区别是,它将code point转成2个或者4个bytes, 只在一些非英语的语言中使用到。

中国的编码系统怎么来的?

英文的话,总共就26个字母,但是中文文字多多了,怎么指定Unicode,是什么组织起草维护,提交,进入国际规范的?

在知乎找到了一篇通俗易懂的解答:
Unicode 和 UTF-8 有什么区别? - 盛世唐朝的回答 - 知乎
https://www.zhihu.com/question/23374078/answer/69732605

那base64编码又是什么?

Base64 encoding encodes any binary data or non-ASCII text data to printable ASCII format so that it can be safely transmitted over any communication channel.

同样在知乎找到一个简单易懂的解答:
让你彻底理解Base64算法(Base64是什么,Base64解决什么问题,Base64字符串末尾的=是什么) - shusheng007的文章 - 知乎
https://zhuanlan.zhihu.com/p/384238870

简单来说,如果直接在不同的网络设备中传输二进制,可能会遇到一些数据被当成特定系统的特殊含义字符,所以将二进制再转成ASCII,避免错误。

encodeURI & encodeURIComponent使用的是什么编码方式?

The encodeURI() function encodes a URI by replacing each instance of certain characters by one, two, three, or four escape sequences representing the UTF-8 encoding of the character (will only be four escape sequences for characters composed of two "surrogate" characters).

当看到one, two, three, or four escape sequences就可以得知,就是UTF-8编码了,以为只有UTF-8是可变长的编码。

那么,为什么空格会变成%20而不是20呢?
http://www.jsons.cn/utf8/ 根据实验结果,%是一个分隔符。

不过为什么ecodeURI不编码 A-Z a-z 0-9 ; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #呢?因为它是针对一个完整的URI编码,如果编码这些字符会造成错杀。

encodeURI 与 encodeURIComponent的区别

see: http://xkr.us/articles/javascript/encode-compare/
总地来说, encode一个完整的URI的时候用前者,他会忽略
~!@#$&()=:/,;?+'
只是encodeURI中的一部分时,用后者,它仅忽略
~!
()'

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 230,622评论 6 544
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 99,716评论 3 429
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 178,746评论 0 383
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 63,991评论 1 318
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 72,706评论 6 413
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 56,036评论 1 329
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 44,029评论 3 450
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 43,203评论 0 290
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 49,725评论 1 336
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 41,451评论 3 361
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 43,677评论 1 374
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 39,161评论 5 365
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 44,857评论 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 35,266评论 0 28
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 36,606评论 1 295
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 52,407评论 3 400
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 48,643评论 2 380