当前位置:首页 > 网络 > 正文内容

当用户输入地址框网址都经历了什么

自由小鸟5年前 (2019-09-11)网络4071

1,客户端和服务器端

=》1客户端:     可以向服务器发请求并接收返回的内容进行处理

=》2服务器端: 能够接收客户端请求并且把相关资源信息返回给客户端的 (性能比较好的电脑)

        +给服务器通网后,会有两个IP地址

            内网IP:局域网内访问

            外网IP:外部用户可以基于外网IP访问到服务器

            例如:125.39.174.202

          +服务器接收到请求后

            1》根据端口号找到对应的项目

            2》根据请求资源的路径名称找到资源文件

            3》读取资源文件

URL编码解析方式

    请求的地址中如果出现非有效UNICODE编码内容,现代版浏览器会默认的进行编码
        1,默认用encodeURI(网址) 编码整个URL网址,这个整个URL中的特殊字符都会自动编译
        2,encodeURIComponent它相对于encodeURI来说,不用给整个URL编码,而是给URL部分信息进行编码(一般是问号传参的值编码)

        客户端和服务器端进行信息传输的时候,如果需要把请求的地址和信息编码,我们则基于以上两种方式处理,服务器端也存在这些方法,这样就可以统一编码解码了

        3,客户端还存在一种方式,针对中文的编码方式 escape/unescape 这种方式一般只应用于客户端页面之间自己的处理,例如:从列表跳转到详情,我们可以把传递的中文信息基于这个编码,详情页获取编码后的信息再解码,再比如我们在客户端种的cookie信息,如果信息是中文,我们也基于这种办法编码...

        decodeURI(放的是解码地址)  /decodeURIComponent



从地址输入网址经历了什么

1,URL地址的解析 

      URI/URL/URN的区别

       URL--- (Uniform Resource Locator)  统一资源定位符,根据这个地址能找到对应的资源

       URN---(Uniform Rescource Name)  统一资源名称,一般指国际上能用的(标准的)一些名字(例如:国际统一发版的编号)

       URI---(Unifrom Rescource Identifier) 统一资源标识符,URL和UEN 是URI的子集

    一个完整的URL所包含的内容:

        http://www.webge.net:80/ld/index.html?from=wx&1x=1#webge

                1>协议(http://) ,传输协议就是能够把客户端和服务器端通信的信息进行传输的工具(类似于快递小哥)

                    +HTTP 超文本传输协议,除了传递文本,还可以传递媒体资源文件(或者流文件)及XML格式数据

                    +HTTPS 更加安全的http, 一般涉及支付的网站都要采用https协议 (s-ssl 加密传输)
                    +ftp 文件传输协议(一般应用于把本地资源上传到服务器端)

                            FileZilla:FTP上传工具,通过这个工具,通过FTP传输协议,我们要以把本地的文件上传到服务器上 
                 2>域名(www.webge.net)  (一个让用户方便记的名字,不通过域名,直接用服务器的外网IP也可以访问到服务器,但是外网IP很难被记住                

                    +顶级域名 qq.com

                    +-级域名 www.qq.com

                    +二级域名 sports.qq.com

                    +三级域名 kbs.sports.qq.com

                    +.com 国际域名

                    +.cn    中文域名

                    +.com.cn  

                    + .edu 教育

                    + .gov 政府

                    + .io    博客

                    + .org  官方组织

                    + .net 系统类

                3>端口号(:80)====端口号的取值范围0--65535,用端口号来区分同一台服务器上的不同项目

                       +http 默认端口号:80

                       +https默认端口号:443

                       +ftp 默认端口号:21

                       +如果项目采用的就是默认端口号,我们在书写地址的时候,不用加端口号,浏览器在发送请求的时候会帮我们默认给加上
                4>请求资源路径名称(/ld/index.html) 

                        +服务器接收到请求后

                            1》默认的路径或者名称(不指定资源名,服务器会找默认的资源,一般默认资源名是default.html,index.html..当然这些可以在服务器配置)

                            2》注意伪URL地址的处理(URL重写技术是为了增加SEO搜索引擎优化的,动态的网址一般不能被搜索引擎收录,所以我们要把动态网站静态化,此时需要的是重写URL)

                           https://item.js.hk/2688449.html => https://item.js.hk/ index.php?id=2688449

                5>问号传参信息(#webge)

                        +客户端想把信息传递给服务器,有很多的方式

                              URL地址问号传参

                              请求报文传输 (请求头和请求主体)

                        +也可以不同页面之间的信息交互,例如,从列表到详情

                6>HASH值(#web)

                        +也能充当信息传输的方式

                        +锚点定位

                        +基于HASH实现路由管控(不同的HASH值,展示不同的组件和模块) 

       

2,DNS域名解析 

        DNS服务器:域名解析服务器,在服务器上存储着 域名《=》服务器外网IP的相关记录

        而我们发送请求时候所谓的DNS解析,其实就是根据域名在DNS服务器上查找到对应服务器的外网IP

    

DNS优化 预获取

    DNS缓存(一般浏览器会在第一次解析后,默认建立缓存,时间很短,只有一分钟左右)

    减少DNS解析次数(一个网站中需要发送请求的域名和服务器尽可能少即可)

    DNS预获取(dns-prefetch):在页面加载开始的时候,就把当前页面需要访问其他域名和服务器的信息进行提前DNS解析,以后加载到具体内容部分可以不用解析了

 

在head里加上,在和主站域名不同的情况下其它域名应该加上预解析

<link rel="dns-prefetch" href="//static.360buyimg.com"/>
<link rel="dns-prefetchhref="//misc.360buyimg.com"/>
<link rel="dns-prefetchhref="//img10.360buyimg.com"/>
<link rel="dns-prefetchhref="//d.jd.com"/>


HTTP报文

    请求报文:所有经过传输协议,客户端传递给服务器的内容,都被成为请求报文

        +起始行

        +请求头(请求首部)

        +请求主体

    响应报文:所有经过传输协议,服务器返回给客户端的内容,都被成为响应报文

        +HTTP状态码

        +响应头

    HTTP报文:请求报文+响应报文

=》谷歌浏览器F12 =>Network(所有客户端和服务器端的交互信息在这里都可以看到) =》点击某一条信息,左右住侧可以看到所有的HTTP报文信息

        

     

        

3,DNS向服务器发请求,跟服务器建立TCP连接 (3次握手)

4,把客户端信息传递给服务器  (发送HTTP请求)

服务器:

5,服务器得到并处理请求(HTTP响应内容并返回给客户端)

客户端拿到结果:

6,客户端渲染服务器返回的内容(页面)-这里详情可以看页面渲染文章

7,和服务器断开TCP链接 (4次挥手)

   

头部head中设置 ===》Connection:Keep-Alive 保持TCP不中断   (性能优化) 这样的做法对服务器有压力,可以设置有效时间断开,或者让后台自动断开


请求阶段就 request 

响应阶段  response



这里是图片展示

image.png



image.png

版权声明:本文由Web学习之路发布,如需转载请注明出处。

本文链接:https://webge.net/?id=67

“当用户输入地址框网址都经历了什么” 的相关文章

常用的网址

animate.css 动画    https://daneden.github.io/animate.css/压缩解压       http://tool.chinaz.com/Tools/CssFormat.aspxcss3...

HTTP 状态码

1~5开头,三位数字200 ok:          成功201 created:  一般应用于告诉服务器创建一个新文件,最后服务器创建成功后返回的状态码204 No Content   对于某些请求(PUT或者DELE...

前端性能优化

前端性能优化分类:1. 减少HTTP的请求次数和传输信息(报文)大小  (文件和合并压缩重点)    1》CSS SPRITE (雪碧图、图片精灵)    2》使用字体图标(ICON FONT)或者SVN等矢量图     ...