浏览器编码流程

一、预备知识
背景:本文主要介绍html编码、url编码、js编码在浏览器端的解析过程,以及编码对js执行的影响

URL编码:
一个百分号和该字符的ASCII编码所对应的2位十六进制数字,例如“/”的URL编码为%2F(一般大写,但不强求)

HTML实体编码:
命名实体:以&开头,分号结尾的,例如“<”的编码是“<”
字符编码:十进制、十六进制ASCII码或unicode字符编码,样式为“&#数值;”,例如“<”可以编码为“<”和“<”

JS编码:js提供了四种字符编码的策略,
1、三个八进制数字,如果不够个数,前面补0,例如“e”编码为“\145”
2、两个十六进制数字,如果不够个数,前面补0,例如“e”编码为“\x65”
3、四个十六进制数字,如果不够个数,前面补0,例如“e”编码为“\u0065”
4、对于一些控制字符,使用特殊的C类型的转义风格(例如\n和\r)
5、其他编码,例如JSFUCK

二、解析过程
1.接收响应-->html decode-->url decode-->js decode(根据具体情况,可能是url解码在前,也可能是js解码在前)

三.解析实例--对JS解析的影响
1、源码:
test0

2、全部进行html编码:


浏览器编码流程_第1张图片

test0
根据解析过程,先进行html解码,转换为(test0)字符串输出,但是只是字符串,所以无法执行url解码、js解码,为什么无法执行url、js解码呢,因为url、js解析器,未在html解码过程中识别出协议类型、js函数。

3、全部进行js解码:
\u0026\u006c\u0074\u003b\u0061\u0020\u0068\u0072\u0065\u0066\u003d\u006a\u0061\u0076\u0061\u0073\u0063\u0072\u0069\u0070\u0074\u003a\u0061\u006c\u0065\u0072\u0074\u0028\u0031\u0029\u0026\u0067\u0074\u003b\u006a\u0073\u0026\u006c\u0074\u003b\u002f\u0061\u0026\u0067\u0074\u003b
未符合html解码,所以直接输出相同的字符串,浏览器解析过程,先进行html解码,这里未发现需要html解码的编码。

4、对href属性内容进行url编码
test
注:url编码不能对协议类型进行任何编码操作,这里对javascript协议类型进行编码,导致url解析器认为它是无类型,被编码的javascript没有解码,所以不会被url识别。

5、test1
未对javascript进行编码,url解析器识别后调用js解析器进行解析,造成弹窗

6、test
注:像圆括号、双引号、单引号等等这些控制字符,在进行JavaScript解析的时候仅会被解码为字符串文本或者标识符名称

7、test
正常弹窗

8、符合编码
test

test

参考:
https://www.html5rocks.com/zh/tutorials/internals/howbrowserswork/
https://security.yirendai.com/news/share/26
http://www.freebuf.com/articles/web/100675.html
http://taligarsiel.com/Projects/howbrowserswork1.htm
https://www.jianshu.com/p/cfdf1747d30e

你可能感兴趣的:(浏览器编码流程)