完整的url 解析

Posted guangzhou11

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了完整的url 解析相关的知识,希望对你有一定的参考价值。

1.解析输入的URL地址

http://www.baidu.cn:80/index.html?lx=teacher#video

  • 传输协议(把信息在客户端和服务器端进行传递,类似于快递小哥)

    • http 超文本传输协议(传输的内容除了文本,还有可能是其它类型:二进制编码、BASE64码、文件流等等)

    • https 比HTTP更加安全的传输协议(传输通道设置加密算法SSL),一般支付类网站都是HTTPS协议

    • ftp 资源上传协议,一般应用于把本地文件直接上传到服务器端

  • 域名 zhufengpeixun.cn

    • 一级域名 www.baidu.cn

    • 二级域名 video.baidu.cn

    • 三级域名 webG.video.buidu.cn

    • 常用域名性质:.com国际 / .cn中国 / .gov政府 / .org官方 / .net系统 / .io博客 / .vip ...

  • 端口号 (根据端口号,找到当前服务器上指定的服务)

    • 0~65535之间

    • 不同协议有自己默认的端口号(也就是自己不用写,浏览器会帮我们加上)

      • http => 80

      • https => 443

      • ftp => 21

      • 除这几个在书写的时候可以省略,其余的不能省

  • 请求资源的路径和名称

    • /stu/index.html

      • 一般情况下,如果我们访问的是index.html等,可以省略不写(因为服务端一般会设置index.html为默认文档,当然可以自定义)

    • 伪URL

  • 问号传参部分 ?xxx=xxx

    • 客户端基于GET系列请求,把信息传递会服务器,一般都会基于问号传参的模式

    • 页面之间跳转,信息的一些通信也可以基于问号传参的方式(单页面中组件和组件跳转之间的信息通信,也可能基于问号传参)

    • 关于传递的内容需要进行编码处理(处理特殊字符和中文)

      • encodeURI / decodeURI

      • encodeURIComponent / decodeURIComponent

      • escape / unescape

      • ...

  • 设置哈希HASH #xxx

2.DNS解析

网站中,每发送一个TCP请求,都要进行DNS解析(一但当前域名解析过一次,浏览器一般会缓存解析记录,缓存时间一般在1分钟左右,后期发送的请求如果还是这个域名,则跳过解析步骤 =>这是一个性能优化点)

真实项目中,一个大型网站,他要请求的资源是分散到不同的服务器上的(每一个服务器都有自己的一个域名解析)

  • WEB服务器(处理静态资源文件,例如:html/css/js等 的请求)

  • 数据服务器(处理数据请求)

  • 图片服务器 (处理图片请求)

  • 音视频服务器

  • ...... 这样导致,我们需要解析的DNS会有很多次

优化技巧:DNS Prefetch 即 DNS 预获取

让页面加载(尤其是后期资源的加载)更顺畅更快一些

<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="//static.360buyimg.com">
<link rel="dns-prefetch" href="//misc.360buyimg.com">
<link rel="dns-prefetch" href="//img10.360buyimg.com">
<link rel="dns-prefetch" href="//img11.360buyimg.com">
<link rel="dns-prefetch" href="//img12.360buyimg.com">
.......

3.基于TCP的三次握手,够建客户端和服务器端的连接通道

只有建立好连接通道,才能基于HTTP等传输协议,实现客户端和服务器端的信息交互

4.发送HTTP请求

基于HTTP等传输协议,客户端把一些信息传递给服务器

  • HTTP请求报文(所有客户端传递给服务器的内容,统称为请求报文)

    • 谷歌控制台NetWork中可以看到

    • 请求起始行

    • 请求首部(请求头)

    • 请求主体

  • 强缓存 和 协商缓存(性能优化:减少HTTP请求的次数)

    • 强缓存 ( Cache-Control 和 Expires )

    • 协商缓存 ( Last-Modified 和 Etag )

5.服务器接受到请求,并进行处理,最后把信息返回给客户端

  • HTTP响应报文(所有服务器返回给客户端的内容)

    • 响应起始行

    • 响应首部(响应头)

      • date存储的是服务器的时间

      • ...

    • 响应主体

    • 服务器返回的时候是:先把响应头信息返回,然后继续返回响应主体中的内容(需要的信息大部分都是基于响应主体返回的)

6.断开TCP链接通道 (四次挥手)

  • 当客户端把请求信息发送给服务器的时候,就挥第一次手:客户端告诉服务器端,我已经把请求报文都给你了,你准备关闭吧

  • 第二次挥手:由服务器发起,告诉浏览器,我接收完请求报文,我准备关闭,你也准备吧;

  • 第三次挥手:由服务器发起,告诉浏览器,我响应报文发送完毕,你准备关闭吧;

  • 第四次挥手:由浏览器发起,告诉服务器,我响应报文接收完毕,我准备关闭,你也准备吧;

Connection: Keep-Alive 保持TCP不中断(性能优化点,减少每一次请求还需要重新建立链接通道的时间)

7.客户端渲染服务器返回的结果

 

以上是关于完整的url 解析的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段15——git命令操作一个完整流程

VSCode自定义代码片段15——git命令操作一个完整流程

使用千分尺将 POST /** 请求 URL 解析为完整请求 URL

完整的url 解析

VSCode自定义代码片段3——url大全

VSCode自定义代码片段3——url大全