url从输入到渲染页面的全过程

2024-10-31

从浏览器输入URL到页面渲染的过程

零.背景一个web安全工程师在学习web安全和web渗透时候,非常有必要了解整个WEB工作过程. 一.输入URL 这里是最基本的知识:URL是URI的一种实际应用,URI统一资源表示符,URL统一资源定位符.URL举例: https://www.xxx.com:443/index.php 前面是协议 https 然后是主机www.xxx.com 然后是端口 443,最后是资源在该主机上针对web系统根目录(通常为www)的相对路径.所以可以想象,根据WEB访问就是获取资源,已经知道端口.路径.

输入URL到展现页面的全过程

最近在看一本关于网络协议的书<图解HTTP> 当我们在浏览器的地址栏输入 http://www.pwstrick.com ,然后回车,回车这一瞬间到看到页面到底发生了什么呢? 1. 域名解析 2. 建立TCP连接 3. 发起HTTP请求 4. 服务器响应HTTP请求 5. 浏览器渲染页面自己原先不是很了解,通过读了这本书后了解了些内幕. 接下来将使用工具Chrome.Fiddler.Wireshark.曾经写过一篇Fiddler的教程<移动开发中Fiddler的那些事儿>. 一

从输入 URL 到展现页面的全过程

总体分为以下几个过程 DNS解析 TCP连接发送HTTP请求服务器处理请求并返回HTTP报文浏览器解析渲染页面连接结束 DNS解析域名到ip地址转换 TCP连接 HTTP连接是基于TCP连接 https 协议就是http +ssl协议,ssl协议采用非对称加密发送HTTP请求 http请求报文是由三部分组成:请求行,请求报头和请求正文请求行: 格式如下 Method Request-URL HTTP-Version CRLF 比如: Method Request-URL HTTP-

浅谈浏览器解析 URL+DNS 域名解析+TCP 三次握手与四次挥手+浏览器渲染页面

(1)浏览器解析 URL 为了能让我们的知识层面看起来更有深度,我们应该考虑下面两个问题了: 从浏览器输入 URL 到渲染成功的过程中,究竟发生了什么? 浏览器渲染过程中,发生了什么,是不是也有重绘与回流? OK,兴致来了,我们就先从浏览器解析 URL 看起,先来看看当用户输入 URL,到浏览器呈现给用户页面,经历了以下过程: 版本 A: 用户输入 URL 地址. 对 URL 地址进行 DNS 域名解析. 建立 TCP 连接(三次握手). 浏览器发起 HTTP 请求报文. 服务器返回 HTTP

从输入URL按下回车到页面展现，中间发生了什么？

从输入URL按下回车到页面展现,总的来说发生了一下几个过程: DNS 解析:将域名解析成 IP 地址 TCP 连接:TCP 三次握手发送 HTTP 请求服务器处理请求并返回 HTTP 报文浏览器解析渲染页面断开连接:TCP 四次挥手接下来将一步一步的解释所发生的过程. 一.URL 到底是啥 URL(Uniform Resource Locator),统一资源定位符,用于定位互联网上资源,俗称网址.比如 http://www.w3school.com.cn/ht...,遵守以下的语法规则

Scrapy爬虫框架（实战篇）【Scrapy框架对接Splash抓取javaScript动态渲染页面】

(1).前言动态页面:HTML文档中的部分是由客户端运行JS脚本生成的,即服务器生成部分HTML文档内容,其余的再由客户端生成静态页面:整个HTML文档是在服务器端生成的,即服务器生成好了,再发送给我们客户端这里我们可以观察一个典型的供我们练习爬虫技术的网站:quotes.toscrape.com/js/ 我们通过实验来进一步体验下:(这里我使用ubuntu16.0系统) 1.启动终端并激活虚拟环境:source course-python3.5-env/bin/activate 2.爬取

python3编写网络爬虫14-动态渲染页面爬取

一.动态渲染页面爬取上节课我们了解了Ajax分析和抓取方式,这其实也是JavaScript动态渲染页面的一种情形,通过直接分析Ajax,借助requests和urllib实现数据爬取但是javaScript动态渲染布置Ajax一种例如中国青年网(http://news.youth.cn/gn/)分页部分由js生成,并非原始HTML代码,这其中并不包含ajax请求比如ECharts官方示例(http://echarts.baidu.com/demo.html#bar-negative)图形

python接口自动化29-requests-html支持JavaScript渲染页面

前言 requests虽好,但有个遗憾,它无法加载JavaScript,当访问一个url地址的时候,不能像selenium一样渲染整个html页面出来. requests-html终于可以支持JavaScript了,这就相当于是一个真正意义上的无界面浏览器了. 中文文档地址:https://cncert.github.io/requests-html-doc-cn/#/ JavaScript支持当第一次使用render() 渲染页面的时候,会自动下载chromium,但只会下载这一次,后面就不

Django 02 url路由配置及渲染方式

Django 02 url路由配置及渲染方式一.URL #URL #(Uniform Resoure Locator) 统一资源定位符:对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址. 互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它格式 http://127.0.0.1:8000/hello/ #url解释 schema://host[:port#]/path/.../[?query-string][#anch

python接口自动化1-requests-html支持JavaScript渲染页面

前言 requests虽好,但有个遗憾,它无法加载JavaScript,当访问一个url地址的时候,不能像selenium一样渲染整个html页面出来.requests-html终于可以支持JavaScript了,这就相当于是一个真正意义上的无界面浏览器了.中文文档地址:https://cncert.github.io/requests-html-doc-cn/#/ JavaScript支持当第一次使用render() 渲染页面的时候,会自动下载chromium,但只会下载这一次,后面就不会下

爬虫动态渲染页面爬取之selenium驱动chrome浏览器的使用

Selenium是一个用于Web应用程序测试的工具.Selenium测试直接运行在浏览器中,就像真正的用户在操作一样,可以用其进行网页动态渲染页面的爬取. 支持的浏览器包括IE(7, 8, 9, 10, 11),Mozilla Firefox,Safari,Google Chrome,Opera等. 1. 示例 ### selenium的使用 ''' Selenium是一个用于Web应用程序测试的工具. Selenium测试直接运行在浏览器中,就像真正的用户在操作一样. 支持的浏览器包括IE(7

从零开始，做一个NodeJS博客（四）：服务器渲染页面与Pjax

标签: NodeJS 0 一个星期没更新了 = = 一直在忙着重构代码,以及解决重构后出现的各种bug 现在CSS也有一点了,是时候把遇到的各种坑盘点一下了 1 听歌排行 API 修复与重构 1.1 修复在加载云音乐听歌排行的时候,有时会出现一个奇怪的bug:json数据无法被解析.如下图: 在刷新页面后,问题就会得到解决.此后无论怎么刷新,问题也不会出现. 过一段时间再次打开页面,会出现相同的问题,刷新之后也可以解决.此时换用其他各种浏览器,都不会出现问题:但一段时间之后仍会重现一次...

Node.js_express_服务器渲染页面 ejs

服务器渲染页面 ejs 高效的 js 模版引擎将数据提前渲染到页面上, 再将渲染好的页面返回响应给浏览器提高首页加载速度 SEO 提前处理,提高加载速度下载 ejs 包 npm install ejs 无需引用,但是要配置模板资源目录 // app.set('views', '模板资源目录'); app.set('views', 'views'); // 通常文件夹也叫 views 基本使用 1. 配置模板资源目录 ( Router 没有 set 方法,所以必须在主模块下

一个vue请求接口渲染页面的例子

new Vue({ el:'#bodylist', data: { list: [ { "type_id": "1", "type_name": "特色项目", "program_list": [{ "check_program_id": "1", "program_name": "HRA健康风险评估与疾病早筛", "

微信小程序——动态渲染页面、路径传参

1.动态渲染页面.改变css.样式必须setData渲染过去 this.setData({ userInfo: app.globalData.userInfo, token: app.globalData.token, url: app.globalData.url, css:'hidden' }); 2.路径传参, 在页面的 onLoad获取 onLoad: function (options) { console.log("参数",options.imei); }

nodejs通过响应回写的方式渲染页面资源

我们一般通过node框架提供的api操作页面渲染,如何利用原始回写的方式来实现同样的功能呢下面是通过node 提供的异步地读取一个文件的全部内容api readFile进行操作,代码如下: html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="

chrome和Firefox浏览器渲染页面的不同

一直很好奇chrome和firefox这两大浏览器的页面渲染有什么不同,今天自己写了些html代码来做了下检验. 先做html编码,代码如下: <!DOCTYPE html><html> <head> <title>测试浏览器渲染</title> <meta charset="UTF-8"> <meta name="viewport" con

爬虫动态渲染页面爬取之Splash的介绍和使用

Splash是一个JavaScript渲染服务,是一个带有HTTP API的轻量级浏览器,同时它对接了Python中的Twisted和QT库.利用它,我们同样可以实现动态渲染页面的抓取. 1. 功能介绍和基本实例 ### Splash的使用 ''' Splash是一个JavaScript渲染服务,是一个带有HTTP API的轻量级浏览器,同时它对接了Python中的Twisted和QT库. 利用它,我们同样可以实现动态渲染页面的抓取. ''' ## 功能介绍 # 1.异步方式处理多个网页渲染过程

img标签src=""和background-image:url();引发两次请求页面bug

img标签src=""和background-image:url();引发两次请求页面bug 具体原因是,在img 对象的src 属性是空字符串("")的时候,浏览器认为这是一个缺省值,值的内容为当前网页的路径. 浏览器会用当前路径进行再一次载入,并把其内容作为图像的二进制内容并试图显示. 对于不同的浏览器测试后,发现对于有无src 或者src 是否为空的情况,还不尽相同,测试结果如下表. 代码 Firefox IE6 IE7 <img src=&q

强制IE使用最高版本引擎渲染页面，避免默认使用IE7引擎导致的页面布局混乱及其它问题

背景基于Asp.net MVC的一个Intranet web application, 现象 Application发布到服务器端后,在客户端IE访问页面布局混乱,并有javascript报错原因 IE通过doctype, meta标签和HTML内容推测支持页面的最早期的浏览器引擎对页面进行渲染,本例因IE默认使用IE7引擎渲染而导致版本兼容问题,影响了页面布局和javascript代码的运行解决办法因为本例是ASP.net MVC的web application,因此通过向web.co

day002-HTML知识点总结：浏览器兼容性之指定IE浏览器使用chrome内核渲染页面

今天再浏览大淘宝首页时,突然看到这么一个东东: ,顿时好费解,莫非万恶的IE浏览器认识到自己以往的罪孽,开始兼容chrome了??! 于是本着不懂就百度的神精,开始纵横于各大铁耙,勃哥,终于找到了许许多的答案,这里做一下总结,就是我的文章啦啦啦~~~ 首先IE还是那么坏,是不会顾及我们这些前端开发人员的死活的!! IE=edge,chrome=1 的意思并不是IE兼容chrome,相反而是chrome 偷偷挖了IE的墙角,不懂?没关系,听我一点点解释: 众所众知,IE虽然是浏览器界的老大,但是

url从输入到渲染页面的全过程

热门专题