从输入URL到展示出页面

news2024/11/16 21:36:52

目录

了解URL

 1. 输入URL

2. 域名解析

3. 建立连接

4. 服务器处理请求:

5. 返回响应:

6. 浏览器解析HTML:

7. 加载资源:

8. 渲染页面:

9. 执行JavaScript:

10. 页面展示:


从输入URL到展示出页面,涉及到多个步骤和不同的技术。本篇来解释一下整个过程中发生的主要事件:

了解URL

这里特别注意:

服务器地址:可以是 IP 地址,也可以是域名

服务器端口号:通过 IP 地址,只描述了网络资源在哪个主机上,使用端口号来区分是主机上的哪个程序

带层次文件路径:描述你要访问服务器的哪个资源的位置

查询字符串:也就是键值对(程序员自定义的)


 1. 输入URL

用户在浏览器地址栏中输入URL(统一资源定位符),URL是网站的地址,包括协议(通常是HTTP或HTTPS)、域名和资源路径。

2. 域名解析

浏览器通过DNS(域名系统)服务器将域名解析成对应的IP地址。DNS服务器会查找域名对应的IP地址,这个IP地址是指向网站服务器的。

3. 建立连接

浏览器使用HTTP协议向服务器发起请求,请求连接到服务器。如果是HTTPS,通信会被加密以保证安全性。

4. 服务器处理请求:

服务器接收到浏览器的请求后,会根据请求的资源(通常是HTML文件)进行处理。服务器可能需要查询数据库,运行应用程序等,最终生成需要的HTML响应。

5. 返回响应:

服务器将生成的HTML响应发送回浏览器。响应包括HTTP状态码(表示请求成功、重定向、错误等)和相应的数据(HTML、CSS、JavaScript等文件)。

6. 浏览器解析HTML:

浏览器接收到HTML响应后,开始解析HTML文档。它会构建DOM(文档对象模型)树,这是网页的内部表示,包括页面的结构和内容。

7. 加载资源:

在解析HTML的过程中,浏览器会发现页面引用了其他资源,比如CSS、JavaScript、图像等。浏览器会继续发送请求获取这些资源。

8. 渲染页面:

浏览器根据HTML和CSS信息渲染页面,将页面呈现给用户。这个过程包括布局、绘制和渲染交互效果等。

9. 执行JavaScript:

如果页面包含JavaScript代码,浏览器会执行这些脚本。JavaScript可以改变页面内容、响应用户交互、与服务器进行通信等。

10. 页面展示:

最终,页面在用户的浏览器中完全展示出来,用户可以看到页面内容并与页面进行交互。


这个过程涉及到多个技术和协议,包括DNS解析、HTTP/HTTPS通信、服务器端处理、HTML/CSS/JavaScript解析和渲染等。不同的浏览器和服务器可能在具体实现上有所不同,但总体流程大致相同。 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1118940.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

运维学习CentOS 7进行Nightingale二进制部署

.因为Nightingale需要MySQL保存一些数据,所以可以参考《CentOS 7.6使用mysql-8.0.31-1.el7.x86_64.rpm-bundle.tar安装Mysql 8.0》部署MySQL。 https://github.com/ccfos/nightingale/releases是可以github上下载Nightingale二进制安装包。 https://n9e.github.io/…

【COMP305 LEC 3 LEC 4】

LEC 3 A basic abstract model for a biological neuron 1. Weights of connections Neuron gets fired if it has received from the presynaptic neurons 突触前神经元 a summary impulse 脉冲, which is above a certain threshold. Signal from a single synapse突触 ma…

实时消息传送:WebSocket实现系统后台消息实时通知

实时消息传送:WebSocket实现系统后台消息实时通知 WebSocket简介基本实现步骤后台服务器后端接口SimpMessagingTemplate MessageDto前端客户端 示例应用 在现代Web应用中,提供实时通知对于改善用户体验至关重要。WebSocket技术允许建立双向通信通道&…

08-React扩展

08-React扩展 1. setState的2种写法 案例: export default class Demo extends Component {state {count: 0}add () > {// 获取当前的值const { count } this.state// 更新状态this.setState({ count: count 1 })console.log(count);}render() {const { coun…

WSL2的安装与配置(创建Anaconda虚拟环境、更新软件包、安装PyTorch、VSCode)

1. WSL2 安装 以管理员身份打开 PowerShell(“开始”菜单 >“PowerShell” >单击右键 >“以管理员身份运行”),然后输入以下命令: dism.exe /online /enable-feature /featurename:Microsoft-Windows-Subsystem-Linux /a…

mfc140u.dll丢失的详细解决方法,最详细修复mfc140u.dll丢失的办法分享

在计算机技术日益发展的今天,我们不可避免地会遇到各种各样的技术问题。其中,“MFC140U.DLL丢失”是一个常见的错误,它可能会影响我们的电脑性能和软件运行。本文将详细介绍四种解决“MFC140U.DLL丢失”问题的方法。 首先,我们需…

详细解读DALLE 3技术报告:Improving Image Generation with Better Captions

Diffusion models代码解读:入门与实战 前言:OpenAI是推动大模型创新的领头羊,最近发布的DALLE 3凭借着远超市面上其他图片生成模型的表现,再次火出圈。最近OpenAI官方发布了DALLE 3的技术报告《Improving Image Generation with B…

Canvas和SvG的区别是什么?

Canvas和SVG是两种用于在Web上绘制图形的不同技术,它们有一些区别: 1:绘图方式: Canvas使用JavaScript API,通过在画布上绘制像素来创建图形。提供了对像素级别的控制,可以实现复杂的图形和动画效果。SVG…

项目经理之识别项目干系人

项目干系人管理是项目管理中的重要一环,识别和管理好项目干系人是成功实施项目的关键之一。本文将介绍4321项目干系人识别方法、干系人等级册以及五步判断法等工具,帮助项目经理更好地识别和管理项目干系人。同时,本文还将介绍干系人能量方格…

【疯狂Java讲义】Java学习记录(IO流)

IO流 IO:Input / Output 完成输入 / 输出 应用程序运行时——数据在内存中 ←→ 把数据写入硬盘(磁带) 内存中的数据不可持久保存 输入:从外部存储器(硬盘、磁带、U盘&#…

在unity中利用公开变量引用物体和组件(有手就会)

在任意的脚本组件中(必须先绑定物体),添加一个公开的 GameObject 类型的变量 using System.Collections; using System.Collections.Generic; using UnityEngine;public class test1 : MonoBehaviour {public GameObject other;// Start is …

蛋白质折叠

文章目录 4. GNNs for Protein foldingChemical Structures as GraphsProtein Structure PredictionMethods for Protein Structure PredictionOld method: fragment assemblyNew StrategyCo-evolution Analysis Towards An End-to-End Workflow AlphaFold2 architecture补充&a…

物联网AI MicroPython传感器学习 之 DRV8833电机驱动模块

学物联网,来万物简单IoT物联网!! 一、产品简介 DRV8833电机驱动模块是一种单H桥电机驱动芯片,可驱动2个直流电机和4线步进电机。内置过流保护,短路保护,欠压闭锁和过热保护,带低功耗睡眠模式。…

一篇文章讲懂mysql中的锁

事务的隔离性是由锁来实现的。 为什么需要锁 锁是计算机协调多个进程或线程并发访问某一资源的机制。在程序开发中会存在多线程同步的问题,当多个线程并发访问某个数据的时候,尤其是针对一些敏感的数据(比如订单、金额等)&#x…

高校教务系统登录页面JS分析——巢湖学院

高校教务系统密码加密逻辑及JS逆向 本文将介绍高校教务系统的密码加密逻辑以及使用JavaScript进行逆向分析的过程。通过本文,你将了解到密码加密的基本概念、常用加密算法以及如何通过逆向分析来破解密码。 本文仅供交流学习,勿用于非法用途。 一、密码加…

UDP和TCP:奇妙的网络协议

之前,我们介绍了基本的网络原理和网络编程的相关知识,接下来会根据TCP/IP协议栈,具体的介绍这里的关键协议和知识。这部分知识虽然是理论为主,但是这是我们作为程序员的基本内功,非常重要。 本文我们重点介绍TCP和UDP…

TCP协议的报文结构及其特性

文章目录 一、TCP报头二、TCP的特性2.1确认应答2.2超时重传2.3连接管理2.3.1三次握手2.3.2四次挥手 2.4滑动窗口2.5流量控制2.6拥塞控制2.7延时应答2.8捎带应答2.9面向字节流2.10TCP异常情况的处理 一、TCP报头 TCP报头(header)分为11个部分,TCP报头大小为(20~60个…

springboot实现文件上传和读取

一.本地存储(将图片存放在本地的nginx服务器上) 在nginx上创建images目录,用来存储上传的文件 (使用nginx的好处是暴露端口,便于外界访问,同时nginx作为静态资源服务器在处理静态资源方面更快) 不然你访问文件就需要通…

android 13/14高版本SurfaceFlinger出现VSYNC-app/VSYNC-appSf/VSYNC-sf剖析

问题背景: 了解surfaceflinger的vsync同学都可能知道vsync属于一个节拍器,主要用来控制有节奏的渲染,不至于会产生什么画面撕裂等现象。 一般vsync都有会有2部分: app部分vsync,控制各个app可以有节奏的上帧 surfacef…

FPGA project : sdram

sdram读写控制器 实验目标: 设计并实现一个 SDRAM 数据读写控制器,使用 PC 机通过串口向 SDRAM 写入 10 字 节数据,并将写入的 10 字节数据读出,通过串口回传至 PC 机,在串口助手上位机上打印 显示回传数据。 框图设…