专栏首页河湾欢儿的专栏客户端和浏览器端交互模型

客户端和浏览器端交互模型

如何做一个网站?
1、买一台服务器,服务器脸上网络之后,会存在一个外网的IP地址,我们把html+css上传到服务器
2、买一个域名
3、进行DNS解析(域名解析)
   www.zhang.cn   220.114.23.45(服务器外网ip地址) 80(服务器端口号)

当用户在自己的浏览器中输入一个网址,到最终看到页面和内容,发生了哪些事情?

服务器的端口号:(0~65535)
  我们的一台服务器上可以发布很多项目,而每个项目都有一个自己对应的房间或者区域,服务器使用端口号
使用端口号来区分具体是那个项目
   一般都把自己的项目发布到80/443这两个项目下


1、通过域名到dns服务器上找到对应的服务器的外网ip和对应的端口号
2、dns服务器找到对应的服务器和房间号
3、在房间中把index.html文件的源代码返回给客户端
4、客户端解析源代码


引擎:
每一个浏览器都有自己的引擎,谷歌浏览器是v8引擎
火狐浏览器是Gecko引擎
ie浏览器是Trident引擎

w3c
是一个无盈利的一个组织(制定咱们开发的规范,HTML HTML5 CSS CSS3)
谷歌是 -webkit-xxx:xxx


谷歌浏览器控制台NetWork这一项,可以看到客户端向服务器端所有的请求以及请求的状态信息等


通过network中观看,我们发现当我们第一次把html源代码请求回来的时候,浏览器开始按照自己的引擎渲染,在渲染的过程中我们
还会出现从新向服务器还会出现从新向服务器请求css/img/js每一次的请求步骤和HTML一模一样,如果请求的资源次数过多,页面打开
的速度和渲染速度就会变慢,所以我们页面优化的方法中,首先要做的就是减少http请求次数

1、css合并一个(内嵌式)
2、js合并成一个 或者采用内嵌式
3、图片合并(雪碧图技术)或者图片延迟加载 (加快第一次打开的速度)
4、Ajax请求和资源文件请求的原理是一样的


URL

http://v.qq.com:80/index.html?name=zhangxiaohuan&age=18#a

http:传输协议
v.qq.com域名
80:端口号
index.html请求资源的文件名
?name=zhangxiaohuan&age=18 URL问号传参
#a锚点定位

传输协议:
 http:超文本传输协议,除了传输文本还可以传输其它的东西,例如:xml
 https:更加安全的http
 ftp:文件传输协议(应用于把项目文件传递到服务器上)

在不指定端口的情况下,每一种协议会有一个默认的端口号
 http默认会找服务器的80端口
 https默认会找443端口
 ftp默认会找21端口 


客户端:发送请求,接收内容解析
服务器:创建服务,监听端口,在当前服务器中接收客户端请求的内容,然后把对应的数据或者内容返回给客户端

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • wx小程序的自定义组件

    我的博客即将搬运同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invi...

    河湾欢儿
  • uniApp 如何获取globalData全局变量

    河湾欢儿
  • 第一节预解释、作用域、this原理

    河湾欢儿
  • 剖析 HTTP 协议

    HTTP 概述 HTTP 是什么? HTTP(HyperText Transfer Protocol,超文本传输协议)是WWW (World Wide Web)...

    静默虚空
  • HTTP协议详解以及URL具体访问过程

      即超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议,所有的WWW文件都必须遵守这个标准...

    那一叶随风
  • 从敲入 URL 到浏览器渲染完成、对HTTP协议的理解

    浏览器引入了 DNS 预取技术。它是利用现有的 DNS 机制,提前解析网页中可能的网络连接。

    步履不停凡
  • HTTP协议状态码详解(HTTP Status Code)

    使用ASP.NET/PHP/JSP 或者javascript都会用到http的不同状态,一些常见的状态码为: 200 – 服务器成功返回网页 404 – ...

    张善友
  • 你不得不知道的HTTP状态码有哪些

    100 (继续) 请求者应当继续提出请求。 服务器返回此代码表示已收到请求的第一部分,正在等待其余部分。

    黄泽杰
  • HTTP协议状态码详解

    使用PHP/JSP 或者javascript都会用到http的不同状态,一些常见的状态码为: 200 – 服务器成功返回网页 404 – 请求的网页不存在 5...

    用户1093975
  • 云服务器-腾讯云服务器

    云服务器是什么?介绍云服务器的性能及云服务器的购买流程。云服务器是腾讯云研发的新一代云服务器,所以又称为腾讯云服务器。腾讯云服务器可以随时升高或降低配置,当业务...

    用户1361591

扫码关注云+社区

领取腾讯云代金券