1.应用场景

浏览器作为网络的入口之一, 未来 将会发挥更大的价值。

弄懂它的原理,熟练使用可以帮助我们收获一些东西。

2.学习/操作

1. 文档阅读

浏览器工作原理和实践_参透了浏览器的工作原理,你就能解决80%的web前端难题

面试官:浏览器输入URL后发生了什么?

你知道 URI中的 “//” 有什么用吗?  //

浏览器缓存机制详解

& chatgpt

2. 整理输出

1. 浏览器 URL是区分大小写的,至于有时候请求到服务器[开发/测试/线上],依然能正常请求处理。

原因有:

服务器系统[Windows不区分大小写, Linux区分]
服务器脚本做了处理, 接收时处理为系小写/大写, 比如有些php框架会做处理.

截图如下:

Window 10 /备注: 这里输入CaseSensitive.php 浏览器直接转换为caseSensitive.php  原因TBD

阿里 ECS

2. 调试 --- 发送请求[xhr]

有时候,我们想测试模拟[xhr]请求, 有时候还会修改下参数[比如参数值], 可以如下的步骤 

不论是否要登录, 或者一些访问验证, 整个都拷贝下来便可. 服务器其实并不知道给它发送请求的是浏览器还是请求模拟器, 如postman等.

2.1 使用Chrome, 打开F12[开发者工具]-->network-->选择目标请求-->右键-->copy

这里选择 Copy as cURL (bash) 截图如下:

2.2 打开文本编辑器粘贴, 然后修改,某些参数  ---- 如果不需要, 则可以跳过该步骤.

2.3 打开git bash,复制粘贴文本到命令行中,回车即可。

以上参数:仔细看,应该看得明白~

补充

重新发送XHR请求

直接使用Devtool的Replay XHR 即可

会重新发送请求一次。

3.URI中的 “//” 有什么用?// 面试官给我挖坑

你知道 URI中的 “//” 有什么用吗?_穿素白衫的中少年的博客-CSDN博客

简单说, 没啥用,多此一举[现在还是使用是历史原因]

4.浏览器缓存   20200607

浏览器缓存机制详解 

5. 浏览器【chrome】读取缓存的方式有:

(from disk cache)

(from memory cache)

正常响应:没有读取缓存。 // 可以看到状态码都是 200

后续补充

...

3.问题/补充

TBD

后续补充

...