首页 > 其他分享 >web基础

web基础

时间:2023-03-01 20:55:05浏览次数:33  
标签:web 网页 文件 基础 服务器 浏览器 解析 CSS

客户端和服务器

客户端与服务器的通信

客户端服务器

互联网:错综复杂的网络,比如每个快递车走的路.

TCP/IP:定义数据如何传输的通信协议,比如快递的包装,发货规则.

DNS:域名系统服务器,输入一个网址时,找到网页的服务器,才能发送 HTTP 请求到正确的地方。(域名->IP),比如发货地址.

HTTP:超文本传输协议是一个定义客户端和服务器间交流的语言的协议.比如收取快递时的暗号.

组成文件:一个网页由许多文件组成,就是收到的快递.包含:代码(HTML CSS JS)和资源(img 等).

浏览器里输入一个网址时发生以下步骤

https://juejin.cn/post/6858551640220729351

  1. 查找浏览器缓存(强缓存和协商缓存),网络进程会先看看是否存在本地缓存,如果有就直接返回资源给浏览器进程.
  2. 浏览器在域名系统(DNS)服务器上找出存放网页的服务器的实际地址(IP 地址)
  3. 浏览器通过 TCP/IP 协议,三次握手发送 HTTP 请求信息到服务器请求拷贝一份网页到客户端。
  4. 服务器响应请求,会返回一个“200 OK”信息,然后开始将网页的文件以数据包的形式传输到浏览器
  5. 浏览器接收文件后进行解析渲染
    • 浏览器首先解析 HTML 文件,并从中识别出所有的 link 和 script 元素,获取外部文件的链接。
    • 浏览器根据外部文件的链接向服务器发送请求,获取并解析 CSS 和 JavaScript 脚本文件。
    • 接着浏览器会给解析后的 HTML 文件生成 DOM 树(在内存中),会给解析 CSS 回流与重绘生成一个 CSS DOM 树(在内存中),并且会编译和执行解析后的 JS
    • 绘制出网页;用户看到网页界面也就可以跟网页进行交互了。

参考

标签:web,网页,文件,基础,服务器,浏览器,解析,CSS
From: https://www.cnblogs.com/wwwaaa/p/17169294.html

相关文章

  • WGCLOUD的基础使用 - 邮件告警设置说明
    WGCLOUD的邮件告警配置比较简单,不过还是写一下,因为有时候一些细节容易被忽略本文以qq邮箱发送为例说明,邮件告警配置成功后,所有告警通知都会自动发送邮件,如果不想接收邮件了,......
  • Java基础知识点(字符串----StrIng)
    一:在开发中的应用场景1.跟正确的用户名和密码相比较2.对敏感词进行替换..............&String,StringBuilder,StringJoiner,StringBuffer,Pattern,Matcher......可以掌握字......
  • Java基础学习(一)
    目录简单Java代码注释在Java中有以下注释数据类型整型浮点型char类型boolean类型变量命名规范常量类型之间的转换强制类型转换运算符结合赋值自增和自减boolean运算符其他......
  • JAVAWEB-NOTE05-Maven
    目录概述提供了一套标准的项目化结构提供了一套标准化的构建流程提供了一套依赖管理机制简介安装配置安装基本使用常用命令生命周期IDEA配置Maven配置环境Maven坐标IDEA新......
  • python基础知识整理
    一:pyhton数据类型数字类型:整型(int)/浮点型(float)/布尔型(bool)/复数型(complex)非数字类型:字符串(str)/列表(list)/元组(tuple)/字典(dict)不变类型:整型(int)/......
  • webtest / testcase design / pandingbiao
    s一,判定表法的定义二,为什么要使用判定表法三,判定表法的优缺点1,优点2,缺点四,判定表法的四大组成部分五,判定表的规则与合并标准规则:六,判定表法的适用场景七,判定表法分析案例......
  • Java基础随笔(1)abstract和interface
    publicabstractclassDemo14{publicStringvar="123";publicabstractdoublet1();publicvoidt2(Stringq){System.out.println("1......
  • webpack逆向之报错Cannot read properties of undefined (reading 'call')
    经典报错记录一下:1:缺少模块  补上2.主模块无法调用子模块  有可能网站用的数组形式的模块包,你用的是对象,调用方法就要改变.     改写......
  • webgl 系列 —— 绘制一个点(版本2、版本3、版本4、版本5)
    绘制一个点我们初步认识了webgl,本篇主要围绕绘制一个点的示例,逐步实现下面功能:点的位置从js传入着色器点的大小由js传入着色器通过鼠标点击绘点通过鼠标点击绘......
  • SkeyeVSS综合安防视频云服务WEB H5无插件播放RTSP摄像机解决方案,拒绝插件,拥抱H5,Window
    SkeyeVSS综合安防视频云服务WEBH5无插件播放RTSP摄像机解决方案,拒绝插件,拥抱H5,WindowsPC、Liunx、Android、iOS全平台支持市场需求视频流媒体监控行业已经进入了互联网......