免费的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

相关文章

一文详解如何在idea中快速搭建一个Spring Boot项目

《一文详解如何在idea中快速搭建一个SpringBoot项目》IntelliJIDEA作为Java开发者的‌首选IDE‌,深度集成SpringBoot支持,可一键生成项目骨架、智能配置依赖,这篇文... 目录前言1、创建项目名称2、勾选需要的依赖3、在setting中检查maven4、编写数据源5、开启热

Python常用命令提示符使用方法详解

《Python常用命令提示符使用方法详解》在学习python的过程中,我们需要用到命令提示符(CMD)进行环境的配置,:本文主要介绍Python常用命令提示符使用方法的相关资料,文中通过代码介绍的... 目录一、python环境基础命令【Windows】1、检查Python是否安装2、 查看Python的安

全面解析HTML5中Checkbox标签

《全面解析HTML5中Checkbox标签》Checkbox是HTML5中非常重要的表单元素之一,通过合理使用其属性和样式自定义方法,可以为用户提供丰富多样的交互体验,这篇文章给大家介绍HTML5中C... 在html5中,Checkbox(复选框)是一种常用的表单元素,允许用户在一组选项中选择多个项目。本

HTML5 搜索框Search Box详解

《HTML5搜索框SearchBox详解》HTML5的搜索框是一个强大的工具,能够有效提升用户体验,通过结合自动补全功能和适当的样式,可以创建出既美观又实用的搜索界面,这篇文章给大家介绍HTML5... html5 搜索框(Search Box)详解搜索框是一个用于输入查询内容的控件,通常用于网站或应用程

Python并行处理实战之如何使用ProcessPoolExecutor加速计算

《Python并行处理实战之如何使用ProcessPoolExecutor加速计算》Python提供了多种并行处理的方式,其中concurrent.futures模块的ProcessPoolExecu... 目录简介完整代码示例代码解释1. 导入必要的模块2. 定义处理函数3. 主函数4. 生成数字列表5.

Python实例题之pygame开发打飞机游戏实例代码

《Python实例题之pygame开发打飞机游戏实例代码》对于python的学习者,能够写出一个飞机大战的程序代码,是不是感觉到非常的开心,:本文主要介绍Python实例题之pygame开发打飞机... 目录题目pygame-aircraft-game使用 Pygame 开发的打飞机游戏脚本代码解释初始化部

Python中使用uv创建环境及原理举例详解

《Python中使用uv创建环境及原理举例详解》uv是Astral团队开发的高性能Python工具,整合包管理、虚拟环境、Python版本控制等功能,:本文主要介绍Python中使用uv创建环境及... 目录一、uv工具简介核心特点:二、安装uv1. 通过pip安装2. 通过脚本安装验证安装:配置镜像源(可

C++ 函数 strftime 和时间格式示例详解

《C++函数strftime和时间格式示例详解》strftime是C/C++标准库中用于格式化日期和时间的函数,定义在ctime头文件中,它将tm结构体中的时间信息转换为指定格式的字符串,是处理... 目录C++ 函数 strftipythonme 详解一、函数原型二、功能描述三、格式字符串说明四、返回值五

LiteFlow轻量级工作流引擎使用示例详解

《LiteFlow轻量级工作流引擎使用示例详解》:本文主要介绍LiteFlow是一个灵活、简洁且轻量的工作流引擎,适合用于中小型项目和微服务架构中的流程编排,本文给大家介绍LiteFlow轻量级工... 目录1. LiteFlow 主要特点2. 工作流定义方式3. LiteFlow 流程示例4. LiteF

使用Python开发一个现代化屏幕取色器

《使用Python开发一个现代化屏幕取色器》在UI设计、网页开发等场景中,颜色拾取是高频需求,:本文主要介绍如何使用Python开发一个现代化屏幕取色器,有需要的小伙伴可以参考一下... 目录一、项目概述二、核心功能解析2.1 实时颜色追踪2.2 智能颜色显示三、效果展示四、实现步骤详解4.1 环境配置4.