免费的HTML5连载来了《HTML5网页开发实例详解》连载(五)图解通过Fiddler加速开发

本文主要是介绍免费的HTML5连载来了《HTML5网页开发实例详解》连载(五)图解通过Fiddler加速开发,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

  Fiddler是Windows底下最强大的请求代理调试工具,监控任何浏览器的HTTP/HTTPS流量,窜改客户端请求和服务器响应,解密HTTPS Web会话,图4.44为Fiddler原理示意图。

 

图4.44  Fiddler原理示意图

Fiddler安装的系统要求为Windows XP或Windows 8中的版本,其中Fiddler2依赖于Microsoft.NET Framework 2.0,最新的Fiddler4依赖于Microsoft.NET Framework 4.0。

Fiddler功能很多,在这里介绍一项最常用的代理功能。假使在维护的网站线上有个功能出现脚本问题,这时候采用传统的方法,将网页内容完整的保存到本地,然后调试对应的代码,很显然这种方法显得特点笨重,Fiddler解决这个问题显得游刃有余。要做的是,将对应问题脚本保存到机器本地,修改脚本并通过Fiddler代理,下面通过一个百度首页的操作示例演示该过程。

(1)开启Fiddler,选中其右侧“AutoResponder”标签页,勾选“Enable automatic responses”和“Unmatched requests passthrough”复选框,如图4.45所示。

图4.45  开启Fiddler

(2)打开Chrome浏览器,在地址栏内输入“http://www.baidu.com”并按Enter键进入,此时百度首页的请求会被完整的显示在Fiddler左侧的列表中,如图4.46所示。

图4.46  百度首页请求列表

(3)选中列表中的第5条请求(该请求为JavaScript脚本),在该请求上方单击并拖动至右侧“AutoResponder”标签页下方空白的列表中,如图4.47所示。

图4.47  代理一条脚本请求

(4)复制第5条请求的URL地址,使用浏览器打开并将脚本内容保存到机器本地文件夹

(5)在刚才保存的脚本末尾添加1行代码:

document.body.style.backgroundColor='black'                                                                  // 修改页面背景色为黑色

(6)修改Fiddler右侧“AutoResponder”标签页下方列表的“then respond width..”列,将其指向本地保存的脚本代码地址,如图4.48所示。

 

图4.48  修改请求的本地代理地址

(7)打开Chrome浏览器,在地址栏内输入“http://www.baidu.com”并按Enter键进入,此时百度首页变为黑色,Fiddler代理成功。

提示:示例中完成的功能只是一种简单的模拟,读者在实际开发中可以通过Fiddler代理,修改本地脚本的具体代码,再结合Chrome浏览器的调试功能,解决网站的线上问题将变得简单且高效。

 

学习HTML5最好的书就是《HTML5网页开发实例详解》,用代码学习用案例学习,可比看文字有趣多了!!!一本书搞定HTML5,从现在开始。

这篇关于免费的HTML5连载来了《HTML5网页开发实例详解》连载(五)图解通过Fiddler加速开发的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1076869

相关文章

网页解析 lxml 库--实战

lxml库使用流程 lxml 是 Python 的第三方解析库,完全使用 Python 语言编写,它对 XPath表达式提供了良好的支 持,因此能够了高效地解析 HTML/XML 文档。本节讲解如何通过 lxml 库解析 HTML 文档。 pip install lxml lxm| 库提供了一个 etree 模块,该模块专门用来解析 HTML/XML 文档,下面来介绍一下 lxml 库

Vue3 的 shallowRef 和 shallowReactive:优化性能

大家对 Vue3 的 ref 和 reactive 都很熟悉,那么对 shallowRef 和 shallowReactive 是否了解呢? 在编程和数据结构中,“shallow”(浅层)通常指对数据结构的最外层进行操作,而不递归地处理其内部或嵌套的数据。这种处理方式关注的是数据结构的第一层属性或元素,而忽略更深层次的嵌套内容。 1. 浅层与深层的对比 1.1 浅层(Shallow) 定义

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明(认真看哦) AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证,则会调用 #attemptAuthentica

这15个Vue指令,让你的项目开发爽到爆

1. V-Hotkey 仓库地址: github.com/Dafrok/v-ho… Demo: 戳这里 https://dafrok.github.io/v-hotkey 安装: npm install --save v-hotkey 这个指令可以给组件绑定一个或多个快捷键。你想要通过按下 Escape 键后隐藏某个组件,按住 Control 和回车键再显示它吗?小菜一碟: <template

【 html+css 绚丽Loading 】000046 三才归元阵

前言:哈喽,大家好,今天给大家分享html+css 绚丽Loading!并提供具体代码帮助大家深入理解,彻底掌握!创作不易,如果能帮助到大家或者给大家一些灵感和启发,欢迎收藏+关注哦 💕 目录 📚一、效果📚二、信息💡1.简介:💡2.外观描述:💡3.使用方式:💡4.战斗方式:💡5.提升:💡6.传说: 📚三、源代码,上代码,可以直接复制使用🎥效果🗂️目录✍️

Hadoop企业开发案例调优场景

需求 (1)需求:从1G数据中,统计每个单词出现次数。服务器3台,每台配置4G内存,4核CPU,4线程。 (2)需求分析: 1G / 128m = 8个MapTask;1个ReduceTask;1个mrAppMaster 平均每个节点运行10个 / 3台 ≈ 3个任务(4    3    3) HDFS参数调优 (1)修改:hadoop-env.sh export HDFS_NAMENOD

【前端学习】AntV G6-08 深入图形与图形分组、自定义节点、节点动画(下)

【课程链接】 AntV G6:深入图形与图形分组、自定义节点、节点动画(下)_哔哩哔哩_bilibili 本章十吾老师讲解了一个复杂的自定义节点中,应该怎样去计算和绘制图形,如何给一个图形制作不间断的动画,以及在鼠标事件之后产生动画。(有点难,需要好好理解) <!DOCTYPE html><html><head><meta charset="UTF-8"><title>06

嵌入式QT开发:构建高效智能的嵌入式系统

摘要: 本文深入探讨了嵌入式 QT 相关的各个方面。从 QT 框架的基础架构和核心概念出发,详细阐述了其在嵌入式环境中的优势与特点。文中分析了嵌入式 QT 的开发环境搭建过程,包括交叉编译工具链的配置等关键步骤。进一步探讨了嵌入式 QT 的界面设计与开发,涵盖了从基本控件的使用到复杂界面布局的构建。同时也深入研究了信号与槽机制在嵌入式系统中的应用,以及嵌入式 QT 与硬件设备的交互,包括输入输出设

OpenHarmony鸿蒙开发( Beta5.0)无感配网详解

1、简介 无感配网是指在设备联网过程中无需输入热点相关账号信息,即可快速实现设备配网,是一种兼顾高效性、可靠性和安全性的配网方式。 2、配网原理 2.1 通信原理 手机和智能设备之间的信息传递,利用特有的NAN协议实现。利用手机和智能设备之间的WiFi 感知订阅、发布能力,实现了数字管家应用和设备之间的发现。在完成设备间的认证和响应后,即可发送相关配网数据。同时还支持与常规Sof

活用c4d官方开发文档查询代码

当你问AI助手比如豆包,如何用python禁止掉xpresso标签时候,它会提示到 这时候要用到两个东西。https://developers.maxon.net/论坛搜索和开发文档 比如这里我就在官方找到正确的id描述 然后我就把参数标签换过来