当前位置: 首页 > Web前端 > HTML5

学习笔记-客户端-服务器交互处理

时间:2023-04-05 20:54:21 HTML5

面试题:当用户在地址栏输入网址,最后看到页面的时候,中间发生了什么?=>输入URL=>解析URL地址=>DNS域名解析服务器(通过域名找到对应服务器的外网IP)=>对应服务器发送HTTP请求(TCP协议的三次握手)=>发送HTTP请求=>服务器处理请求并返回给客户端=>断开TCP连接通道=>客户端渲染URL知识URI/URL/URNURI(UniformResourceIdentifier/统一资源标识符)URLURNURL(UniformResourceLocator/UniformResourceLocator)http://www.zhufengpeixun.cnURN(统一资源名称/UniformResourceName)urn:isbn:0451450523一个完整的URL协议的组成和实际含义:http,https,ftp域名:一级域名,二级域名,常用域名性质端口号:80、443、21,端口号范围请求资源路径名:伪URL问号参数HASH值特殊字符加解密encodeURI/decodeURIencodeURIComponent/decodeURIComponentescape/unescape...1.解析输入的URL地址http://www。zhufengpeixun.cn:80/index.html?lx=teacher#videoTransfer协议(客户端和服务器之间传递信息,类似快递小哥)http超文本传输??协议(传输的内容不仅是文本,还可以是其他类型:二进制编码、BASE64编码、文件流等)https是比HTTP更安全的传输协议(传输通道设置了加密算法SSL)。一般支付网站使用HTTPS协议ftp资源上传协议,一般用于上传本地文件直接上传到服务器端域名zhufengpeixun.cn一级域名www.zhufengpeixun.cn二级域名video.zhufengpeixun.cn三级域名webG.video.zhufengpeixun.cn常用域名性质:.com国际/.cn中国/.govgovernment/.orgofficial/.netsystem/.ioblog/.vip...端口号(根据端口号,找到当前服务器上指定的服务)不同的协议有自己的默认端口号,在0~65535之间(也就是不用自己写,浏览器会帮我们加上)http=>80https=>443ftp=>21除了这些写的时候可以省略,其余的不能保存路径和名称请求的资源/stu/index.html在某些情况下,如果我们访问index.html等,我们可以省略它(因为服务器一般会将index.html设置为默认文档,当然也可以自定义)伪-URLSEO优化https://item.jd.com/100006038...(以下为示例,并非真实情况)静态地址:https://item.jd.com/100006038...(方便搜索enginestocrawl)动态页面地址,真实地址:https://item.jd.detail.php?id...需要将这样一个地址重写为上述数据请求的静态地址(URL伪重写技术)接口地址/user/list问号参数部分?xxx=xxx客户端基于GET一系列请求,向服务端传递信息,通常是基于问号参数传递方式在页面间跳转,有些信息的传递也可以基于问号传递方式(信息传递单页组件与组件之间跳转,也可以根据问号传参)传输的内容需要编码(处理特殊字符和中文)encodeURI/decodeURI(只能对空格和中文内容进行编码解码),所以这种模式一般用于处理整个URL的编码encodeURI(http://rain7.top?id=12&lx=10&picture=http://rain7.top/public/Avatar.png))encodeURIComponent/decodeURIComponent(会对所有特殊字符和汉字进行编码,一般不会对整个URL进行编码,只会对每个单独传入的参数进行编码http://rain7.top?id=12&lx=10&picture=encodeURIComponent(http://rain7.top/public/Avatar.png))escape/unescape(此方法并非所有后台都可用,所以一般只应用于客户端自身的内部编码,如:存储Cookie信息,对存储的中文进行编码解码;特殊符号也会被编码)...SethashHASH#xxx2.DNS域名解析什么是DNS域名解析?发布站点时配置域名解析URL访问PerformDNS域名反向解析DNSPrefetch即DNS预取:减少DNS请求次数,进行DNS预取,缓存时间1分钟左右在网站中,每次TCP请求发送后,必须进行DNS解析(当前域名被解析过一次后,浏览器一般会缓存解析记录,缓存时间一般在1分钟左右。如果后面发送的请求还是域名,则解析步骤会被跳过=>这是一个性能优化点)True项目中,一个大型网站,他要请求的资源分布到不同的服务器(每个服务器都有自己的域名解析)WEB服务器(处理静态资源文件,如:html/css/js等)数据服务器(处理数据请求)图像服务器(处理图像请求)音视频服务器...这样一来,我们要解析的DNS就会有很多优化技巧:DNSPrefetch就是DNS预取,让页面加载(尤其是后面资源的加载)更顺畅更快.......3.建立TCP连接(三次握手)建立客户端与服务器的连接通道第一次握手:由浏览器发起,告诉服务器我要发送请求第二次握手:服务器发起,告诉浏览器我准备接受,你快发送第三次握手:浏览器发送,告诉服务器,我马上发送,准备接受4、发送HTTP请求是基于HTTP等传输协议,客户端向服务器传递一些信息的HTTP请求报文(客户端向服务器传递的所有内容统称为请求报文)在控制台NetWork中,可以看到请求起始行请求头(requestheader)请求体强缓存和协商缓存(性能优化:减少HTTP请求数)强缓存(Cache-Control和Expires)协商缓存(Last-Modified和Etag)5.服务端接收请求,处理,最后返回信息给客户端WEB(图片)服务器和数据服务器TomcatNginxApacheIIS...HTTP响应报文(服务端返回给客户端的所有内容)responsestartlineresponsestatusCode200/201/204301/302/304/307400/401/404500/503响应头(header)date存放服务器的时间...当服务器返回响应体时:先返回响应头信息,然后continue返回响应体中的内容(大部分需要的信息是根据响应体返回的)6.断开TCP连接通道(挥手四次)第一次挥手:由浏览器发起,发送给服务器,我请求消息发送后,您就可以关闭了;第二次挥手:由服务器发起,告诉浏览器我已经收到请求报文,我准备关闭,你也准备好了;第三次挥手:由服务器发起,告诉浏览器,我已经发送响应消息,你准备关闭它;第四次挥手:由浏览器发起,告诉服务器我已经收到响应信息,我准备关闭,你也准备好了;Connection:Keep-Alive保持TCP不间断(性能优化点,减少每次请求重新建立链接通道所需的时间)7.客户端渲染页面源码:EverestWEB前端进阶课程